//echartPxToRem.tsexport function fontSize(res: number) {const clientWidth =window.innerWidth ||document.documentElement.clientWidth ||document.body.clientWidth;if (!clientWidth) return;const designWidth = 1920; // 设计稿宽度const minWidth = 1024; // 最小适配的屏幕宽度const screenWidth = Math.max(clientWidth, minWidth); // 当前屏幕宽度与最小适配宽度比较const fontSize = screenWidth / designWidth;return res * fontSize;
}

fontSize方法为导出的，它可以根据不同的屏幕宽度（响应式设计）调整字体大小。这个函数在设计稿宽度为 1920px 时，将根据当前屏幕宽度与最小适配宽度（1024px）之间的最大值来计算一个相对于设计稿宽度的缩放比例，然后将输入的字号（res）乘以这个比例以获得最终的字体大小。

这个函数可以在 Vue.js 或其他 JavaScript/TypeScript 项目中使用，以实现响应式字体大小的设置。您可以在需要的地方导入并调用 fontSize 函数，以根据屏幕宽度动态调整字体大小，从而使您的网页内容更适应不同的设备和屏幕尺寸。

使用：

import { fontSize } from "@/utils/echartPxToRem";

xAxis: [{show: true,type: "category",data: timeArray().reverse(),axisLine: {lineStyle: {width: fontSize(1), //使用dashOffset: 10, // 控制虚线的偏移量color: "rgba(84, 163, 226, 1)",},},axisLabel: {fontSize: fontSize(10), //使用color: "rgba(84, 122, 190, 1)",textStyle: {color: function (value, index) {return index == 0? "rgba(0, 238, 255, 1)": "rgba(84, 122, 190, 1)";},},},axisTick: {interval: 0,inside: true,alignWithLabel: true,},inverse: true, //反转坐标轴},],