echarts 图表设置默认选中
一、数据图形
import * as echarts from 'echarts'
const myChart = echarts.init(document.querySelector('pie'))
设置高亮
myChart.dispatchAction({
type: "highlight",
//seriesIndex:number | array系列 index,可以是一个数组指定多个系列
seriesIndex: 0,
//dataIndex:number 数据的 index
dataIndex: 1
})
取消高亮
一般适用于设置默认高亮之后,点击图表之后,取消高亮
myChart.dispatchAction({
type: "downplay",
//seriesIndex:number | array 系列 index,可以是一个数组指定多个系列
seriesIndex: 0,
//dataIndex:number 数据的 index
dataIndex: 1
})
二、图例
默认选中图例
myChart.dispatchAction({
type: 'legendSelect',
// 图例名称
name: string
})
取消选中图例
myChart.dispatchAction({
type: 'legendUnSelect',
// 图例名称
name: 'string'
})
切换图例选中状态
myChart.dispatchAction({
type: 'legendToggleSelect',
// 图例名称
name: string
})
控制图例的滚动
myChart.dispatchAction({
type: 'legendScroll',
scrollDataIndex: number,
legendId: string
})
三、提示框 tip
显示提示框
myChart.dispatchAction({
type: "showTip",
seriesIndex: 0,
dataIndex: 1
})
说明
对echarts图表的数据进行更新
let option = myChart.getOption()
// 这里可以直接设置option里的各项配置
...
myChart.setOption(option)
上面是直接更新图表,如果需要让图表进行重绘,则需要
myChart.clear()
myChart.setOption(option)
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析