echarts 饼图中间添加图片
饼图添加图片只需要配置两部分
option = {
graphic: { // 这个属性可以在饼图内部填充图片,文字等
elements: [{
type: 'image',//需要填充图片,配置image,如果不需要图片可以配置其他的, text, circle, sector, ring, polygon, polyline, rect, line, bezierCurve, arc, group,
style: {
image: giftImageUrl, //这里添加图片地址
width: 110,
height: 120
},
left: 'center',//
top: 'middle' //配置图片居中
}]
},
series: [{
type: 'pie',
radius: ['27%', '45%'],//在这里配置外半径值,和外半径可视部分的大小
center: ['50%', '50%'],
color: ['#0E7CE2', '#FF8352', '#E271DE', '#F8456B', '#00FFFF', '#4AEAB0'],
data: data,
labelLine: {
normal: {
show: false,
length: 20,
length2: 20,
lineStyle: {
color: '#12EABE',
width: 2
}
}
},
}]
};
echarts 饼图中间添加图片的更多相关文章
- echarts饼图扇区添加点击事件
在echarts最后面添加上这段代码就可以了 function eConsole(param) { //alert(option.series[0].data.length); //alert(opt ...
- Java生成PDF文档(表格、列表、添加图片等)
需要的两个包及下载地址: (1)iText.jar:http://download.csdn.net/source/296416 (2)iTextAsian.jar(用来进行中文的转换):http:/ ...
- C#如何在PDF文件添加图片印章
文档中添加印章可以起一定的作用,比如,防止文件随意被使用,或者确保文档内容的安全性和权威性.C#添加图片印章其实也有很多实现方法,这里我使用的是免费的第三方软件Free Spire.PDF,向大家阐述 ...
- C# 给PDF添加图片背景
C# 给PDF添加图片背景 今天要实现的是给PDF文件添加图片背景这个功能.PDF是近年来最流行的文件之一,无论是办公还是日常生活中都经常会用到,很多时候,PDF文件的背景色都是白色,看多了难免觉得累 ...
- ECharts外部调用保存为图片操作及工作流接线mouseenter和mouseleave由于鼠标移动速度过快导致问题解决办法
记录两个项目开发中遇到的问题,一个是ECharts外部调用保存为图片操作,一个是workflow工作流连接曲线onmouseenter和onmouseleave事件由于鼠标移动过快触发问题. 一.外部 ...
- 黄聪:phpexcel中文教程-设置表格字体颜色背景样式、数据格式、对齐方式、添加图片、批注、文字块、合并拆分单元格、单元格密码保护
首先到phpexcel官网上下载最新的phpexcel类,下周解压缩一个classes文件夹,里面包含了PHPExcel.php和PHPExcel的文件夹,这个类文件和文件夹是我们需要的,把class ...
- ECharts饼图试玩
处理类似提交问卷的数据,要生成图表,用了ECharts,好方便的. 简陋效果: 1.表单存储 有单选和多选题,单选直接存储各选项数字值,1,2,3,4...中一个:多选用|分隔存储选项值,如1|3,2 ...
- C# 利用占位符替换word中的字符串和添加图片
利用占位符替换word中的字符串和添加图片 ///<summary> /// 替换word模板文件内容,包括表格中内容 /// 调用如下:WordStr ...
- pyside 为窗口添加图片
有时我们需要添加一些图片到窗口上,下面给一个通过QLable实现的方法. 这里需要注意的是,当你启用多线程时,方法调用的setPixmap,会导致qt报出一个线程安全错误. 因此,让这个绘图工作尽量在 ...
随机推荐
- day06 Java_数组_方法_参数
精华笔记: 数组: 复制: System.arraycopy(a,1,b,0,4); int[ ] b = Arrays.copyOf(a,6); 排序: Arrays.sort(arr); //升序 ...
- Identity Server 4使用OpenID Connect添加用户身份验证(三)
一.说明 基于上一篇文章中的代码进行继续延伸,只需要小小的改动即可,不明白的地方可以先看看本人上一篇文章及源码: Identity Server 4资源拥有者密码认证控制访问API(二) GitHub ...
- day03_2_流程控制
# 流程控制 学习目标: ~~~txt1. idea安装与使用2. 流程控制if...else结构3. 流程控制switch结构4. 流程控制循环结构5. 流程控制关键字~~~ # 一.流程控制概述 ...
- .NET 使用自带 DI 批量注入服务(Service)和 后台服务(BackgroundService)
今天教大家如何在asp .net core 和 .net 控制台程序中 批量注入服务和 BackgroundService 后台服务 在默认的 .net 项目中如果我们注入一个服务或者后台服务,常规的 ...
- 后端Python3+Flask结合Socket.io配合前端Vue2.0实现简单全双工在线客服系统
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_158 在之前的一篇文章中:为美多商城(Django2.0.4)添加基于websocket的实时通信,主动推送,聊天室及客服系统,详 ...
- 论文翻译:2022_Time-Frequency Attention for Monaural Speech Enhancement
论文地址:单耳语音增强的时频注意 引用格式:Zhang Q, Song Q, Ni Z, et al. Time-Frequency Attention for Monaural Speech Enh ...
- 越折腾越好用的 3 款开源 APP
高中的时候我特别喜欢捣鼓手机,然后我一个哥们儿在我的强烈推荐下买了个 HTC Dream(G1) 手机. G1 作为谷歌的第一个亲儿子,它出厂搭载的是 Android 1.5 系统,但当时已经出到了 ...
- 原生js也可以自定义组件
Web Components 是一套不同的技术,允许您创建可重用的定制元素(它们的功能封装在您的代码之外)并且在您的web应用中使用它们. 它由三项主要技术组成,它们可以一起使用来创建封装功能的定制元 ...
- Redis进阶篇:发布订阅模式原理与运用
"65 哥,如果你交了个漂亮小姐姐做女朋友,你会通过什么方式将这个消息广而告之给你的微信好友?" "那不得拍点女朋友的美照 + 亲密照弄一个九宫格图文消息在朋友圈发布大肆 ...
- Canvas 线性图形(四):矩形
函数 CanvasPath.rect(x, y, w, h) 参数名 类型 描述 x Number 矩形起始位置 y Number 矩形起始位置 w Number 矩形宽度 h Number 矩形高度 ...