项目场景:
客户提的需求是,echarts有多个Y轴,且Y轴不能重合,且间距要根据数据的大小自适应。
问题描述
原因分析:
正常情况下我们可以通过offset去设置多个Y轴之间的间距,但是echarts并不能自适应,在数据量太大时,数据依然还是会有重合的可能
解决方案:
所以我们就需要动态的计算Y轴最大的一个数据显示所需要的一个宽度,通过这个宽度来设置offest,话不多说上代码。
1、首先我们创建一个计算宽度的函数
function getActualWidthOfChars(text, options = {}) {
const { size = 14, family = 'Honeywell Sans Web, Verdana, sans-serif' } = options;
let canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
ctx.font = `${size}px ${family}`;