uniapp在APP端使用echarts用formatter设置y轴保留2位小数点不生效

news2024/11/16 7:28:47

在这里插入图片描述
uniapp使用echarts,在内置浏览器中,设置保留2位小数能正常显示(代码如下),但是在APP端这个设置不起作用。

yAxis: {
    type: 'value',
    axisLabel: {
      formatter: function (val) {
        return val.toFixed(2); //y轴始终保留小数点一位
      }
    }
  },

app端不生效是因为:
在app端,回调函数无法从renderjs外传递,上面的设置使用了回调函数formatter,所以app端不生效。

解决方法

在引用echarts中,有一个初始化的文件,找到里面update方法,加入一段代码(代码如下)。

未加入前的代码
update(option) {
				if (this.chart) {
					// 因App端,回调函数无法从renderjs外传递,故在此自定义设置相关回调函数
					if (option) {
						// tooltip
						if (option.tooltip) {
							// 判断是否设置tooltip的位置
							if (option.tooltip.positionStatus) {
								option.tooltip.position = this.tooltipPosition()
							}
							// 判断是否格式化tooltip
							if (option.tooltip.formatterStatus) {
								option.tooltip.formatter = this.tooltipFormatter(option.tooltip.formatterUnit, option
									.tooltip.formatFloat2, option.tooltip.formatThousands)
							}
						}
						// 设置新的option
						this.chart.setOption(option, option.notMerge)
					}
				}
			},
加入后的代码
update(option) {
				if (this.chart) {
					// 因App端,回调函数无法从renderjs外传递,故在此自定义设置相关回调函数
					if (option) {
						// tooltip
						if (option.tooltip) {
							// 判断是否设置tooltip的位置
							if (option.tooltip.positionStatus) {
								option.tooltip.position = this.tooltipPosition()
							}
							// 判断是否格式化tooltip
							if (option.tooltip.formatterStatus) {
								option.tooltip.formatter = this.tooltipFormatter(option.tooltip.formatterUnit, option
									.tooltip.formatFloat2, option.tooltip.formatThousands)
							}
						}
						if (option.yAxis !== undefined) {
							// #ifdef APP-PLUS
							if (option.yAxis.length > 0) {
								option.yAxis.forEach(el => {
									if(el.axisLabel) {
										el.axisLabel.formatter = function(val) {
											return val.toFixed(2) //y轴始终保留小数点一位
										}
									}
								})
							}
							// #endif
						}
						// 设置新的option
						this.chart.setOption(option, option.notMerge)
					}
				}
			},

如有其他formatter方法不生效,可在这个里面进行设置。

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

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

相关文章

H桥电机驱动器MS35656可pin对pin兼容DRV8812

MS35656 是一款双通道 DMOS 全桥驱动器,可以驱动一个步进电机或者两个直流电机。每个全桥的驱动电流在 24V 电源下可以工作到 1.4A。MS35656 集成了固定关断时间的 PWM 电流校正器,以及一个 2bit 的非线性 DAC(数模转换器)&#x…

【WinForm详细教程五】WinForm中的MenuStrip 、ContextMenuStrip 、ToolStrip、StatusStrip控件

文章目录 1.MenuStrip2.ContextMenuStrip3.ToolStrip4.StatusStrip 1.MenuStrip MenuStrip作为一个容器可以包含多个菜单项。MenuStrip 的重要属性包括: Name:菜单的名字Dock:菜单的停靠位置Items:菜单项的集合 ToolStripMenuI…

WebDAV之π-Disk派盘 + 一叶日记

推荐一款操作方便、界面简洁,记录生活点滴与心情,具有诗情画意的日记软件。 一叶日记是一款记录日记的手机软件,在这款软件中它里面有着各种不同的工具,可以方便用户去随时随地的记录日记,同时里面还有着各种不同的主题背景,可以供用户去选择使用各种功能,给用户记录带…

精准努力,提升自己的核心竞争力——中国人民大学与加拿大女王大学金融硕士

步入职场,相信大家都想成为职场的宠儿。经过一番摸爬滚打后,在职场稳固了地位。但想叱咤职场,还需要精准努力,提升自己的核心竞争力。中国人民大学与加拿大女王大学金融硕士项目为你补给能量。 任何资产都有贬值的风险&#xff0…

超好用的IDEA插件推荐,写完代码直接调试接口

Apipost推出IDEA插件非常省时高效,写完代码直接可以进行调试,而且支持生成接口文档,真是后端神器啊! 可以点击下方链接安装更新或在插件商店中搜索安装 下载链接:https://plugins.jetbrains.com/plugin/22676-apipos…

解决postman打开一直转圈圈的问题

项目场景: 对于后端开发来说,Postman是经常使用的。特别是一些前后端分离的项目,后端开发测试接口就需要一款好用的接口测试工具,postman就是一款使用方便功能比较齐全的测试工具 问题描述 最近使用postman进行接口测试&#xf…

矢量图编辑_Inkscape裁剪与蒙版

