You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/12/02 07:38:21 UTC
[GitHub] [echarts] zhangjian970604 opened a new issue #16159: [Bug] After echarts 4 is upgraded to Echarts 5, the setOption effect of the graph is lost
zhangjian970604 opened a new issue #16159:
URL: https://github.com/apache/echarts/issues/16159
### Version
5.2.0
### Link to minimal reproduction
https://www.makeapie.com/editor.html?c=xrD2nokbFH
### Steps To Reproduce
1、实际项目中我使用echarts、vue、vue-echarts开发代码。
2、我在ECharts Gallery上写了一个简单的demo，仅使用echarts，发现问题依旧存在，
地址: https://www.makeapie.com/editor.html?c=xrD2nokbFH
### Current Behavior
1、由于我需要使用echarts5版本的series(graph)-->lineStyle-->dashOffset属性，所以我讲echarts从4版本升级至5.
2、原先基于4.7.0版本时，我使用setOption方法，实现了关系图拖拽一个节点之后，不会影响其他节点的位置。
3、而当我将版本升级至5.2.0，我再次使用setOption方法，关系图拖拽一个节点，其他节点的位置变动了，我认为是
因为赋值新的x、y属性导致最大值变化，所有节点的相对位置改变。
### Expected Behavior
1、在echarts5版本的前提下。
2、关系图采用力引导布局，可以拖拽、缩放。
3、关系图拖拽一个节点后，可以固定在当前的位置，其他节点位置不会变化
### Environment
```markdown
- OS: window 10
- Browser: Chrome
- Framework: vue@2.6.12
```
### 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: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] zhangjian970604 removed a comment on issue #16159: [Bug] After echarts 4 is upgraded to Echarts 5, the setOption effect of the graph is lost
Posted by GitBox <gi...@apache.org>.
zhangjian970604 removed a comment on issue #16159:
URL: https://github.com/apache/echarts/issues/16159#issuecomment-984398152
- let dashOffsetNum = 0;
- option = {
- series: [
- {
- id: 'seres1',
- name: 'series1',
- type: 'graph',
- layout: 'force',
- draggable: true,
- roam: true,
- force: {
- repulsion: 20,
- gravity: 0.1,
- edgeLength: 15,
- },
- lineStyle: {
- type: 'dashed',
- opacity: 0.9,
- width: 2,
- curveness: 0.2,
- color: '#409EFF',
- dashOffset: dashOffsetNum,
- },
- data: [
- {
- id: 'data1',
- x: 0,
- y: 0,
- fixed: true,
- },
- {
- id: 'data2',
- x: -34.8,
- y: 20,
- fixed: true,
- },
- {
- id: 'data3',
- x: 34.8,
- y: 20,
- fixed: true,
- },
- {
- id: 'data4',
- x: 0,
- y: -32.9,
- fixed: true,
- },
- ],
- links: [
- {
- id: 'links1',
- source: 'data1',
- target: 'data2',
- },
- {
- id: 'links2',
- source: 'data1',
- target: 'data3',
- },
- {
- id: 'link3',
- source: 'data1',
- target: 'data4',
- },
- ],
- },
- ],
- };
- setInterval(function () {
- dashOffsetNum++;
- let dashOffsetOption = myChart.getOption();
- dashOffsetOption.series[0].lineStyle = {
- type: 'dashed',
- opacity: 0.9,
- width: 2,
- curveness: 0.2,
- color: '#409EFF',
- dashOffset: dashOffsetNum,
- };
- myChart.setOption(dashOffsetOption);
- }, 100);
-
- myChart.on('mouseup', function (params) {
- let coordinates = myChart.convertFromPixel({ seriesName: 'series1' }, [params.event.offsetX, params.event.offsetY]);
- let newOption = myChart.getOption();
- newOption.series[0].data = newOption.series[0].data.map((item) => {
- if (item.id === params.data.id) {
- item.x = coordinates[0];
- item.y = coordinates[1];
- item.fixed = true;
- }
- return item;
- });
- //echarts@5.2.0
- setTimeout(function () {
- myChart.setOption(
- { series: newOption.series },
- {
- notMerge: false,
- replaceMerge: 'series',
- }
- );
- }, 1000);
-
- //echarts@4.7.0
- // setTimeout(function() {
- // myChart.setOption(newOption.series, {
- // notMerge:false,
- // replaceMerge:'series'
- // });}, 1000);
- });
-
--
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: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] zhangjian970604 closed issue #16159: [Bug] After echarts 4 is upgraded to Echarts 5, the setOption effect of the graph is lost
Posted by GitBox <gi...@apache.org>.
zhangjian970604 closed issue #16159:
URL: https://github.com/apache/echarts/issues/16159
--
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: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] zhangjian970604 commented on issue #16159: [Bug] After echarts 4 is upgraded to Echarts 5, the setOption effect of the graph is lost
Posted by GitBox <gi...@apache.org>.
zhangjian970604 commented on issue #16159:
URL: https://github.com/apache/echarts/issues/16159#issuecomment-984398152
- let dashOffsetNum = 0;
- option = {
- series: [
- {
- id: 'seres1',
- name: 'series1',
- type: 'graph',
- layout: 'force',
- draggable: true,
- roam: true,
- force: {
- repulsion: 20,
- gravity: 0.1,
- edgeLength: 15,
- },
- lineStyle: {
- type: 'dashed',
- opacity: 0.9,
- width: 2,
- curveness: 0.2,
- color: '#409EFF',
- dashOffset: dashOffsetNum,
- },
- data: [
- {
- id: 'data1',
- x: 0,
- y: 0,
- fixed: true,
- },
- {
- id: 'data2',
- x: -34.8,
- y: 20,
- fixed: true,
- },
- {
- id: 'data3',
- x: 34.8,
- y: 20,
- fixed: true,
- },
- {
- id: 'data4',
- x: 0,
- y: -32.9,
- fixed: true,
- },
- ],
- links: [
- {
- id: 'links1',
- source: 'data1',
- target: 'data2',
- },
- {
- id: 'links2',
- source: 'data1',
- target: 'data3',
- },
- {
- id: 'link3',
- source: 'data1',
- target: 'data4',
- },
- ],
- },
- ],
- };
- setInterval(function () {
- dashOffsetNum++;
- let dashOffsetOption = myChart.getOption();
- dashOffsetOption.series[0].lineStyle = {
- type: 'dashed',
- opacity: 0.9,
- width: 2,
- curveness: 0.2,
- color: '#409EFF',
- dashOffset: dashOffsetNum,
- };
- myChart.setOption(dashOffsetOption);
- }, 100);
-
- myChart.on('mouseup', function (params) {
- let coordinates = myChart.convertFromPixel({ seriesName: 'series1' }, [params.event.offsetX, params.event.offsetY]);
- let newOption = myChart.getOption();
- newOption.series[0].data = newOption.series[0].data.map((item) => {
- if (item.id === params.data.id) {
- item.x = coordinates[0];
- item.y = coordinates[1];
- item.fixed = true;
- }
- return item;
- });
- //echarts@5.2.0
- setTimeout(function () {
- myChart.setOption(
- { series: newOption.series },
- {
- notMerge: false,
- replaceMerge: 'series',
- }
- );
- }, 1000);
-
- //echarts@4.7.0
- // setTimeout(function() {
- // myChart.setOption(newOption.series, {
- // notMerge:false,
- // replaceMerge:'series'
- // });}, 1000);
- });
-
--
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: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org