echarts关系图graph报错

最新推荐文章于 2024-08-09 18:14:48 发布
最新推荐文章于 2024-08-09 18:14:48 发布
阅读量2.7k 收藏 1
点赞数 2
分类专栏： 图表类 文章标签： es6 node.js vue.js reactjs 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42264793/article/details/108386038
版权
在使用Echarts构建数据生态架构时，遇到关系图报__focusNodeAdjacency of undefined的问题。解决方案是将layout从'none'改为'force'。原因是'none'布局需要数据中包含节点的x，y位置，而'force'布局或'circular'布局则不需要这些信息。未提供节点位置数据时，选择'force'或'circular'可避免报错。
摘要由CSDN通过智能技术生成

echarts关系图 报错__focusNodeAdjacency of undefined

// echarts关系图 报错
Uncaught TypeError: Cannot read property '__focusNodeAdjacency' of undefined
    at GraphView.js:184
    at Graph.graphProto.eachEdge (Graph.js:250)
    at ExtendedClass.render (GraphView.js:181)
    at Task.progress (Chart.js:265)
    at doProgress (task.js:219)
    at Task.taskProto.perform (task.js:142)
    at echarts.js:1574
    at ExtendedClass.<anonymous> (Global.js:531)
    at Array.forEach (<anonymous>)
    at each$1 (util.js:295)

在开发数据生态架构时，用到了Echarts的关系图，当时遇到了这个问题，给大家分享一下。

