有一组 echarts ( v-for )遍历出来,一整个有一个竖线,竖线可以左右,但是不能上下移动,鼠标按下移动会跟随鼠标,鼠标松开会自动吸附最近的数据点,得到 x,y 两个折线的数据
https://tutu.to/image/image.aOySP
ondrag: function (event) {
// 限制只允许左右拖动
var newX = event.x;
var line = event.target;
line.attr('shape', {
x1: newX,
y1: 0,
x2: newX,
y2: 400
});
},
graphic: [
{
type: "line",
id: "drag-line",
shape: {
x1: 100, // 起始位置
y1: 0,
x2: 100, // 结束位置
y2: 400,
},
style: {
stroke: "#ff0000",
lineWidth: 2,
},
draggable: true, // 开启拖拽
用这个拖拽的时候可以限制上下,但是不知道为什么左右移动的时候线会消失,停止移动过一会才会显示
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.