echarts 折线图 点上显示数据
时间: 2023-09-25 12:12:27 浏览: 291
你可以使用 ECharts 中的标记点来显示折线图上的数据。具体步骤如下:
1. 首先,确保你已经引入了 ECharts 库,并创建了一个图表实例,例如:
```javascript
var myChart = echarts.init(document.getElementById('chart'));
```
2. 然后,定义你的折线图的数据和配置项,例如:
```javascript
var option = {
xAxis: {
type: 'category',
data: ['一月', '二月', '三月', '四月', '五月', '六月']
},
yAxis: {
type: 'value'
},
series: [{
type: 'line',
data: [120, 200, 150, 80, 70, 110],
// 在折线上显示数据
label: {
show: true,
position: 'top' // 可以根据需要设置标签的位置
},
// 在折线上显示标记点
markPoint: {
data: [
{type: 'max', name: '最大值'},
{type: 'min', name: '最小值'}
]
}
}]
};
```
3. 最后,将配置项应用到图表实例上并渲染出来,例如:
```javascript
myChart.setOption(option);
```
这样,你的折线图上的每个数据点都会显示出来,并且还会在图表上标出最大值和最小值。你可以根据需要调整标签和标记点的样式和位置。
阅读全文