用echarts做大屏可視化的時(shí)候會(huì)遇到不是用電腦投屏而是直接在大屏打開(kāi)的情況,這時(shí)候大屏幕下固定的px為單位的字體就會(huì)顯得很小。有一種解決方法就是采用rem為單位,根據(jù)屏幕的寬度調(diào)整html的font-size.
獲取屏幕寬度并計(jì)算比例
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;}在需要設(shè)置字體的地方可以這樣寫(xiě),
如在1920屏寬下字體設(shè)置為12px,就可以傳入0.12給fontSize fontSize(0.12)
tooltip : { trigger: 'axis', axisPointer : { // 坐標(biāo)軸指示器,坐標(biāo)軸觸發(fā)有效 type : 'shadow' // 默認(rèn)為直線,可選為:'line' | 'shadow' }, textStyle:{ fontSize: fontSize(0.12), } },以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持VeVb武林網(wǎng)。
新聞熱點(diǎn)
疑難解答