<!DOCTYPE html> <meta charset = "UTF-8"> <head> <title>SVG path line Generator</title> </head> <style> path { fill: green; stroke: #aaa; } </style> <body> <svg width = "600" height = "100"> <path transform = "translate(200, 0)" /> </svg> <script src = "https://d3js.org/d3.v4.min.js"></script> <script> var data = [[0, 20], [50, 30], [100, 50], [200, 60], [300, 90]]; var lineGenerator = d3.line(); var pathString = lineGenerator(data); d3.select('path').attr('d', pathString); </script> </body> </html>
We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy. Accept Learn more