series: [{
		type: 'graph',
		layout: 'none',//是因为设置成了 ‘none’
		draggable: true,
		roam: true,
		focusNodeAdjacency: true,
		......

解决办法：
把layout：'none’改成layout：‘force’，
就好使了。

简单说一下原因：

layout 

最低0.47元/天 解锁文章
绅士的可怖
关注
专栏目录
IGraphBuilder::Render() 引发的错误：0x80040154 (REGDB_E_CLASSNOTREG)
beckle_ye的专栏
04-22 1882
最近搞毕业设计，研究起了DirectShow，看了一个网络传输MPEG视频的源码，编译运行，发现客户端接收的视频没法显示出来，但是写入的文件是可以被正确播放的。最后调试跟踪到是这一句出了问题：HRESULT hr  = m_pGB->Render(m_pSourceReader->GetPin(0));返回错误： hr 0x80040154 没有注册类一开始在MSDN上搜索错误码 没有找到0x80040154的说明，于是在Google上搜索，只搜出了10几条相关内容，看了以后，说的好像是什么DLL没有注册，
echarts鼠标覆盖高亮显示节点及关系名称详解
11-29
本文在echart自带的focusNodeAdjacency属性上进行修改。 1、效果 先上效果，原来是鼠标覆盖之后只显示节点名称不显示关系名称。 修改之后可以既显示节点名称又显示（自定义的）关系名称。 2、代码 html部分就这样。 <div id=”main”></div> js代码，使用了jquery和echarts.js，用的是源代码那版，因为待会要进源代码里修改…… echarts.js下载地址 其实js代码和echart官网demo的代码完全没区别…… 普通的力图设置，只要加上focusNodeAdjacency : true即可。 $(function() { show
记 echarts 关系图 整条关系高亮效果
qq_29058643的博客
03-23 2002
focusNodeAdjacency: true的效果是实现相两个节点高亮不满足项目需求的；有了上面的思路，后面退而求次，选择采用双击，重新绘制整条关系图，再次双即绘制完整关系图。翻遍全网看到有个朋友说用使用dispatchAction手动控制高亮。项目需求是 鼠标移入节点，该节点所在的整条直系关系高亮。这方法我后面仅仅实现了所以的点高亮，线没有高亮。
学习大数据DAY35 利用 echarts 的开源图表和 python 异常处理优化网站
最新发布
shh2000424的博客
08-09 1227
经过4天的早九晚八豆瓣开发，我又一次感受到了程序员的不容易，这都是想从事IT行业要经历的。测试添加电影类型的编号，整数（系统异常）及正整数（自定义异常）显示统计报表：统计各分数的数量，使用柱状图和饼状图分别实现。注：录制豆瓣网完整视频传到班级微信群。可以根据需要自行选择需要的模版。根据自己选择的模版准备好需要的。可以自行扩展一个自己喜欢的模版。分别修改里面的数据源为动态。可视化就是动态的，也成功将。添加异常，自己测试错误信息。父类的增删改方法添加异常。柱状图显示，有部分修改。饼状图部分，有部分修改。
Echarts关系图的配置项，一文全解，一目了然。
贝格前端工场的博客
05-03 1641
ECharts 是一个由百度开发的开源可视化库，用于创建丰富的交互式数据可视化图表。关系图（Relationship Graph）是 ECharts 中的一种图表类型，用于展示节点之间的关系和连接。关系图通常用于展示复杂的网络结构，比如社交网络中的好友关系、组织结构中的人员关系、物流网络中的节点连接等。关系图由节点和边组成，节点代表网络中的实体，边代表节点之间的连接关系。
echarts graph关系图报错：Cannot set properties of undefined (setting ‘dataIndex‘)
weixin_42043252的博客
11-26 7328
项目场景：使用Echarts的graph关系图时报错：Cannot set properties of undefined (setting ‘dataIndex’) 原因及解决方法：data中有name重复的数据，去掉即可。
echarts 图标之间的连线不显示
qq_39750019的博客
07-08 2508
问题描述：描绘关系图，节点展示出来了，但是节点间的连线没有显示 加断点，一步一步排查，最后发现是数据格式的问题 layout:：‘force’，要求数据是字符串，处理一下数据就显示出来了
echarts关系图 报错 focusNodeAdjacency undefined
Ninewu的博客
07-16 2511
昨天画echarts 关系图，遇到一个报错，找了好久没有找到问题所在，所记录一下 后来才发现是因为，没有设置layout属性 但layout写none 还会报错 然后看了一下其他的关系图 把layout：'none’改成layout：‘force’ 显示正常 ...
echart折线图连线不显示问题总结
flyhose的博客
01-05 7910
echart折线图，series动态数据不能有空数据，不然，只有数据点，而连线出不来。
echarts关系图(力引导)拖动节点不还原位置
01-03
echarts关系图(力引导)拖动节点不还原位置,在init创建时第三个参数对象添加myOpts_:{draggableFixed_:...创建一个拖动不还原的力引导关系图(需要 type: 'graph',layout:'force',draggable :true,且所有节点fixed:true)
echart 图谱_vue + echarts 实现有层级关系图的图谱
weixin_42326661的博客
01-12 3207
因为接下来要做的事是一个关系图的东西，所以自己先写一个小demo，特次记录一下，主要实现的点有如下：节点的颜色的更改自定义提示框配置，以及在里面的点击事件提示框中的点击事件可以获取到vue实例图列的自定义先上效果图截屏2020-11-18下午4.31.28.png我们说关键吧：颜色的配置，直接配置color ，它是一个数组，不同级别的的节点根据数组来color:['red', 'orange', ...
echarts做企业关系图谱_Echarts绘制关系图（一）
weixin_39636898的博客
12-20 1734
关系图何为关系图，从字面上可以看出，为关系的图形，既然为关系，那么就需要有点以及关系，用来表示点与点之间的联系。所以我们可以得出：关系图需要两个必要的元素，节点，关系，其中关系需要包含有联系的节点以及节点联系说明。因此我们首先需要将数据设计出来。数据节点数据nodes:[{name:'节点名',id:'节点id'}]关系数据links:[{relation:{name:'关系名称',id:'关系i...
echarts报错Uncaught SyntaxError: Unexpected token ‘＜‘
逍遥在南方的博客
02-18 6482
问题重现 最近需要研究echarts做图表，打算在html中先引用echarts试试。 于是百度到echarts官网的教程：5 分钟上手 ECharts <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>ECharts</title> <!-- 引入 echarts.js --> <script src="echart
echarts渲染graph关系图，节点数少的情况，不显示连接边
weixin_59191887的博客
06-14 508
echarts渲染graph关系图，当节点数目很少的时候，节点之间的连接边不显示，节点们只是聚集在一起，节点之间有空隙，但是没有连线，我拖拽节点，也没有边。节点数据的id字段改为字符串类型，不要用int。还有边数据的source,target也要改成字符串类型。
echarts graph图使用了focusNodeAdjacency:true,遇到的文字显示问题
kkhk04的博客
02-13 9046
最近项目中用echarts画的type:”graph” 图需要这么一个功能，就是在鼠标滑动到（其实本来想要点击时触发的，但是经过探索之后发现graph图不支持 focusNodeAdjacencyOn: 'click', 这一属性设置，而用echarts version 4.0+的扩展echarts-gl画的type:” graphGL”是支持这一属性的）某个节点上的时候，把图中与此节点相关的...
ecahrts图表之关系图踩过的坑
qq_29758101的博客
02-14 213
1.legend与series的categories搭配使用，设置颜色标识 2.tooltip: { // 提示框的配置 formatter: function(param) { if (param.dataType=='edge'){ return ; ...
echarts控制台警告：DEPRECATED: ‘normal‘ hierarchy in itemStyle has been removed since 4.0.
zhangxiaodui的博客
11-04 6998
echarts控制台警告：normal字段弃用
echarts关系图graph修改图片，自定义鼠标节点和线悬停，图片下载，拖拽，右键弹框等功能的实现
热门推荐
笑到世界都狼狈的博客
09-04 1万+
1.首先看一下效果图： 2.代码目录结构 3.参考地址：https://gallery.echartsjs.com/editor.html?c=xCLEj67T3H 4.代码部分：（如果不懂，可以看我之前写的关于echarts树图tree部分的代码，步骤都比较清楚，所以这边我直接上全部代码了，就不拆分解释说明了） <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8".
echarts 关系图 图片
09-09
很抱歉，作为一个文本AI模型，我无法直接显示图片。但是，你可以通过以下步骤来获取Echarts关系图的图片： 1. 首先，你需要安装Echarts库。你可以在Echarts的官方网站（https://www.echartsjs.com/zh/index.html）上找到安装和使用文档。 2. 使用Echarts创建你想要的关系图，并将其保存为图片。你可以使用Echarts提供的API和配置选项来定义图表的样式和数据。 3. 保存关系图为图片。Echarts提供了`echarts.convertToImage`方法，可以将关系图转换为图片，并可以选择下载或保存。 以下是一个简单的示例代码，展示了如何使用Echarts创建一个关系图并保存为图片： ```javascript // 引入Echarts库 import echarts from 'echarts'; // 创建一个关系图实例 const chart = echarts.init(document.getElementById('chart-container')); // 配置关系图的样式和数据 const option = { // 配置选项... series: [{ type: 'graph', // 数据... }] }; // 设置关系图的配置项 chart.setOption(option); // 将关系图转换为图片 chart.convertToImage({ type: 'png', // 图片类型 pixelRatio: 1, // 分辨率 backgroundColor: '#fff', // 背景颜色 }); // 保存关系图为图片 chart.saveAsImage('relation_chart.png'); ``` 请确保你已经正确安装了Echarts库，并在HTML文件中添加了一个具有唯一id的div元素（例如`<div id="chart-container"></div>`）作为关系图的容器。 希望这能帮到你！如果你有任何其他问题，请随时提问。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

绅士的可怖

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值