Javascript 在海图中一次拖动多个点
我试图使用draggable points插件一次修改样条曲线上的几个点。最后小提琴的理想功能是按住Ctrl键并单击/选择2+个点,然后能够同时拖动这些点,而不是一次拖动一个点 我目前的方法是使用dragDrop的groupBy功能。最初,我的点没有groupId。我正在使用点选择/取消选择事件将groupId设置为“编辑”。我可以在控制台中看到点数据正在通过选择/取消选择事件进行更新。dragDrop的groupBy属性是否仅对初始数据起作用Javascript 在海图中一次拖动多个点,javascript,highcharts,Javascript,Highcharts,我试图使用draggable points插件一次修改样条曲线上的几个点。最后小提琴的理想功能是按住Ctrl键并单击/选择2+个点,然后能够同时拖动这些点,而不是一次拖动一个点 我目前的方法是使用dragDrop的groupBy功能。最初,我的点没有groupId。我正在使用点选择/取消选择事件将groupId设置为“编辑”。我可以在控制台中看到点数据正在通过选择/取消选择事件进行更新。dragDrop的groupBy属性是否仅对初始数据起作用 series: [{ dragDrop:
series: [{
dragDrop:{
draggableY: true,
groupBy: 'groupId'
},
allowPointSelect: true,
point: {
events: {
select: function () {
this.groupId = 'edit';
},
unselect: function () {
this.groupId = undefined;
}
}
},
name: 'Tokyo',
marker: {
symbol: 'square'
},
data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, {
y: 26.5,
marker: {
symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)'
}
}, 23.3, 18.3, 13.9, 9.6]
}
根据显示当前方法的演示图表之一,将此小提琴拼凑在一起:
您需要通过
点更改groupId
属性。更新
:
series: [{
dragDrop: {
draggableY: true,
groupBy: 'groupId'
},
allowPointSelect: true,
point: {
events: {
select: function() {
this.update({
groupId: 'edit'
});
},
unselect: function() {
this.update({
groupId: null
});
}
}
},
...]
现场演示: API参考: