Skip to content

仪表盘

常规使用

使用默认配置

</>

使用自定义配置

</>

参数

参数名介绍类型
id图表IDString
height图表高度String
width图表宽度String
dataFormat转换数据格式用于series 中的 dataFunction
className图表样式名String
optionsecharts 配置选项Object
dataecharts 绑定数据Array
paramsecharts 配置参数Object
loading加载图表时是否显示loadingBoolean

事件

事件名介绍参数
chart-click点击图表(非图例、提示框等辅助元素)时触发params
chart-dblclick双击图表时触发params
chart-mousedown鼠标按钮在图表上被按下时触发params
chart-mousemove鼠标在图表区域内移动时触发params
chart-mouseup鼠标按钮在图表上释放时触发params
chart-mouseover鼠标移动到图表上某个元素上时触发params
chart-mouseout鼠标离开图表上某个元素时触发params
chart-globalout鼠标完全离开图表区域时触发params
chart-contextmenu在图表上触发右键点击时(通常用于打开上下文菜单)触发params
chart-legendselectchanged图例中的某个系列(series)的选中状态发生变化时触发params

数据结构

占比基础仪表盘

json
[20, 100]

带标签数字动画的基础仪表盘

json
[
    { name: '项目类', value: 20 },
    { name: '平台类', value: 80 },
]

v-echarts-ui design by Vivien