Echarts自定义工具栏toolbox

1.说明

toolbox:工具栏，提供操作图表的工具，可自定义

2.代码

//option
toolbox: {show: true,/*是否显示工具栏组件*/itemSize :30,/*工具栏 icon 的大小*/feature: {/*自定义事件,注意:自定义事件必须以my开头*/myTool2: {show: true,title: '单机台设备状态查询',/*鼠标停留时的提示文字*/icon: 'image://../0IMG/tool.png',/*显示图标,必须以image://为开头显示后面是图表的路径*//*点击时触发的事件*/onclick: function (){alert("点击了自定义事件");}}}
},

3.官方的一些自带配置

除了自定义,官方还配置了一些自带的工具,方便使用

//option
toolbox: {show: true,feature: {dataZoom: {yAxisIndex: 'none'},/*数据区域缩放。目前只支持直角坐标系的缩放*/dataView: { readOnly: false },/*数据视图工具，可以展现当前图表所用的数据，编辑后可以动态更新*/magicType: { type: ['line', 'bar'] },/*动态类型切换,比如把数据转换为条形图或柱形图*/restore: {},/*配置项还原*/saveAsImage: {}/*保存为图片*/}}

Echarts自定义工具栏toolbox相关推荐

echarts使用总结（使用echarts画工字型标记线；无数据时设置纵坐标刻度0-1；tooltip数据展示；工具栏 toolBox 图标配置）
1. 使用echarts画标记线(工字型) 1.1 实现效果 1.2 使用属性详细参数可查看echarts官网,markline属性 https://echarts.apache.org/zh/op ...
ECharts自定义toolbox中增加自定义按钮
今天想能不能在ECharts中的ToolBox增加自己的按钮,然后读了一下ToolBox代码,自己试了试,验证是可以的. 1.效果图图片中红色框起来的按钮 2.代码 selfButtons:{//自 ...
java中点击按钮出现echarts图表_echarts 显示下载按钮，echarts 自定义按钮，echarts 添加按钮...
echarts 显示下载按钮,echarts 自定义按钮,echarts 添加按钮 >>>>>>>>>>>>>>&g ...
Echarts数据可视化toolbox工具框，开发全解+完美注释
全栈工程师开发手册 (作者:栾鹏) Echarts数据可视化开发代码注释全解 Echarts数据可视化开发参数配置全解 6大公共组件详解(点击进入): title详解. tooltip详解.toolb ...
用Echarts自定义多系列左右双坐标对比的图表，适合展示TGI对比等场景
用Echarts自定义多系列左右双坐标对比的图表,适合展示TGI对比等场景. renderItem = function (params, api) {console.log('----------- ...
html中legend样式,echarts自定义图例legend文字和样式
话不多说,先上效果图. 要完成这个图并不难,主要是下面那个图例比较难,需要定制. 让我们从官方文档找找思路,官方文档关于legend.formatter是这样的:链接在这难点在于: 1.这里的图例文 ...
ie8浏览器自定义工具栏设置教程
ie8浏览器自定义工具栏设置教程 ie8浏览器自定义工具栏怎么设置?在使用IE8的网友知道,在安装IE8之后会发现IE8的工具栏中的按钮非常少,明显的不便于我们平时的上网操作.所以我们有必要根据自己的 ...
Echarts自定义折线图例,增加选中功能
用Echarts图表开发,原本的Echarts图例不一定能满足我们的视觉要求. 下面是Echarts 折线图自定义图例,图例checked选中,相应的折线线条会随之checked,其余未选中的图例对应 ...
java menu单击事件_TinyMCE自定义工具栏menuItem单击触发所有父项的单击事件
我正在为我的tinyMCE添加一个自定义工具栏按钮 tinyMCE.init({ mode: "specific_textareas", editor_selector: &quo ...

Echarts自定义工具栏toolbox

1.说明

2.代码

3.官方的一些自带配置

Echarts自定义工具栏toolbox相关推荐

最新文章

热门文章