我们利用d3滤镜为d3元素增加光的效果
我们存一些全局变量
this.animateOption = null;
this.defs = null;
this.animateId = "";
this.feDropShadow = null;
滤镜初始化
function create(option){
this.animateOption = option;
this.defs = this.svg.append("defs");
let linearGradient = this.defs.append("filter")
.attr("id",this.animateOption.id)
.attr("x","-50%")
.attr("y","-50%")
.attr("width","200%")
.attr("height","200%")
this.feDropShadow = linearGradient.append("feDropShadow")
.attr("dx", "0")
.attr("dy","0")
.attr("stdDeviation","0")
.attr("flood-color",this.animateOption.floodColor)
}
启动滤镜
```javascript
function start(){
let multiplier = this.animateOption.speed;
let xDiff= 0.01;
let yDiff= 0.01;
let that = this;
function setBlur(x,y){
that.feDropShadow.attr("stdDeviation",x);
}
let flag = true;
(function updateMotionBlur(){
更多参考 https://xiaozhuanlan.com/topic/8193652740
网友评论