echarts折线图显示值
时间: 2025-01-31 09:40:58 浏览: 74
### 如何在 ECharts 折线图中显示数值
要在 ECharts 的折线图中显示具体的数值,可以通过配置 `series` 中的 `label` 属性来实现。具体来说,在初始化图表实例时设置该属性可以控制标签的行为。
对于希望展示的数据值而言,下面是一个完整的 JavaScript 实现案例:
```javascript
var myChart = echarts.init(document.getElementById('main'));
option = {
xAxis: {
type: 'category',
data: ['2020年', '2021年', '2022年', '2023年', '2024年']
},
yAxis: {
type: 'value'
},
series: [{
data: [
{ name: '2020年', value: 150 },
{ name: '2021年', value: 168 },
{ name: '2022年', value: 159 },
{ name: '2023年', value: 127 },
{ name: '2024年', value: 99 }
],
type: 'line',
label: {
show: true,
position: 'top' // 设置位置为顶部
}
}]
};
myChart.setOption(option);
```
上述代码片段设置了 `label.show=true` 来开启数据项上的文字标记,并通过调整 `position='top'` 参数指定这些标签相对于点的位置[^1]。
阅读全文
相关推荐


















