Echarts柱状图横坐标不显示

本人遇到的问题:折线图横坐标可以正常显示 柱状图接收一样的数据在横坐标却显示不了

1.在前端打印是否能够正常接收数据、数据类型是否有误以及数据是否有内容
      console.log(typeof optionbar.xAxis.data)console.log(optionbar.xAxis.data)

2.如上确定能够接收到数据,并且数据格式无误,检查各种关键点如option是否对应这个echarts图
    //折线图let lineDom = document.getElementById('line');let lineChart = echarts.init(lineDom);...lineChart.setOption(optionline);//柱状图let barDom = document.getElementById('bar');let barChart = echarts.init(barDom);...barChart.setOption(optionbar);
3.调整echarts图是否挤压或者遮挡横坐标显示
grid: {left: '3%',right: '4%',bottom: '3%',containLabel: true},
4.以上确定无误后遇到了跟我一样的情况
//折线图横坐标数据处理optionline.xAxis.data = [...new Set((res.data.line || []).map(v => v.date))] || [];//柱状图横坐标数据处理optionbar.xAxis[0].data = [...new Set((res.data.bar || []).map(v => v.date))] || [];

柱状图接收横坐标需要加索引[0],即xAxis[0],神奇,这会应该可以正常显示了

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

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

相关文章

netty 高性能架构设计--零拷贝

文章目录 前言一、直接内存1.1 什么是直接内存1.2 代码实现1.3 使用直接内存的优缺点 二、netty 零拷贝设计2.1 netty 直接内存2.2 netty 内存池 三、零拷贝的两种方式 前言 本篇从源码层面剖析 netty 高性能架构设计之零拷贝,并且扩展讲述零拷贝的两种实现方式。 …

有没有不使用技术分析工具的?众汇10年交易经验发现还真有

不知道各位投资者有没有遇见过不使用技术分析工具的投资者,众汇用自己的10年外汇交易经验保证,别不信还真有,并且不在少数。 其实道理很简单,这些投资者不相信技术分析工具的效率!在这些投资者看来技术分析工具通常比较滞后、需要…

前置知识储备

基本认知 什么是模式 在一定环境中解决一些问题的方案(通俗来说:特定环境中用固定的套路解决问题) 什么是设计模式 设计模式是一套反复被人使用,多数人知晓的,经过分类编目的代码设计经验的总结 设计模式最终的目…

2024蓝桥杯CTF writeUP--缺失的数据

压缩包的内容 里面有secret.txt文件,用ARCHPR工具套上字典,爆破压缩包密码。密码为pavilion 解压得到原图,并且有了加密后的图片,根据代码里的key和参数直接运行脚本解密水印图片: import cv2 import numpy as np imp…

【Golang】VSCode进行GO的调试

