| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <body> | |
| <script src="//d3js.org/d3.v3.min.js"></script> | |
| <script> | |
| var width = 960, | |
| height = 500; | |
| var svg = d3.select("body").append("svg") | |
| .attr("width", width) | |
| .attr("height", height); | |
| var gradient = svg.append("defs") | |
| .append("linearGradient") | |
| .attr("id", "gradient") | |
| .attr("x1", "0%") | |
| .attr("y1", "0%") | |
| .attr("x2", "100%") | |
| .attr("y2", "100%") | |
| .attr("spreadMethod", "pad"); | |
| gradient.append("stop") | |
| .attr("offset", "0%") | |
| .attr("stop-color", "#0c0") | |
| .attr("stop-opacity", 1); | |
| gradient.append("stop") | |
| .attr("offset", "100%") | |
| .attr("stop-color", "#c00") | |
| .attr("stop-opacity", 1); | |
| svg.append("rect") | |
| .attr("width", width) | |
| .attr("height", height) | |
| .style("fill", "url(#gradient)"); | |
| </script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment