在d3.js插件texture基础上加上渐变效果

在d3.js插件d3.textures基础上加上渐变效果，兼容texture原来的api，目前只有line的渐变，且方向只能垂直，其他图形方向后面有兴趣再写

d3.textures

使用方式 npm install textures-gradient demo

import texturesGradient from 'textures-gradient' const svg = d3 .select("#example") .append("svg") .attr("width", 500) .attr("height", 500); const tg = texturesGradient .lines() .thicker() .size(4) .strokeWidth(1) .linearGradient([ { start: 0, stop: 25, startColor: "green", stopColor: "blue" }, { start: 25, stop: 50, startColor: "yellow", stopColor: "white" }, { start: 50, stop: 75, startColor: "orange", stopColor: "red" }, { start: 75, stop: 100, startColor: "#132413", stopColor: "#c1c1c1" }, ]); const rect = svg.append("rect").attr("width", 500).attr("height", 500); svg.call(tg);//调用之前svg必须有高宽 rect.style("fill", t.url());