因我们在移动端中大多数是使用rem、 vw、vh，而 echarts 里面的尺寸只能写 16或16%，有的如：fontSize 之类的只有16 。导致写的时候按分辨率750×1334px ，在分辨率480×800px的机型上就差异跟大，字体大小、宽高、left、top、right、bottom等在设置的值是16或16%时，会有很大偏差，这就需要我们自己去计算处理了。

• 解决思路：将实际窗口的大小与设计图窗口大小做比得到要给相对的比率，每个单位数值和这个比率相乘即可。即：按比例缩放字体。比如设计图是750x1334的，某个数值是fontSize:12，当前显示器是480的大屏，那么你现在的字体大小应该是：12*(480/750)=7.68。

1. 方案一：

	//方案一还不完善，还没仔细去验证methods: {//initWidth 设计稿尺寸calculateSize (val,initWidth=1920) {//当前视口宽度let nowClientWidth = document.documentElement.clientWidth;//换算方法return val * (nowClientWidth/initWidth);}initChart () {let option = {legend: { left: this.calculateSize(30) textStyle: {fontSize: this.calculateSize(16)}}}}}

2. 方案二：

• 如果项目中有引入flexible.js，推荐使用以下方案

  flexible中，1rem是相对于750px的设计稿,1rem = 100px，现在使用到的16px要转换为rem，就是设计稿中的(16 / 100)rem，然后echarts是只支持px的所以结果就是(16 / 100) * window.rem，所以我们可在data中先用 window?.rem / 100

	export default {data () {return {conversionSize: window?.rem / 100 || 1, // window.rem来自与flexible.js}},  methods: {initChart () {let option = {legend: { left: this.conversionSize * 30textStyle: {fontSize: this.conversionSize * 16}}}}}