原来的launch.json {"version": "0.2.0","configurations": [{"name": "Golang","type": "go","request": "launch","program": "${workspaceFolder}","…

CopyClip for Mac - 高效复制粘贴,轻松管理剪贴板

CopyClip for Mac,一款专为Mac用户打造的剪贴板管理工具,让你在复制粘贴的日常任务中,享受到前所未有的高效与便捷。 它常驻在菜单栏中,时刻准备为你服务。一旦你复制了内容,CopyClip就会自动将其保存至历史记录中&…

为什么Qt这么强大却不受欢迎?

在开始前我有一些资料,是我根据网友给的问题精心整理了一份「Qt的资料从专业入门到高级教程」, 点个关注在评论区回复“888”之后私信回复“888”,全部无偿共享给大家!!虽然这个问题并不被广泛讨论,但我根…

docker-compose安装es+kibana 8.12.2

小伙伴们,你们好,我是老寇,我又回来辣,几个月不见甚是想念啊!!! 因云平台需要改造,es7升级为es8,所以记录一下,es8需要开启ssl认证,需要配置证书…

项目1:STM32+DHT11+FreeRTOS+emwin+LCD

【屏幕显示DHT11数据】 面向对象的思想编写硬件驱动程序,DHT11采集环境中的温湿度数据。使用FreeRTOS提供的任务间通信、同步、互斥,将DHT11的数据传递给显示任务。显示任务中,使用emWin中间件,制作屏幕的各种界面,并将…

基于零一万物多模态大模型通过外接数据方案优化图像文字抽取系统

大模型相关目录 大模型,包括部署微调prompt/Agent应用开发、知识库增强、数据库增强、知识图谱增强、自然语言处理、多模态等大模型应用开发内容 从0起步,扬帆起航。 大模型应用向开发路径:AI代理工作流大模型应用开发实用开源项目汇总大模…

vue3+ts+vant选择器选中文字效果

所需要的样式: 选中某个选项后文字有放大和改变颜色的效果 主要就是在van-picker上加class, 给对应的style样式即可 <van-pickerclass"custom-picker":title"pickerData.titleText"v-if"pickerData.ispicker"show-toolbar:columns"col…

今日刷三题(day11):不同路径的数目(一)+短距离最小路径和+把数字翻译成字符串

题目一&#xff1a;不同路径的数目&#xff08;一&#xff09; 题目描述&#xff1a; 一个机器人在mn大小的地图的左上角&#xff08;起点&#xff09;。机器人每次可以向下或向右移动。机器人要到达地图的右下角&#xff08;终点&#xff09;。可以有多少种不同的路径从起点…

ICME2024 | 基于半监督对比学习的表现力语音合成

人类的语音极富表现力&#xff0c;不仅包括语调和重读&#xff0c;还包括风格和情感等多种元素。表现力语音合成的目标是要精准捕捉并再现这些元素。先前表现力语音合成方面的研究通常将表现力视为单一维度&#xff0c;如风格或情感。但实际上&#xff0c;风格可以随着文本和场…

Matlab实现分段函数拟合(分段点未知)| 源码分享 | 视频教程 | 三种分段函数拟合方法

专栏导读 作者简介&#xff1a;工学博士&#xff0c;高级工程师&#xff0c;专注于工业软件算法研究本文已收录于专栏&#xff1a;《复杂函数拟合案例分享》本专栏旨在提供 1.以案例的形式讲解各类复杂函数拟合的程序实现方法&#xff0c;并提供所有案例完整源码&#xff1b;2.…

Davinci工程CANTP模块讲解

配置CAN的TP模式&#xff0c;涉及BSW\CanTp\CanTp.c和CanTp.h CanTpChannels 他有两组收发&#xff0c;功能诊断和物理诊断。 功能诊断有自己的参数要求 物理诊断的接收要求相对多一些 由于发送只有一个&#xff0c;所以我们把它放在物理诊断接收那组里面。 CanTpGeneral 也…

DDD架构学习

文章目录 领域建模事件风暴四色建模法 DDD名称解析领域子域核心域通用域支撑域限界上下文战术设计实体值对象聚合和聚合根工厂资源库领域服务领域事件 DDD代码的分层名词解析实体值对象聚合根领域服务领域事件 VO&DTO&DO&PO博客 领域建模 领域驱动设计的核心在于领…

厚德提问大佬答3:让AI绘画更有效率

遇到难题不要怕&#xff01;厚德提问大佬答&#xff01; 厚德提问大佬答 你是否对AI绘画感兴趣却无从下手&#xff1f;是否有很多疑问却苦于没有大佬解答带你飞&#xff1f;从此刻开始这些问题都将迎刃而解&#xff01;你感兴趣的话题&#xff0c;厚德云替你问&#xff0c;你解…

iOS xib布局

1.多次启动发现启动图和截屏的图片不一致,设置launch storyboard 不能到顶部 https://blog.csdn.net/u011960171/article/details/104053696/ 2.multipiler是比例&#xff0c;需要控制顺序1.视图&#xff0c;2父视图&#xff0c;选择宽度比例&#xff0c;默认是1 3.Aspect R…

【Java基础】Java异常处理机制超简单的!!

程序在运行时出现的不正常情况 java把程序运行时出现的各种不正常情况提取属性和行为进行描述&#xff0c;从而出现了各种异常类&#xff0c;也就是异常被面向对象了。 异常名称、异常信息、异常发生的位置 Exception in thread "main" java.lang.ArrayIndexOutOf…

海淘美国礼品卡测评:AE/TT/香草卡与国内卡商、亚马逊测评工作室如何变现?(下)

上回分析的四种变现模式&#xff0c;相信大家已经了解清楚。 塔吉特礼品卡&#xff0c;香草礼品卡&#xff0c;AE礼品卡&#xff0c;百思买礼品卡&#xff0c;亚马逊礼品卡&#xff0c;沃尔玛礼品卡&#xff0c;丝芙兰礼品卡&#xff0c;雷蛇礼品卡&#xff0c;谷歌礼品卡&…