1.0.11 • Published 3 years ago

textures-gradient v1.0.11

Weekly downloads
-
License
MIT
Repository
github
Last release
3 years ago

textures-gradient

在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());

example

1.0.9

3 years ago

1.0.8

3 years ago

1.0.11

3 years ago

1.0.10

3 years ago

1.0.7

3 years ago

1.0.2

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago