echarts 迁徙图 图例点击事件出错

使用echarts3 做出类似迁徙图的效果如下:

clipboard.png

但是点击图例的时候,并没有将图例所对应的系列隐藏,该系列对应的线还存在,只是该系列对应的effect特效静止不动了。

核心代码如下:
internal.bigHieChart = echarts.init($("#bigHie")[0]);

        var option = {
            tooltip: {
                trigger: "item",
                formatter: "{b}"
            },
            geo: {
                map: "xiamen",
                label: {
                    normal: {
                        show: true,
                        color: "#c1bfbf"
                    },
                    emphasis: {
                        show: true,
                        color: "#c1bfbf"
                    }
                },
                selectedMode: "single",
                roam: true,
                itemStyle: {
                    normal: {
                        areaColor: "#003874",
                        borderColor: "#111",
                        borderWidth: "1.4"
                    },
                    emphasis: {
                        areaColor: "#0157af",
                        borderWidth: "1.5",
                        fontSize : 14
                    }
                }
            },
            legend : {
                left:10,
                selectedMode : true,
                textStyle : {
                    color : "#bbe7ff",
                    fontFamily : "微软雅黑",
                    fontWeight : "lighter"
                },
                data : [
                    { name : "上转" },
                    { name : "下转" }
                ]
            },
            series: [{
                name : "上转",
                type: "lines",
                zlevel: 2,
                effect: {
                    show: true,
                    period: 6,
                    symbol: "pin",
                    symbolSize: 7,
                    //trailLength: 0
                },
                lineStyle: {
                    normal: {
                        color: "#00cb95",
                        width: 1,
                        opacity: 0.4,
                        curveness: 0.5
                    }
                },
                data: flowData.hosFlowList
            },
                {
                    name : "下转",
                    type: "lines",
                    zlevel: 3,
                    effect: {
                        show: true,
                        period: 6,
                        symbol: "pin",
                        symbolSize: 7,
                      //  trailLength: 0
                    },
                    lineStyle: {
                        normal: {
                            color: "#F58158",
                            width: 1,
                            opacity: 0.4,
                            curveness: 0.3
                        }
                    },
                    data: flowData.phipFlowList
                },
                {
                    type: "effectScatter",
                    coordinateSystem: "geo",
                    zlevel: 4,
                    rippleEffect: {
                        period: 0,
                        scale:0,
                        brushType: "stroke" //stroke fill
                    },

                    symbolSize: 3,
                    label: {
                        normal: {
                            show: false,
                            position: "right",
                            formatter: "{b}"
                        }
                    },
                    symbol: "circle",
                    itemStyle: {
                        normal: {
                            color: "#c8efef",
                            borderColor: "#c8efef"
                        }
                    },
                    data: flowData.orgList
                }
            ]
        };
        internal.bigHieChart.setOption(option);

        internal.bigHieChart.on("click", function (params) {
            if (typeof params.region == "object") {
                if (params.region.selected) {
                    internal.bigHieChart.dispatchAction({
                        type: "geoSelect",
                        name: params.name
                    });
                } else {
                    internal.bigHieChart.dispatchAction({
                        type: "geoUnSelect",
                        name: params.name
                    });

                }
            }
        });

        internal.bigHieChart.on("geoselected", function (params) {
  
            req.getHieAmount(params.name, internal.setHieAmount);
        });

        internal.bigHieChart.on("geounselected", function (params) {
         
            req.getHieAmount("", internal.setHieAmount);
        });
    },
    
    
    我将图例相关代码拷贝在
    http://gallery.echartsjs.com/editor.html?c=xr1XLo-V5g
    这个上面尝试图例的点击事件一切正常。
    不清楚为什么自己写的就会报错。
    求教各位,谢谢
阅读 4k
1 个回答

换成最新版本的echarts就可以了。。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题