echarts echarts实例的属性和方法

1.获取容器相关
echartsInstance.getWidth()
echartsInstance.getHeight()
echartsInstance.getDom()
获取ECharts实例容器的dom节点
2.获取当前配置
echartsInstance.getOption()
3.图表自适应改变
echartsInstance. resize({
配置项都是可传
width: number|string,
height: number|string,
silent: boolean,
animation: {
duration: number
easing: string
}
})
4.数值节点和像素的转换
转换坐标系上的点到像素坐标值,及可将该坐标系的某个数值的点转换成像素,使得该坐标系外的其他图形也能通过像素来进行精确定位到坐标系的图形的某个图案上
像素值:以echarts实例的dom节点的左上角为坐标[0, 0]点。
let pxArr=echartsInstance.convertToPixel({
seriesIndex?: number,
seriesId?: string,
seriesName?: string,
geoIndex?: number,
geoId?: string,
geoName?: string,
xAxisIndex?: number,
xAxisId?: string,
xAxisName?: string,
yAxisIndex?: number,
yAxisId?: string,
yAxisName?: string,
gridIndex?: number,
gridId?: string,
gridName?: string
},要转换的值)
chart.convertToPixel('geo', [128.3324, 89.5344]);
等同于{geoIndex: 0}
chart.convertToPixel({geoIndex: 1}, [128.3324, 89.5344]);
chart.convertToPixel({geoId: 'bb'}, [128.3324, 89.5344]);
chart.convertToPixel({xAxisIndex: 2, yAxisId: 'y1'}, [300, 900]);	使用第三个xAxis和id为'y1'的yAxis形成的cartesian进行转换
chart.convertToPixel({gridId: 'g1'}, [300, 900]);
使用id为'g1'的grid的第一个cartesian进行转换
chart.convertToPixel({xAxisId: 'x0'}, 3000);
id为'x0'的xAxis的刻度3000位置所对应的横向像素位置
chart.convertToPixel({seriesIndex: 0}, [2000, 3500]);
如把关系图(graph)的点转换成像素坐标的方式
chart.convertToPixel({seriesId: 'k2'}, [100, 500]);
5.像素和数值节点的转换
echartsInstance.convertFromPixel(option,value);	配置参数等和convertToPixel相同
6.判断像素点是否在某个系列上
echartsInstance.containPixel(option,value);
7.导出方法
(1)导出为base64格式
echartsInstance.getDataURL({
type?: string,
导出的格式,可选png、jpeg
pixelRatio?: number,
导出的图片分辨率比例,默认为 1。
backgroundColor?: string,	导出的图片背景色,默认使用option里的backgroundColor
excludeComponents?: ['']	忽略组件的列表,例如要忽略toolbox就是['toolbox']
})
echartsInstance. getConnectedDataURL(option)	导出联动图表,配置和getDataURL相同
8.在大数据量(百万以上)的渲染场景,分片加载数据和增量渲染。
不支持dataset同时使用appendData,只支持系列使用自己的series.data时使用appendData。
目前支持的图有scatter、lines、scatterGL、linesGL、polygons3D
echartsInstance. appendData({
seriesIndex: string,	要增加数据的系列序号
data
增加的数据
})

最后

以上就是高大大象为你收集整理的echarts echarts实例的属性和方法的全部内容，希望文章能够帮你解决echarts echarts实例的属性和方法所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。