Echarts 柱状图显示百分比

以下是生成的 option 

option = {
  yAxis: { name: '金额(元)', type: 'value' },
  xAxis: { type: 'category' },
  legend: {},
  series: [
    {
      stack: 'x',
      name: '早餐',
      label: {
        normal: {
          show: true,
          position: 'insideRight',
          // 格式化显示
          formatter: function (params) {
            let aa = params.seriesName + 'per';
            return params.data[aa];
          }
        }
      },
      type: 'bar'
    },
    {
      stack: 'x',
      name: '午餐',
      label: {
        normal: {
          show: true,
          position: 'insideRight',
          formatter: function (params) {
            let aa = params.seriesName + 'per';
            return params.data[aa];
          }
        }
      },
      type: 'bar'
    },
    {
      stack: 'x',
      name: '晚餐',
      label: {
        normal: {
          show: true,
          position: 'insideRight',
          formatter: function (params) {
            let aa = params.seriesName + 'per';
            return params.data[aa];
          }
        }
      },
      type: 'bar'
    }
  ],
  tooltip: {},
  title: { text: '每月销售数据' },
  // 使用数据集设置数据
  dataset: {
    source: [
      {
        product: '01',
        晚餐per: '20.64%',
        午餐: 88752.57,
        早餐per: '0.07%',
        晚餐: 23098.21,
        早餐: 73.0,
        午餐per: '79.30%'
      },
      {
        product: '02',
        晚餐per: '24.45%',
        午餐: 121701.86,
        早餐per: '0.31%',
        晚餐: 39547.61,
        早餐: 504.02,
        午餐per: '75.24%'
      },
      {
        product: '03',
        晚餐per: '29.46%',
        午餐: 159766.78,
        早餐per: '0.26%',
        晚餐: 66962.8,
        早餐: 590.0,
        午餐per: '70.28%'
      },
      {
        product: '04',
        晚餐per: '27.38%',
        午餐: 148685.83,
        早餐per: '0.07%',
        晚餐: 56110.05,
        早餐: 149.15,
        午餐per: '72.55%'
      },
      {
        product: '05',
        晚餐per: '25.80%',
        午餐: 160834.78,
        早餐per: '0.57%',
        晚餐: 56350.46,
        早餐: 1236.01,
        午餐per: '73.64%'
      },
      {
        product: '06',
        晚餐per: '23.86%',
        午餐: 158644.58,
        早餐per: '0.00%',
        晚餐: 49719.0,
        早餐: 0.5,
        午餐per: '76.14%'
      },
      {
        product: '07',
        晚餐per: '19.59%',
        午餐: 82146.2,
        早餐per: '0.07%',
        晚餐: 20031.44,
        早餐: 74.0,
        午餐per: '80.34%'
      },
      {
        product: '08',
        晚餐per: '0%',
        午餐: '0.00',
        早餐per: '0%',
        晚餐: '0.00',
        早餐: '0.00',
        午餐per: '0%'
      },
      {
        product: '09',
        晚餐per: '0%',
        午餐: '0.00',
        早餐per: '0%',
        晚餐: '0.00',
        早餐: '0.00',
        午餐per: '0%'
      },
      {
        product: '10',
        晚餐per: '0%',
        午餐: '0.00',
        早餐per: '0%',
        晚餐: '0.00',
        早餐: '0.00',
        午餐per: '0%'
      },
      {
        product: '11',
        晚餐per: '0%',
        午餐: '0.00',
        早餐per: '0%',
        晚餐: '0.00',
        早餐: '0.00',
        午餐per: '0%'
      },
      {
        product: '12',
        晚餐per: '0%',
        午餐: '0.00',
        早餐per: '0%',
        晚餐: '0.00',
        早餐: '0.00',
        午餐per: '0%'
      }
    ],
    dimensions: ['product', '早餐', '午餐', '晚餐']
  }
};

生成的柱状图如下

 

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

LabVIEW使用自定义模板和示例项目来开发LabVIEW项目

LabVIEW使用自定义模板和示例项目来开发LabVIEW项目 创建项目时,LabVIEW将显示“创建项目”对话框,以帮助您选择模板或示例项目来作为开发起点。如果要使用您创建的项目作为自定义模板和示例项目,您必须将每个项目的源文件和元数据添加到相应…

软件外包开发的需求分析

需求分析是软件开发中的关键步骤,其目的是确定用户需要什么样的软件,以及软件应该完成哪些任务。需求分析是软件工程的早期工作,也是软件项目成功的基础,因此花费大量精力和时间去做好需求分析是值得的。今天和大家分享软件需求分…

Macbook M1编译安装Java OpenCV

OpenCV-4.8.0编辑安装 查询编译依赖 brew info opencv确保所有需要模块都打上了✔,未打✔的需要使用brew进行安装 下载OpenCV源码 在此处下载OpenCV源代码,选择Source,点击此处下载opencv_contrib-4.8.0 或者使用如下命令,通…

MultipartFile类型接收上传文件报出的UncheckedIOException以及删除tomcat临时文件失败源码探索

1、描述异常背景: 因为需要分析数据,待处理excel文件的数据行数太大,手动太累,花半小时写了一个定制的数据入库工具,改成了通用的,整个项目中的万级别数据都在工具上分析,写SQL进行分析&#x…

2_Apollo4BlueLite中断控制器NVIC

