echarts 字體自適應的方法(使用rem)

採用rem爲單位,根據屏幕的寬度調整html的font-size。

獲取屏幕寬度並計算比例:

function fontSize(res){
	let docEl = document.documentElement,
		clientWidth = window.innerWidth||document.documentElement.clientWidth||document.body.clientWidth;
	if (!clientWidth) return;
	let fontSize = 100 * (clientWidth / 1920);
	return res*fontSize;
}

在需要設置字體的地方可以這樣寫,
如在1920屏寬下字體設置爲12px,就可以傳入0.12給fontSize fontSize(0.12)

tooltip : {
	trigger: 'axis',
	textStyle:{
		fontSize: fontSize(0.12),
	}
},
發佈了99 篇原創文章 · 獲贊 91 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章