关于前端:highchart的draggablepointsjs依赖实现图表的动态拖拽操作

32次阅读

共计 478 个字符，预计需要花费 2 分钟才能阅读完成。

实现一个曲线图，可能通过鼠标去拖拽点，来进行批改图表

实现

例子基于 vue 来实现，如果是 jq 的依照官网的例子即可，配置列表链接.，例子

// 引入依赖
import Highcharts from 'highcharts/highcharts.js';
import draggable from 'highcharts/modules/draggable-points.js'
// 注册拖拽事件
draggable(Highcharts);

// 要害配置
plotOptions: {
 dragDrop: {
    draggableY: true, // 启用 y 轴拖拽
     dragPrecisionY: 0.1 // 拖拽步长
 },
 point: {
     events: {
         // 拖拽过程事件
         drag: function(event) {// console.log('拖动', event)
         },
         // 拖拽完结事件
         drop: function(evt) {}}
 }