Josiahhx opened a new issue, #17348:
URL: https://github.com/apache/echarts/issues/17348
### Version
5.3.3
### Link to Minimal Reproduction
_No response_
### Steps to Reproduce
**1. create chart**
` <div ref="chart" class="chartEntityShow"
v-show="chartEntityVisible"></div>`
vue
```
if (this.chart === null) {
this.chart = echarts.init(this.$refs.chart)
}
```
**2. option**
```
let option = {
//图例位置
legend: [{
x: 'left',//图例位置
data: ['创新实体', '属性值']//关系图中需要与series中的categories的name保持一致
}],
//提示框
tooltip: {
confine: true,
formatter: function (x) {
let result = ''
if (x.data.des !== undefined) {
if (x.data.des.length >= 4) {//换行显示
// result = `<div style="display:block;max-width:
400px;word-break: break-all;word-wrap:
break-word;white-space:pre-wrap">${x.data.des}</div>`
}
}
return result//设置提示框的内容和格式 节点和边都显示des属性
},
},
series: [{
type: 'graph', // 类型:关系图
layout: 'force', //图的布局，类型为力导图
symbolSize: 40, // 调整节点的大小
roam: true, // 是否开启鼠标缩放和平移漫游。默认不开启。如果只想要开启缩放或者平移,可以设置成 'scale' 或者
'move'。设置成 true 为都开启
edgeSymbol: ['circle', 'arrow'],
edgeSymbolSize: [2, 10],
//箭头标签
edgeLabel: {
show: true,
formatter: function (x) {
return x.data.name;
}
},
force: { //力场之间的影响因子
repulsion: 300,
gravity: 0.1,
friction: 0.6,
edgeLength: 200,
layoutAnimation: true,
},
//拖拽
// draggable: true,
// dataRange:{
// itemGap: 30
// },
lineStyle: {
width: 2,
color: '#4b565b',
curveness: 0.3
},
label: {
show: true,
textStyle: {}
},
//聚焦显示
emphasis: {
focus: 'adjacency',
lineStyle: {
width: 10
}
},
data: newChartData,
links: newChartLink,
categories: [
{
name: '创新实体'
},
{
name: '属性值'
}]
}]
}
this.chart.setOption(option, true)
```
3. problem
只有当我删除或新增节点时这样使id连续才能将新增节点进行连线，否则不能。
例如目前有节点id 0~5，添加新节点id为999时，不能将节点id0和999连线，还会可能出现乱连线的错误。
当我新增节点id为6时，可以正常连线。
删除节点也同理
下面是我能正常常增加节点或删除节点的简单操作
```
test() {
let option = this.chart.getOption()
//增加节点START
// option.series[0].data.push({name: '测试节点', category: 1, id: 6, des:
'测试描述'})
// option.series[0].links.push({source: 0, target: 6, name: '测试连线'})
//增加节点END
//删除节点START
let data = option.series[0].data
let link = option.series[0].links
let flag = -1
for(let i = 0; i<data.length;i++){
if (data[i].id===1){
data.splice(i,1)
link.splice(i-1,1)
flag = i
}
}
for(let i = flag; i<data.length;i++){
data[i].id--
if (i!==data.length){
link[i-1].target--
}
}
this.chart.setOption(option)
//删除节点END
}
```
### Current Behavior
不能正常增删节点连线
### Expected Behavior
不用使节点id连续，就能正常进行增删节点。
### Environment
```markdown
- OS:windows11
- Browser:edge
- Framework:vue@2
```
### Any additional comments?
_No response_
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
