百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 热门文章 > 正文

手把手教你用ECharts画饼图和环形图

bigegpt 2025-02-15 14:35 7 浏览

导读:饼图也是一种常用的基本图表,主要用来展示各项的比重。

作者:王大伟

来源:华章科技

下面制作一幅基础的饼图,将Echarts中series的type参数值设置为pie,如图4-14所示。

代码如下:

option?=?{
????title:?{
????????text:?'各商品销量占比',
????????subtext:?'A商场情况分析',
????????left:?'center'
????},
????tooltip:?{
????????trigger:?'item',
????????formatter:?'{a}?
{b}?:?{c}?({d}%)' ????}, ????legend:?{ ????????orient:?'vertical', ????????left:?'left', ????????data:?['A商品',?'B商品',?'C商品',?'D商品',?'E商品'] ????}, ????series:?[ ????????{ ????????????name:?'所售商品', ????????????type:?'pie', ????????????data:?[ ????????????????{value:?343,?name:?'A商品'}, ????????????????{value:?250,?name:?'B商品'}, ????????????????{value:?509,?name:?'C商品'}, ????????????????{value:?108,?name:?'D商品'}, ????????????????{value:?948,?name:?'E商品'} ????????????], ????????} ????] };

在上述代码中,将legend设置为vertical,是为了避免水平显示后会与标题重叠。这里将tooltip的显示格式设置为:formatter: '{a}
{b} : {c} ({d}%)',各参数在饼图中的具体含义为:{a}(系列名称),{b}(数据项名称),{c}(数值),{d}(百分比)。当鼠标悬停在某块饼上时,该块饼会突出显示且按照formatter的格式显示文字和数值。

需要注意的是,当我们点击饼图的legend时,如点击C商品的legend时,C商品的图例会变为灰色,同时,饼图中将不再显示C商品饼块,且会重新计算百分比,如图4-15所示。

除了基本的饼图,我们也常常会用到环形图。在ECharts中,在series中加上radius参数即可绘制环形图,例如下面代码中的radius: ['50%', '70%'],代表环内部半径和外部半径的比例分别为50%、70%。

option?=?{
????title:?{
????????text:?'各商品销量占比',
????????subtext:?'A商场情况分析',
????????left:?'center'
????},
????tooltip:?{
????????trigger:?'item',
????????formatter:?'{a}?
{b}?:?{c}?({d}%)' ????}, ????legend:?{ ????????orient:?'vertical', ????????left:?'left', ????????data:?['A商品',?'B商品',?'C商品',?'D商品',?'E商品'] ????}, ????series:?[ ????????{ ????????????name:?'所售商品', ????????????type:?'pie', ????????????radius:?['50%',?'70%'], ????????????data:?[ ????????????????{value:?343,?name:?'A商品'}, ????????????????{value:?250,?name:?'B商品'}, ????????????????{value:?509,?name:?'C商品'}, ????????????????{value:?108,?name:?'D商品'}, ????????????????{value:?948,?name:?'E商品'} ????????????], ????????} ????] };

环形图可视化结果如图4-16所示。

关于作者:王大伟,毕业于华东理工大学,硕士学历,目前就职于平安金融壹账通,从事数据挖掘算法工作,擅长ECharts、Python、自然语言处理、数据分析挖掘、机器学习。曾获微软最有价值专家(MVP)荣誉称号。

本文摘编自《ECharts数据可视化:入门、实战与进阶》,经出版方授权发布。

推荐语:ECharts官方推荐,系统全面、由浅入深、注重实操,带领读者快速从新人到高手。

相关推荐

机器学习分类模型评估(三)-F值(F-Measure)、AUC、P-R曲线

概述上二篇文章分别讲述了准确率(accuracy)、精确率(Precision)、查准类、召回率(Recall)、查全率、ROC曲线,本文讲述机器学习分类模型评估中的F值(F-Measure)、AUC...

SPSS ROC曲线诊断临界值确定

ROC曲线是在临床医学和流行病学研究中一种常用的在诊断试验、预测模型中用于决定最佳临界点的方法。ROC曲线用真阳性率和假阳性率作图得出曲线,其横轴表示假阳性率(1-特异度),纵轴表示真阳性率(灵敏度)...

分类器模型检测--ROC曲线和AUC值

在监督学习建模中有一个重要的模块是模块的检测,就是怎样判断一个模型的好坏?那么常用的的检测的指标有P值、R值、F值、ROC曲线、AUC值等,今天来学习他们都是怎么来的,有什么用处。这里为二分类问题,即...

【Python机器学习系列】建立梯度提升模型预测心脏疾病

这是Python机器学习系列原创文章,我的第204篇原创文章。一、引言对于表格数据,一套完整的机器学习建模流程如下:针对不同的数据集,有些步骤不适用即不需要做,其中橘红色框为必要步骤,由于数据质量较高...

如何Keras自动编码器给极端罕见事件分类

全文共7940字,预计学习时长30分钟或更长本文将以一家造纸厂的生产为例,介绍如何使用自动编码器构建罕见事件分类器。现实生活中罕见事件的数据集:背景1.什么是极端罕见事件?在罕见事件问题中,数据集是...

机器学习分类问题:9个常用的评估指标总结

对机器学习的评估度量是机器学习核心部分,本文总结分类问题常用的metrics分类问题评估指标在这里,将讨论可用于评估分类问题预测的各种性能指标1ConfusionMatrix这是衡量分类问题性能的...

基于R语言的ROC曲线绘制及最佳阈值点(Cutoff)选择

ROC曲线在介绍ROC曲线之前,我们首先需要介绍混淆矩阵(ConfusionMatrix)。在统计分类模型的评估过程中分别统计分类模型归错类,归对类的观测值个数,然后把结果放在一个表里展示出来的表格...

R数据分析:多分类问题预测模型的ROC做法及解释

有同学做了个多分类的预测模型,结局有三个类别,做的模型包括多分类逻辑回归、随机森林和决策树,多分类逻辑回归是用ROC曲线并报告AUC作为模型评估的,后面两种模型报告了混淆矩阵,审稿人就提出要统一模型评...

SPSS实战:多个指标ROC曲线方向不一致的解决办法汇总(收藏)

在诊断实验和预测模型的临床效能评价中,我们常常用到ROC曲线分析。在SPSS中绘制ROC曲线操作比较简单,但如果将多个指标的ROC曲线绘制在同一个图中,有时候会碰到有些指标的ROC曲线在对角线上面,一...

小果教你快速分析ROC生存曲线图

尔云间一个专门做科研的团队原创小果生信果小伙伴们,大家好呀,很高兴和大家见面,前段时间应小伙伴出的解读ROC曲线图,小伙伴反应很是积极,这不最近小伙伴对于不同年份的ROC曲线图的分析呼声很高,...

生信文章中高频出现、模型评估必备分析——ROC曲线图,怎么看?

尔云间一个专门做科研的团队关注我们做了生信分析,拿到一堆数据,看不懂图怎么办?火山图、热图、散点图、箱线图、瀑布图···这么多类型的图都咋看?风险模型预后评估图、GO-KEGG富集分析图、GSEA...

如何看懂文献里那些图——ROC曲线图

ROC曲线的基本思想是把敏感度和特异性看作一个连续变化的过程,用一条曲线描述诊断系统的性能,其制作原理是在连续变量中不同界值点处计算相对应的灵敏度和特异度,然后以敏感度为纵坐标、1-特异性为横坐标绘制...

超强,必会的机器学习评估指标

大侠幸会,在下全网同名[算法金]0基础转AI上岸,多个算法赛Top[日更万日,让更多人享受智能乐趣]构建机器学习模型的关键步骤是检查其性能,这是通过使用验证指标来完成的。选择正确的验证指...

准确性检验 (ROC曲线)的SPSS操作教程及结果解读

作者/风仕在上一期,我们已经讲完了诊断试验的基础知识,这期开始讲准确性检验(ROC曲线),我们主要从准确性检验(ROC曲线)的介绍、基本概念、绘制原理、统计量、使用条件及案例的SPSS操作演示这几...

SPSS:ROC 曲线为什么反了?

【作者介绍】李志辉,长期从事各类统计软件应用研究,主编或参编SPSS、MINITAB、STATISTICA多个统计软件教材共8本。代表作:电子工业出版社《SPSS常用统计分析教程(SPSS22.0中...