解决echarts中tooltip的换行问题

ops/2024/9/20 7:10:21/ 标签: echarts, 前端, javascript, css3

今天收到产品提来的bug,说我的echarts的tooltip在手机端文字太多的话会因为太长而被遮住,类似于这样

于是便想着修改配置,发现不行,无论是修改textStyle还是extraCssText,都无法达到换行的效果,只好在formatter中加个div写css,还是不行,似乎被什么东西影响了。打开控制面板想看看到底怎么回事,才发现在它最外面的div中设置了一个white-space:nowrap;把这个点掉就正常了

但是应该怎么点呢?毕竟它也没有id也没有class,于是便想着找个父级选择器来写它的样式,因为我在formatter中自定义了一个class="tag-view",但发现css好像没有父级选择器这个东西,于是便迂回,用了一个

div:has(.tag-view) {white-space: normal !important;
}

完美解决了我的问题


http://www.ppmy.cn/ops/93730.html

相关文章

【RISC-V设计-09】- RISC-V处理器设计K0A之CIC

【RISC-V设计-09】- RISC-V处理器设计K0A之CIC 文章目录 【RISC-V设计-09】- RISC-V处理器设计K0A之CIC1.简介2.顶层设计3.端口说明4.代码设计5.仲裁代码6.总结 1.简介 核内中断控制器(Core Interrupt Controller,简称CIC)是管理和仲裁中断的…

flink web监控

作者:南墨 监控指标 进入Flink的原生页面,需要从yarn的原生页面的后台链接进入,如下图: 这里必须要用supergroup组的用户或者flink提交任务的用户(如果该用户是机机用户不能登录)才能够看到任务。 系统监…

(javaweb)分层解耦

目录 一.三层架构 二.分层解耦 三.IOC&DI入门 四.IOC详解 五. DI详解 一.三层架构 复用性差,难以维护和管理 前端发起请求,先会到达controller,再调用service进行逻辑处理,逻辑处理的前提是先拿到数据,到dao…

基于SpringBoot的体育馆管理系统的设计与实现

TOC springboot162基于SpringBoot的体育馆管理系统的设计与实现 绪论** 1.1 研究背景 当前社会各行业领域竞争压力非常大,随着当前时代的信息化,科学化发展,让社会各行业领域都争相使用新的信息技术,对行业内的各种相关数据进…

PyTorch 基础学习(6)- 函数API

系列文章: PyTorch 基础学习(1) - 快速入门 PyTorch 基础学习(2)- 张量 Tensors PyTorch 基础学习(3) - 张量的数学操作 PyTorch 基础学习(4)- 张量的类型 PyTorch 基础学…

KillWxapkg-自动化反编译微信小程序工具(附安装包)

KillWxapkg是一款纯Golang实现,一个用于自动化反编译微信小程序、小程序安全评估工具工具,小程序安全利器, 可以自动解密,解包,可还原工程目录,支持Hook,小程序修改,支持微信开发者工…

k8s 单机 部署

k8s 单机 部署 香港服务器 centos7.6 2核4G 30M 搞个k8s单机部署搞了好几天 就是一直出错 遇到了好多次镜像的错误 真的是日了🐕了索性 搞个香港服务器,不折腾镜像源了Deploy Kubernetes On-Premises Using CentOS 7 — Part 1 https://medium.com/sar…

【单片机】51单片机入门教程(二):定时器的模式详解与中断应用实例

文章目录 51单片机定时器教程:模式详解与中断应用实例1. 介绍2. 51单片机定时器/计数器概述3. 定时器控制寄存器与中断入口4. 模式0:13位定时器/计数器5. 模式1:16位定时器/计数器6. 模式2:8位自动重装载定时器/计数器7. 模式3:分割两个独立的8位定时器/计数器8. 总结51单…

基于SpringBoot的企业资产管理系统

TOC springboot117基于SpringBoot的企业资产管理系统 系统概述 1.1 研究背景 智慧养老是面向居家老人、社区及养老机构的传感网系统与信息平台,并在此基础上提供实时、快捷、高效、低成本的,物联化、互联化、智能化的养老服务。 随着科技进步&#…

