美文网首页
echart 关系图graph 正确显示legend

echart 关系图graph 正确显示legend

作者: 惊破霓裳羽衣曲 | 来源:发表于2019-01-04 00:16 被阅读0次

问题

使用echart展示知识图谱时,我参照官网的demo,很快就用自己的测试数据(包含node、link )实现了demo的效果。但是遇到一个问题,图例 legend 没有正确显示。

硬编码了图例,竟然 只显示legend ,不显示 graph。
开始仔细看文档
....
查看其它chart 比如 line 或者 bar ,
legend data 数组的各项名称,要与 series 各项的 name 相同。但是很难套用给 graph。

解决方案

通过 categories 对应 每一个node 的 category,category 可以是 index,
options 如下:

  options = {
    legend: [{
      data: ['人物', '实体']
    }],
    series: [
      {
        categories: [
          { name: '人物' },
          { name: '实体' },
        ],

        nodes: [{
          id: 0,
          name: '唐纳德·特朗普',
          category: '人物',
          x: 300,
          y: 300
        }, {
          id: 1,
          name: '特朗普大厦',
          category: '实体',
          x: 800,
          y: 300
        }
      ],
      }
    ]
  };

相关文章

  • echart 关系图graph 正确显示legend

    问题 使用echart展示知识图谱时,我参照官网的demo,很快就用自己的测试数据(包含node、link )实现...

  • echart 关系图

    首先安装echart,打开终端,进入项目目录,输入以下命令进行安装 子组件chart.vue 父组件 index....

  • Echart - legend 图例组件

    legend.type图例的类型。可选值:'plain':普通图例。缺省就是普通图例。'scroll':可滚动翻页...

  • Echart不显示地图问题

    Echart不显示地图的问题 使用百度Echart的时候遇到不会显示地图的问题,是现在Echart不直接提供地图需...

  • 【echarts】饼图

    饼图显示百分比 legend里用formatter格式化 标题居中 textStyle => align:"cen...

  • matplotlib可视化篇legend()--图例

    matplotlib.pyplot.legend()用来显示图例,legend基础语法及用法,官方文档 常用参数列...

  • Spark Core2--LineAge

    Lineage RDD Lineage(又称为RDD运算图或RDD依赖关系图)是RDD所有父RDD的graph(图...

  • echarts使用感受

    一.Echart基本图表显示与地图显示将各种图形拆分为交互组件,各组件接收特定参数实现效果 echart实例生成每...

  • echart改变legend样式及分页

    找了好多都是无用代码,终于在勤勤恳恳的百度下,终于找到你!感谢博主的分享:原文:https://www.cnblo...

  • ROS Tutorials: Publisher 与 Subsc

    0. rqt_graph 显示当前所有节点的关系 1. Create Publisher talker.cpp: ...

网友评论

      本文标题:echart 关系图graph 正确显示legend

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