echart 桑基图禁止节点可拖拽

351 阅读1分钟

echart里面的桑基图默认节点是可以拖拽的

如果想禁止拖拽节点需要在series下面添加

 draggable: false,

完整代码


 let option = {
    tooltip: {
      trigger: "item",
      triggerOn: "mousemove",
    },
    animation: false,
    grid: {
      right: 0,
    },
    series: [
      {
        draggable: false,
        type: "sankey",
        bottom: "10%",
        emphasis: {
          focus: "adjacency",
        },
        data: [
          {
            name: "工资",
            itemStyle: {
              color: "#5AAEF3",
            },
          },
          { name: "房租" },
          { name: "地铁费" },
          { name: "食物" },
          { name: "话费" },
          { name: "衣服" },
          { name: "定期存款" },
        ],
        links: [
          { source: "工资", target: "房租", value: 800 },
          { source: "工资", target: "地铁费", value: 240 },
          { source: "工资", target: "食物", value: 1500 },
          { source: "工资", target: "话费", value: 48 },
          { source: "工资", target: "衣服", value: 200 },
          { source: "工资", target: "定期存款", value: 7000 },
        ],
        orient: "vertical",
        label: {
          position: "top",
        },
        lineStyle: {
          color: "source",
          curveness: 0.5,
        },
      },
    ],
  };

效果

image.png