1.概述 Apollo4BlueLite 的中断控制器是采用 ARM Cortex-M4 内核,并集成了 NVIC(Nested Vectored Interrupt Controller,嵌套向量中断控制器)作为其中断控制器。 NVIC 是 ARM Cortex-M 系列处理器中常用的中断控制器&#xff0c…

算法(2)

二叉树 镜像二叉树 树轴对称 第一个节点的左子树与第二个节点的右子树同步递归对比,第一个节点的右子树与第二个节点的左子树同步递归比较。 二叉树序列化、反序列化 当然你也可以根据满二叉树结点位置的标号规律来序列化,还可以根据先序遍历和中序遍…

余切拉普拉斯算子推导 cotangent Laplace-Beltrami operator

欢迎关注更多精彩 关注我,学习常用算法与数据结构,一题多解,降维打击。 参考自polygon mesh proccessing这本书 基本思路及原理 余切拉普拉斯算子是一种考虑了网格底层几何联系的一种算子,在网格平滑,参数化等算法中…

Llama 2: Open Foundation and Fine-Tuned Chat Models

文章目录 TL;DRIntroduction背景本文方案 实现方式预训练预训练数据训练细节训练硬件支持预训练碳足迹 微调SFTSFT 训练细节 RLHF人类偏好数据收集奖励模型迭代式微调(RLHF)拒绝采样(Rejection Sampling)PPO多轮一致性的系统消息&…

2023 年第二届钉钉杯大学生大数据挑战赛 初赛 B:美国纽约公共自行车使用量预测分析 问题二Python代码分析

2023 年第二届钉钉杯大学生大数据挑战赛 初赛 B:美国纽约公共自行车使用量预测分析 问题二 相关链接 【2023 年第二届钉钉杯大学生大数据挑战赛】 初赛 B:美国纽约公共自行车使用量预测分析 问题一Python代码分析 【2023 年第二届钉钉杯大学生大数据挑…

Tensorflow学习

一、处理数据的结构 案例代码如下: import tensorflow.compat.v1 as tf tf.disable_v2_behavior() import numpy as np# create data x_data np.random.rand(100).astype(np.float32) y_data x_data*0.1 0.3# 创建结构(一维结构) Weights tf.Variable(tf.random.uniform(…

Megatron-LM、NVIDIA NeMo、model_optim_rng.pt 文件是什么?

本文涉及以下几个概念,分别是: Megatron和Megatron-LM-v1.1.5-3D_parallelism NVIDIA NeMo Megatron和Megatron-LM-v1.1.5-3D_parallelism是什么? Megatron是由NVIDIA开发的一种用于训练大规模语言模型的开源框架。它旨在提供高效的分布式…

安科瑞能源物联网以能源供应、能源管理、设备管理、能耗分析的能源流向为主线-安科瑞黄安南

摘要:随着科学技术的发展,我国的物联网技术有了很大进展。为了提升电力抄表服务的稳定性,保障电力抄表数据的可靠性,本文提出并实现了基于物联网的智能电力抄表服务平台,结合云计算、大数据等技术,提供电力…

雷达信号处理自学总结(持续更新)

傅里叶变换的频率分辨率 频率分辨率 采样频率 信号长度 频率分辨率 \frac{采样频率 }{信号长度} 频率分辨率信号长度采样频率​ 可用numpy模块的fft.fftfreq函数求出傅里叶变换的频率分辨率。 https://numpy.org/doc/stable/reference/generated/numpy.fft.fftfreq.html

opencv 图像距离变换 distanceTransform

图像距离变换:计算图像中每一个非零点距离离自己最近的零点的距离,然后通过二值化0与非0绘制图像。 #include "iostream" #include "opencv2/opencv.hpp" using namespace std; using namespace cv;int main() {Mat img, dst, dst…

关于position:fixed定位的位置不对的问题(即没有按照浏览器的窗口进行定位)

问题: 今天在开发过程中发现元素使用 position: fixed 时位置有问题,位置跟我写的位置对不上,后面在 MDN 上面找到了答案,下面是关于 position: fixed 的描述: fixed: 元素会被移出正常文档流,并…

通过Vue-cli解决前端跨域问题

1、找到vue.config.js 在vue.config.js当中增加如下配置 devServer: {port: 3001,proxy: {/agent: {target: http://10.8.50.250:6666,ws: false, //true,开启ws, 如果是http代理此处可以不用设置changeOrigin: true, // 如果接口跨域,需要进行这个参…

Rust之包、单元包及模块

包:一个用于构建、测试并分享单元包的Cargo功能;单元包:一个用于生成库或可执行文件的树形模块结构;模块及use关键字:被用于控制文件结构、作用域及路径的私有性;路径:一种用于命名条目的方法&a…

【电商小知识】7个步骤让你快速了解跨境电商!

近几年来,随着互联网的发展,国内外的商业贸易越来越流畅,直播电商的火爆也带动着一大批相关的产业链发展,其中跨境电商就是尤为突出的一个。尽管在国内做跨境电商的企业数量非常之多,但仍有许多新人争相入局&#xff0…

安防监控视频汇聚平台EasyCVR修改录像计划等待时间较长是什么原因?

安防监控视频EasyCVR视频融合汇聚平台基于云边端智能协同,支持海量视频的轻量化接入与汇聚、转码与处理、全网智能分发等。音视频流媒体视频平台EasyCVR拓展性强,视频能力丰富,具体可实现视频监控直播、视频轮播、视频录像、云存储、回放与检…

Ceph部署方法介绍

Ceph部署方法介绍 Installing Ceph — Ceph Documentation Ceph环境规划 admin是一个部署节点