美文网首页
arcgis js 4 使用d3.js 添加滤镜光

arcgis js 4 使用d3.js 添加滤镜光

作者: haibalai | 来源:发表于2022-04-26 14:30 被阅读0次

    我们利用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

    相关文章

      网友评论

          本文标题:arcgis js 4 使用d3.js 添加滤镜光

          本文链接:https://www.haomeiwen.com/subject/mmocyrtx.html