echarts 柱状图数据过多时自动滚动

        当我们柱状图中X轴数据太多的时候,会自动把柱形的宽度挤的很细,带来的交互非常不好,我们可以用dataZoom属性来解决
简易的版本,横向滚动。

option.dataZoom = [{type: "slider",show: true,startValue: 0, //数据窗口范围的起始百分比endValue: 8,},
];

效果如下:

如果需要自动滚动,需要再加个定时器,

还可以在标签上设置鼠标放上去停止滚动

@mouseover="hovers = true" @mouseleave="hovers = false"

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/658491.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【刷题】牛客网 NC132 环形链表的约瑟夫问题

NC132 环形链表的约瑟夫问题 题目描述思路一(链表直通版)思路二(数组巧解版)思路三(变态秒杀版)Thanks♪(・ω・)ノ谢谢阅读下一篇文章见!!&#xff…

Oracle 的闪回技术是什么

什么是闪回 Oracle 数据库闪回技术是一组独特而丰富的数据恢复解决方案,能够有选择性地高效撤销一个错误的影响,从人为错误中恢复。闪回是一种数据恢复技术,它使得数据库可以回到过去的某个状态,可以满足用户的逻辑错误的快速恢复…

SpringCloudAlibaba组件总结笔记(如Nacos、SpringCloudGateway、OpenFeign,Ribbon,RabbitMQ)

这目录 1.Ribbon负载均衡1负载均衡原理2.负载均衡策略1.负载均衡策略2.自定义负载均衡策略 3.饥饿加载 2.Nacos注册中心与Eureka的区别3.Nacos配置中心1.从微服务拉取配置2.配置热更新1.2.1.方式一1.2.2.方式二 3.配置共享1.配置共享的优先级 4.Feign1.Feign使用优化2.配置连接…

使用Promethues+Grafana监控Elasticsearch

PromethuesGrafana监控Elasticsearch 监控选用说明指标上报流程说明实现监控的步骤搭建elasticsearch-exporter服务搭建promethues和grafana服务 监控选用说明 虽然用Kibana来监控ES,能展示一些关键指标,但ES本身收集的指标并不全面,还需要在…

torchvision.models._utils.IntermediateLayerGetter()使用

torchvision.models._utils.IntermediateLayerGetter()使用 源码如下: from collections import OrderedDictimport torch from torch import nnclass IntermediateLayerGetter(nn.ModuleDict):"""Module wrapper that ret…

Python采集学习笔记-读取excel数据

表格格式 方法一:使用xlrd import xlrd 1.读取Excel文件 workbook xlrd.open_workbook(plc.xlsx) 2.读取第一个表 sheet workbook.sheet_by_index(0) 3.获取表格总行数 total_rows sheet.nrows 4.创建列表,存储表格一行中每一列信息 plc_info [] for row in range(1…

C语言常见面试题:什么是队列,队列的作用是什么?

队列是一种特殊的线性表,它只允许在表的前端(front)进行删除操作,而在表的后端(rear)进行插入操作。这种操作受限制的线性表具有先进先出(FIFO—first in first out)的特性。进行插入…

【JAVA】Long类型返回到前端,精度丢失

一. 问题阐述 20位long类型的数字,从后端接口返回到前端后【四舍五入】 MYSQL端 (1)bigint (20) (2)具体某一条数据 JAVA端 (1)实体类 (2)服务类 (3&…

docker可视化操作

docker可视化操作,ui界面操作 1.检查docker服务状态 docker status2.安装服务 部署 Portainer 1.从镜像仓库中拉取 Portainer:docker pull portainer/portainer2.创建数据卷: docker volume create portainer_db 3.启动 Portainer命令&…

Unity数据解析(Json、XML、CSV、二进制)

注释 常见的数据解析(Json、XML、CSV、二进制) using System; using System.IO; using System.Xml.Serialization; using Newtonsoft.Json; using System.Runtime.InteropServices; using System.Text; using System.Reflection; using System.Collect…

猜数字游戏(扩展)

游戏要求: 1. 电脑⾃动⽣成1~100的随机数 2. 玩家猜数字,猜数字的过程中,根据猜测数据的⼤⼩给出⼤了或⼩了的反馈,直到猜对,游戏结束 1. 随机数⽣成 1.1 rand C语⾔提供了⼀个函数叫 rand,这函数是可…

86.网游逆向分析与插件开发-物品使用-物品丢弃的逆向分析与C++代码的封装

内容参考于:易道云信息技术研究院VIP课 上一个内容:物品使用的逆向分析与C代码的封装-CSDN博客 码云地址(ui显示角色数据 分支):https://gitee.com/dye_your_fingers/sro_-ex.git 码云版本号:7563f86877c…

NFTScan 与 Merlin Protocol 共同推出 BRC20 Indexer Oracle,于今日正式上线!

近日,NFT 数据基础设施 NFTScan 与 Merlin Protocol 进行战略合作,联合推出了比特币网络原生资产 Indexer Oracle 服务,现在该服务已在 NFTScan 开发者平台上线,任何开发者都可以注册使用! Merlin Protocol 是一个专用…

linux 磁盘标签类型MBR转换为GPT

[rootlocalhost /]# fdisk -l 磁盘 /dev/sda:299.4 GB, 299439751168 字节,584843264 个扇区 Units 扇区 of 1 * 512 512 bytes 扇区大小(逻辑/物理):512 字节 / 512 字节 I/O 大小(最小/最佳):512 字节 / 512 字节 磁盘标签类…

解读 HTTP 和 HTTPS:有何异同?

超文本传输安全协议(HTTPS)是建立在超文本传输协议(HTTP)之上的一种安全网络传输协议。在计算机网络上传输时,HTTPS 通过传输层安全性(TLS)或它的前身安全套接字层(SSL)为…

谷歌上架防关联VPS开到和原来一样的IP造成关联?应该怎么选?

随着Google paly的发展,竞争越来越激烈,开发者们也面临的越来越多的挑战。其中,如何降低关联风险是开发者们重点关注的问题。 为了防止开发者账号的滥用或欺诈,谷歌会通过判断账号之间是否存在关联,并对违规账号进行处…

Unity打开文件,文件夹

注释 unity打开文件文件夹的方法 using System; using System.Collections; using System.Collections.Generic; using System.Runtime.InteropServices; using UnityEngine;public class FilePathHelper {private static string filePath;/// <summary>/// 选择文件路…

【Vue】二、Vue 组件展示控制的优雅解决方案

vue项目中展示的组件&#xff0c;我平常都是通过v-show进行展示控制&#xff0c;类似这样 通常情况下&#xff0c;一个正常展示组件的流程&#xff0c;是通过前端用户点击触发函数&#xff0c;在函数中对data数据进行操作&#xff0c;从而展示不同的页面 showWork: false, sho…

首次接触共享办公室,有哪些问题需要注意?

随着互联网和创业的发展&#xff0c;越来越多的企业和个人选择共享办公空间作为他们的办公场所。共享办公空间是一种提供灵活的办公模式和配套的设施和服务的空间&#xff0c;可以帮助企业和个人节省成本和空间&#xff0c;提高效率和创新&#xff0c;拓展人脉和资源。但是&…

【C++】STL之空间配置器(了解)

一、什么是空间配置器 空间配置器 &#xff0c;顾名思义就是为各个容器高效的管理空间&#xff08;空间的申请与回收&#xff09;的&#xff0c;在默默地工作。虽然在常规使用 STL 时&#xff0c;可能用不到它&#xff0c;但站在学习研究的角度&#xff0c;学习它的实现原理对…