Home
<!doctype html> <html> <head> <script src="https://d3js.org/d3.v4.min.js"></script> </head> <style> svg rect { fill: orange; } svg text { fill:white; font: 10px sans-serif; text-anchor: end; } </style> <body> <svg class="chart" width="420" height="120"> <g transform="translate(0,0)"> <rect width="50" height="19"></rect> <text x="47" y="9.5" dy=".35em">5</text> </g> <g transform="translate(0,20)"> <rect width="100" height="19"></rect> <text x="97" y="9.5" dy=".35em">10</text> </g> <g transform="translate(0,40)"> <rect width="120" height="19"></rect> <text x="117" y="9.5" dy=".35em">12</text> </g> </svg> </body> </html>
Result: