lucas.Yan 发表于 2024-7-30 17:51:46

使用ECharts绘制预测数据

本帖最后由 lucas.Yan 于 2024-7-30 18:06 编辑

背景:
在数据分析和报告中,折线图是一种非常常见的图表类型,用于展示数据随时间的变化趋势。当涉及到对未来数据的预测时,这种图表就变得更加有用。我们在方方面面都会用到这些信息。
趋势分析:折线图能够清晰地显示出数据随时间的变化趋势,而预测曲线则可以帮助我们了解这种趋势在未来可能的发展方向。
决策支持:在商业、金融、科学等领域,准确的预测对于制定策略至关重要。例如,在销售预测中,公司可以根据未来的销售趋势来调整库存水平或营销策略。
风险管理:对于风险评估和管理来说,预测未来可能发生的情况有助于提前采取措施减少潜在损失。比如,通过天气预报数据预测自然灾害的可能性。
资源配置:在资源有限的情况下,准确的预测可以帮助更好地分配资源。例如,在医疗领域,通过预测疾病传播趋势可以更有效地调配医疗资源。
同时在论坛中客户也提出了类似需求:https://gcdn.grapecity.com.cn/showtopic-223714-1-1.html

示例:


思路:
将绑定的数据预测线部分series的lineStyle修改为虚线即可实现上面的效果。

步骤:
1. 首先在option中根据对应series的name去匹配forecastItem对象。
2. 设置forecastItem的lineStyle.type="dashed"
3. 在series数组中新增一个对象用来绘制竖直的红色趋势线。
//console.log(option);
const forecastItem = option.series.find(o=>o.name==="forecast");
//console.log(forecastItem);
forecastItem.lineStyle.type="dashed";
option.series.push(
   {
      name: '平行于y轴的趋势线',
      type: 'line',
      markLine: {
         lineStyle: {
          opacity: 1,
          type: 'solid',
          width: 1.5,
          color:'red',
      },
      symbol: 'none', //去掉箭头
      data: [[{ coord: ['2024-08-26T00:00:00', 0] }, { coord: ['2024-08-26T00:00:00', 1] }]]
      }
    }
)
//console.log(option);
return option;

资源:

文档参考:
https://echarts.apache.org/zh/api.html#action.downplay

页: [1]
查看完整版本: 使用ECharts绘制预测数据