如何详细获取ECharts曲线图上任意点的JavaScript值？

本文共计1532个文字，预计阅读时间需要7分钟。

目录需求背景需求调研实现步骤需求背景在智慧农业领域，控制温室生长环境是一个非常重要的功能，它能够使农作物生长得更好。实现步骤我们需要根据不同农作物设置不同的环境数据。

目录

• 需求背景
• 需求调研
• 实现步骤

需求背景

智慧农业里有一个很重要的功能是控制温室生长环境，让农作物生长的更好。于是，我们需要在曲线上根据不同农作物设置不同的环境数据。为了方便用户修改这些数据，我们需要支持用户在曲线上进行拖拽，并且拖拽后还需要把拖拽后的关键点位返回给后端。后面温度传感器收到温度数据后，会发给后端和前端。两端都需要判断传过来的温度是否在曲线之间。如果超出或者下沉需要触发相应的事件。

需求调研

本来以为这个需求很简单，导入echarts，设置两条曲线，并支持拖动。拖动。这些都属于echarts开放的功能，但等到要查询某个时间点曲线上的值时，才发现echarts根本就没开放这个功能，查看源码发现他是用贝塞尔算法生成的曲线，好吧，既然你不支持，那就只能自己实现了。

后面找了下资料，发现一个贝塞尔的js开源库，看了下它的说明，发现有get(t)方法获取到曲线上Y轴的值。参数t表示两个关键点之间x轴值。由于我们传入的x轴是时间，所以这个t就是x轴的时间。