当前位置: 首页 > news >正文

echarts 图表文字大小自适应 字体大小自适应

将文字大小自适应方法挂载到全局

//main.js
Vue.prototype.fontSize = function(res) {// 获取视口宽度const clientWidth =window.innerWidth ||document.documentElement.clientWidth ||document.body.clientWidth;if (!clientWidth) return; // 如果获取不到视口宽度,则退出函数// 计算基准字体大小let fontSize = clientWidth / 1920;// 返回根据视口宽度计算出的相对字体大小return res * fontSize;
};

页面中使用

//在需要自适应的地方使用  this.fontSize(16) 
xAxis: {type: "category",data: data,axisLine: {lineStyle: {color: "#d4d9e2"}},axisLabel: {color: "#333",interval: 0, //横轴信息全部显示rotate: 60, //倾斜显示textStyle: {fontSize: this.fontSize(16)},}
},
http://www.lryc.cn/news/232528.html

相关文章:

  • 【项目】云备份系统基础功能实现
  • 【Shell脚本13】Shell 文件包含
  • 2023.11.15 关于 Spring Boot 配置文件
  • 2023年第九届数维杯国际大学生数学建模挑战赛A题
  • IDEA写mybatis程序,java.io.IOException:Could not find resource mybatis-config.xml
  • 1软件管理
  • flutter 绘制右上角圆角三角形标签
  • C/C++输出整数部分 2021年12月电子学会青少年软件编程(C/C++)等级考试一级真题答案解析
  • 通过20天预测7天
  • 【python】均值、中值和高斯滤波详解和示例
  • 基于STM32的循迹小车项目实战
  • Element UI 偶发性图标乱码问题
  • UniApp中的数据存储与获取指南
  • VUE基础的一些实战总结
  • 【算法】算法题-20231117
  • 轮播图(多个一起轮播)
  • OpenCV中的像素重映射原理及实战分析
  • 如何快速搭建Spring Boot接口调试环境并实现公网访问
  • 简单的用Python实现一下,采集某牙视频,多个视频翻页下载
  • 【手撕数据结构】二分查找(好多细节)
  • Python+Selenium WebUI自动化框架 -- 基础操作封装
  • PyCharm 【unsupported Python 3.1】
  • flutter TabBar指示器
  • PDF/X、PDF/A、PDF/E:有什么区别,为什么有这么多格式?
  • Microsoft发布了一份关于其产品安全修复的 11 月报告。
  • 12v24v60v高校同步降压转换芯片推荐
  • pip 问题
  • 云计算(一):弹性计算概述
  • Qt/C++ 获取QProcess启动的第三方软件的窗体标题
  • Borland编辑器DOS系统快捷键应用