文章目录 一、简介二、示例三、裁剪 Clipping四、蒙版 Masking 一、简介 裁剪(Clipping) 和 蒙版/遮罩(masking) 是限制对象(或对象组)哪一部分可见的方法。对于裁剪, 裁剪路径(cli…

window安装不同版本的mysql

引用:https://blog.csdn.net/weixin_45151960/article/details/113537526 当安装第二个的时候,,会有问题,, 下载mysql8 和 mysql5.7 : https://downloads.mysql.com/archives/community 下载之后&#xff…

项目实战:通过axios加载水果库存系统的首页数据

1、创建静态页面 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>Title</title><link rel"stylesheet" href"style/index.css"><script src"script/axios.mi…

python调用飞书机器人发送文件

当前飞书webhook机器人还不支持发送文件类型的群消息&#xff0c;可以申请创建一个机器人应用来实现群发送文件消息。 创建机器人后&#xff0c;需要开通一系列权限&#xff0c;然后发布。由管理员审核通过后&#xff0c;才可使用。 包括如下的权限&#xff0c;可以获取群的c…

项目实战:封装响应结果以及抽取响应代码到工具类

1、创建GsonUtil工具类&#xff0c;封装把java对象转成json字符串方法 package com.csdn.fruit.util; import com.google.gson.Gson; public class GsonUtil {public static String toJson(Object obj) {//java object -> java json stringGson gson new Gson();return gs…

Kibana中使用Dev Tools控制台创建索index引同时添加date类型的时间参数(用于根据时间序列展示数据)

天行健&#xff0c;君子以自强不息&#xff1b;地势坤&#xff0c;君子以厚德载物。 每个人都有惰性&#xff0c;但不断学习是好好生活的根本&#xff0c;共勉&#xff01; 文章均为学习整理笔记&#xff0c;分享记录为主&#xff0c;如有错误请指正&#xff0c;共同学习进步。…

Jmeter参数化 —— 循环断言多方法

1、参数化接口测试数据 注意&#xff1a;csv文档参数化&#xff0c;里面有多少条数据&#xff0c;就要在线程组里循环多少次&#xff0c;不然就只执行一次 2、添加配置元件-计数器 关于计数器&#xff1a; ①Starting Value&#xff1a;给定计数器的初始值; ②递增&#xff1a…

listFiles()为null原因

调用listFiles为null原因 前言一、错误原因二、正确使用方法 前言 今天笔者在对File文件进行listFiles方法调用时&#xff0c;发现报错返回空指针异常&#xff0c;下面是列举的可能出现的错误的原因。 一、错误原因 不能对文件进行listFiles方法调用 二、正确使用方法 对文件夹…

TSINGSEE青犀景区AI智慧监管平台,赋能文旅行业高质量发展

一、背景需求分析 随着我国旅游经济的蓬勃发展&#xff0c;旅游行业逐渐成为国民经济增长的支柱性产业。“十四五”期间&#xff0c;国内旅游业将从高速增长阶段转向高质量发展阶段&#xff0c;与此同时&#xff0c;旅游景区的安全生产工作也迎来了新的挑战和需求。尤其是节假…

Ceph:关于Ceph 中创建和管理自定义 CRUSH Map

写在前面 准备考试&#xff0c;整理 Ceph 相关笔记博文内容涉及&#xff0c;管理和定制CRUSH Map以及管理OSD Map理解不足小伙伴帮忙指正 对每个人而言&#xff0c;真正的职责只有一个&#xff1a;找到自我。然后在心中坚守其一生&#xff0c;全心全意&#xff0c;永不停息。所…

python requests模块的使用以及网页信息爬取

python requests模块的使用以及网页信息爬取 文章目录 python requests模块的使用以及网页信息爬取网页信息爬取REQUEST模块模块中的请求方法请求方法中的参数响应对象中属性 获取网站中的源代码获取图片地址匹配单个字符匹配一组字符其他元字符核心函数 图片下载 requests 模块…

经验总结2023-11-2

axios发起post请求的方式&#xff1a; 要解决跨域问题&#xff0c;后端要加&#xff0c;指定支持的方法是Pos还是get&#xff1a;

leetCode 198.打家劫舍 动态规划入门:从记忆化搜索到递推

leetCode 198.打家劫舍 198. 打家劫舍 - 力扣&#xff08;LeetCode&#xff09; 你是一个专业的小偷&#xff0c;计划偷窃沿街的房屋。每间房内都藏有一定的现金&#xff0c;影响你偷窃的唯一制约因素就是相邻的房屋装有相互连通的防盗系统&#xff0c;如果两间相邻的房屋在同一…

地空智能国产化RTS无线探地雷达

广东地空智能科技有限公司推出的国产RTS无线探地雷达&#xff0c;是国内首款基于实时采样、高叠加技术的无线连接的探地雷达。RTS系列雷达是主机、天线一体化设计&#xff0c;32Bit数据&#xff0c;内部配置WiFi基站&#xff0c;无线传输距离≥100M&#xff0c;1000mAh进口电芯…