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	 				增加的数据
	})
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值