【qt】QMainWindow下实现一个记事本

之前我们学过QWidget,QMainWindow会在ui界面多一个菜单 先实现ui界面 1.添加文本编辑,实现可以写多行 2.将文本编辑放大,拖动即可 3.编辑菜单栏 4.然后我们要实现对应子列表的功能,但是在这里不能转到槽,所以我们…

关于自己部署AI大模型踩的坑(一)——硬件篇

最近一直在研究如何打算属于我自己的J.A.R.V.I.S.(钢铁侠中的机器人管家)。 上一篇写了我最近在部署自己的大模型,使用llama3.1, 和通义千问2。虽然最终结果也是成功了,过程却十分地坎坷。 所以这一篇文章一是总结其中…

uniapp版本更新除了plus.runtime.getProperty的解决办法

以下是展示图 带尺寸的图片: 首先把以下代码放到想要更新弹出的页面 //template部分<uni-popup ref"popup" background-color"#fff"><versionUp handleCloseVersion"closeVersion"></versionUp></uni-popup>//script…

Mysql——对数据基本操作(增删查改)——操纵语言(DML)

之前的创建数据库和创建表&#xff0c;类型、约束都是用的DDL【data definition language】 数据定义语言&#xff0c;用来维护存储数据的结构 代表指令: create, drop, alter 那么现在我们来学习数据操纵语言 DML【data manipulation language】 数据操纵语言&#xff0c;用来…

使用Selenium爬取网络页面

在现代网络数据分析和自动化测试中&#xff0c;Selenium 是一个强大而流行的工具。它不仅可以帮助开发者自动化浏览器操作&#xff0c;还能用于爬取网络页面。本文将介绍如何使用 Selenium 爬取网络页面&#xff0c;包括基本设置、常用操作及一些实用的技巧。 一、什么是 Selen…

腾讯cdg提前批一面0726

介绍项目 黑马商城 为什么使用rabbitmq 用于异步更新订单 扣减余额后异步更新订单失败怎么办 分布式事务回滚 什么是接口幂等性&#xff0c;怎么实现 接口幂等性是指同一个接口在短时间点击多次都之后返回只执行一次的结果。 Token机制&#xff1a; 生成Token&#xff1a;在客户…

点赞功能开发

文章目录 1.点赞收藏功能设计1.示意图2.描述1.使用redis记录的数据2.数据库的设计3.功能设计1.新增点赞2.取消点赞3.查询当前题目被点赞的数量4.查询当前题目被当前用户是否点过赞5.我的点赞 2.代码生成器的使用1.找到代码生成器在磁盘的位置&#xff0c;直接复制到项目下2.导入…

微信小程序中实现自动滚动

使用scroll-view组件的scroll-into-view属性&#xff1a; <scroll-view class"container" scroll-y"{{true}}" scroll-into-view"recordBottomScroll"><view class"text_style" style"color: #252526;">{{te…

16 交换机命令行配置

交换机命令行配置 一、交换机命令行基本配置 &#xff08;一&#xff09;配置主机名 Switch>enable Switch#configure terminal Switch(config)#hostname S1&#xff08;二&#xff09;查看配置信息 Switch#show running-config Building configuration...Current confi…

SpringBoot配置

目录 yaml基本含义 yaml基本语法 yaml数据格式 实操 yaml:参数引用 小结 yaml基本含义 通过对比不同配置文件写法&#xff0c;就可以发现yaml配置文件&#xff0c;更加注重数据本身 原因 1 比properties配置文件&#xff0c;更加注重层级关系 2 和xml文件比起来&#xff…

【Unity-UGUI】UI重建

UGUI UI重建二三事(一) UGUI UI重建二三事(二) [UGUI源码二]Unity UI重建(Rebuild)源码分析 这一部分主要是通过以上几篇文章学习的&#xff0c;总结一下&#xff1a; UI重建主要分类两类&#xff0c;一类是布局重建(Layout Rebuild)&#xff0c;另一类是图形重建(Graphic Reb…