echarts饼图让部分数据显示在图外,部分显示在图内

news2024/11/18 23:47:53

在这里插入图片描述

echarts饼图让部分数据显示在图外,部分显示在图内

var dataList = [
  { value: 10, name: '商户' },
  { value: 20, name: '充电桩' },
  { value: 30, name: '业主' }
]
option = {
  series: [
      {
          type: 'pie',
          radius: '70%',
          data: dataList,
          labelLine: {
              show: true,
              position: 'outside',
              length: 10,
              length2: 50
          },
          emphasis: {
              itemStyle: {
                  shadowBlur: 10,
                  shadowOffsetX: 0,
                  shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
          },
          label: {
              normal: {
                  position: 'outside', // 图外
                  formatter: (params) => {
						return params.data.name+'-'+params.data.value
				  }
              }
          }
      },
      {
          type: 'pie',
          radius: '70%',
          data: dataList,
          emphasis: {
              itemStyle: {
                  shadowBlur: 10,
                  shadowOffsetX: 0,
                  shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
          },
          label: {
              normal: {
                  position: 'inside', // 图内
                  show: true,
                  formatter: '{b}'
              }
          }
      }
  ]
};

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

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

相关文章

JavaSE:4、流程控制

1、代码块与作用域 变量的使用范围,仅限于其定义时所处的代码块,也就是他的作用域。 目前所说的变量均为局部变量 public class Main {public static void main(String [] argv){int a10;{int b10;System.out.println(a);System.out.println(b);}Sys…

计算机网络八股总结

这里写目录标题 网络模型划分(五层和七层)及每一层的功能五层网络模型七层网络模型(OSI模型) 三次握手和四次挥手具体过程及原因三次握手四次挥手 TCP/IP协议组成UDP协议与TCP/IP协议的区别Http协议相关知识网络地址,子…

前端——标签二(超链接)

标签二 超链接标签:a 超链接,实现页面间的跳转和数据传输 a标签的属性 href:跳转路径(url)必须具备,表示点击后会跳转到哪个页面 target:页面打开方式。默认是 _self 如果是 _blank则用新的…

[基于 Vue CLI 5 + Vue 3 + Ant Design Vue 4 搭建项目] 02 配置 nodejs 淘宝镜像仓库

文章目录 为什么要配置淘宝镜像仓库呢如何查看镜像仓库如何配置镜像仓库 为什么要配置淘宝镜像仓库呢 主要是因为默认的镜像仓库是国外的,当我们使用 npm 安装依赖的时候会很慢或者失败,我们配置国内的镜像仓库这样就可以加速我们安装镜像的过程&#x…

突破瓶颈:Java并发编程的最佳实践与技巧,你了解了吗?

文章目录 1 什么是 Executor 和 ExecutorService ?这两个接口有什么区别?2 java.util.concurrent 标准库中 ExecutorService 的可用实现是什么 ?3 什么是 Java 内存模型( JMM )?描述下其目的和基本思想4 JM…

Dubbo精要

1、为什么需要 Dubbo? 分布式系统中的服务调用和协调问题:在分布式系统中,服务之间的相互依赖会导致复杂的通信和协调问题。Dubbo提供了高效的服务调用和自动注册、发现等功能,使得构建分布式应用程序更加容易。服务治理和服务调…

6 递归——509. 斐波那契数 ★

6 递归 509. 斐波那契数 斐波那契数列从0和1开始,后面的每一项数字都是前面两项数字的和。F(0) = 0,F(1) = 1,当n > 1时,F(n) = F(n − 1) + F(n − 2)。给定n,请计算 F(n)。 示例 1: 输入:n = 2 输出:1 解释:F(2) = F(1) + F(0) = 1 + 0 = 1 示例 2: 输入:n …

[000-01-008].第05节:OpenFeign特性-重试机制

我的后端学习大纲 SpringCloud学习大纲 1.1.重试机制的默认值: 1.重试机制默认是关闭的,给了默认值 1.2.测试重试机制的默认值: 1.3.开启Retryer功能: 1.修改配置文件YML的配置: 2.新增配置类: packa…

CentOs 入门必备基础知识详细讲解

​ 大家好,我是程序员小羊! 前言: CentOS(Community ENTerprise Operating System)是一个基于 Red Hat Enterprise Linux (RHEL) 源代码的开源操作系统,主要用于服务器和企业环境。下面是一个详细的入门知识…

JDBC数据库连接技术

JDBC数据库连接技术 基础篇 一、引言 1.1 数据的存储 我们在开发Java程序时,数据都是存储在内存中,属于临时存储,当程序停止或重启时,内存中的数据就丢失了!我们为了解决数据的长期存储问题,有如下解决方…

【Prompt Enhancer】如何优化prompt的内容

背景 在使用LLM的时候,提示词的好坏对模型的输出质量影响很大,提示词又是一个复杂工程,要写出优秀的提示词,需要丰富的经验。正因如此,各类Agent平台都会有自己的提示词增强功能,帮助用户编写提示词。 最…

Linux驱动.之platform平台总线驱动框架(二),正点原子

第五十四章 platform设备驱动实验 我们在前面几章编写的设备驱动都非常的简单,都是对IO进行最简单的读写操作。像I2C、SPI、LCD等这些复杂外设的驱动就不能这么去写了,Linux系统要考虑到驱动的可重用性,因此提出了驱动的分离与分层这样的软件…

数据结构与算法-17高级数据结构_图论(迪杰斯特拉算法)

迪杰斯特拉算法 1 是什么? 迪杰斯特拉算法(Dijkstra’s Algorithm),又称狄克斯特拉算法,是由荷兰计算机科学家埃德加狄克斯特拉(Edsger Dijkstra)于1959年提出的一种用于解决有权图中最短路径…

GPT-4与ChatGPT:人工智能对话的新时代【含国内可用gpt】

随着人工智能(AI)技术的不断突破,人与机器的交互方式正发生深刻的变革。在这股技术浪潮中,GPT-4和基于它的ChatGPT成为了令人瞩目的焦点,推动了对话式AI的快速发展。通过这些技术,我们不仅看到了AI在语言理…

【MySQL】MySQL和Workbench版本兼容问题

1、安装MySQL WorkBench 最新版本下载:https://dev.mysql.com/downloads/workbench/ 历史版本下载:https://downloads.mysql.com/archives/workbench/ 2、问题描述 本人在Windows下安装了一个旧版本的MySQL(5.1),同…

全球NAND原厂闪存市场格局变化

根据市场研究机构TrendForce的最新跟踪报告,三星(Samsung)和SK海力士(SK hynix-Solidigm)在过去的一个季度中扩大了他们在NAND闪存市场的份额,这主要得益于抢占了铠侠(Kioxia)与西部…

Threejs之加载3D模型(下)

本文目录 前言一、代码示例1.1 FBXLoader1.1.1 代码1.1.2 效果1.1.3 动画1.1.3.1 动画效果 1.2 ColladaLoader1.2.1 代码1.2.2 效果 前言 本篇博客基于Threejs之加载3D模型(上)追加常用模型加载示例。 一、代码示例 1.1 FBXLoader 构造函数 FBXLoader(…

【C++指南】作用域限定符 :: 使用详解

💓 博客主页:倔强的石头的CSDN主页 📝Gitee主页:倔强的石头的gitee主页 ⏩ 文章专栏:《C指南》 期待您的关注 目录 引言 1. 访问全局变量 2. 命名空间中的成员访问 3. 类的静态成员访问 4. 嵌套命名空间/类中的…

钾盐矿开采与加工过程中的机电设备选型及管理指南

创作不易,您的打赏、关注、点赞、收藏和转发是我坚持下去的动力! 在钾盐矿的开采和加工过程中,需要使用多种机电设备以确保生产的顺利进行。这些设备主要用于矿石开采、破碎、运输、选矿以及矿物产品的深加工等过程。以下是钾盐矿常用的一些机…

vulnhub靶机:Holynix: v1

下载 下载地址:https://www.vulnhub.com/entry/holynix-v1,20/ 打开虚拟机 选择下载解压之后的文件打开 新添加一张 NAT 网卡,mac 地址修改如下 00:0c:29:bc:05:de 给原来的桥接网卡,随机生成一个 mac 地址 然后重启虚拟机 信息收集 主…