关于Echarts南丁格尔玫瑰图的部分解释

<template><div id="easyEcharts" style="height: 600px;width: 800px"></div>
</template><script>
export default {name: "easyEcharts",data(){return{easyEcharts:{//标题title: {text: '南丁格尔玫瑰图',//主标题subtext: '纯属虚构',//副标题left: 'center',//link: 'https://www.baidu.com',//主标题超链接target: 'self',//指定超链接打开方式，blank是新窗口打开，self是当前窗口打开//主标题文字的设置textStyle:{color : 'blue',//修改主标题文字的字体颜色fontStyle: 'oblique',//主标题文字字体风格，有三种样式normal默认，italic倾斜，oblique(也是倾斜...)fontWeight: 'normal',//主标题文字字体的粗细fontSize: 18,//主标题文字的字体大小lineHeight: 10,//行高}},//提示框tooltip: {trigger: 'item',//触发类型:item是图形触发，axis是坐标轴触发，none是什么都不触发formatter: '{a} <br/>{b} : {c} ({d}%)'//提示框浮层内容格式器，支持字符串模板和回调函数两种形式},//图例组件legend: {left: 'center',//图例组件离容器左侧得距离top: 'bottom',//图例组件离容器上侧的距离data: ['rose1', 'rose2', 'rose3', 'rose4', 'rose5', 'rose6', 'rose7', 'rose8']//图例的数据数值，数组项通常为一个字符串，每一项代表一个系列的name},//工具栏toolbox: {show: true,//是否显示工具栏组件feature: {//各工具配置项mark: {show: true},//辅助线是否展示dataView: {//数据视图工具show: true,//是否展示数据视图工具readOnly: false//是否不可编辑},magicType: {//动态类型切换show: true,//动态类型切换是否显示type: ['pie', 'funnel']//启用的动态类型},restore: {show: true},//是否显示配置项还原saveAsImage: {show: true}//是否显示保存为图片}},series: [//系列列表{name: '半径模式',//系列名称type: 'pie',//用来确定系列列表是什么类型，pie就是饼图radius: [20, 110],//饼图的半径，第一项是内半径，第二项是外半径，内半径设大可以显示成圆环图center: ['25%', '50%'],//饼图的中心(圆心)坐标，第一项是横坐标，第二项是纵坐标roseType: 'radius',//用来定义饼形图变成南丁格尔玫瑰图，两种模式，使用redius可以用圆心角展现数据百分比，半径来展示数据大小；使用area圆心角相同，通过半径展示数据，label: {//单个扇区的标签配置show: false//不显示},emphasis: {//高亮的图形样式(着重显示)label: {//show: true}},data: [{value: 5, name: 'rose1'},{value: 10, name: 'rose2'},{value: 15, name: 'rose3'},{value: 20, name: 'rose4'},{value: 25, name: 'rose5'},{value: 30, name: 'rose6'},{value: 35, name: 'rose7'},{value: 40, name: 'rose8'}]},{name: '面积模式',type: 'pie',radius: [30, 110],center: ['75%', '50%'],roseType: 'area',data: [{value: 5, name: 'rose1'},{value: 10, name: 'rose2'},{value: 15, name: 'rose3'},{value: 20, name: 'rose4'},{value: 25, name: 'rose5'},{value: 30, name: 'rose6'},{value: 35, name: 'rose7'},{value: 40, name: 'rose8'}]}]}}},methods:{trueRou(){this.a = this.$echarts.init(document.getElementById("easyEcharts"))this.a.setOption(this.easyEcharts,true)}},mounted() {this.trueRou();}
}
</script><style scoped></style>

关于Echarts南丁格尔玫瑰图的部分解释相关推荐

❤echarts 南丁格尔玫瑰图的使用以及南丁格尔玫瑰图详细配置
❤echarts 南丁格尔玫瑰图的使用以及南丁格尔玫瑰图详细配置 1.认识使用可以参考之前文章,会使用直接跳过1 引入官网的南丁格尔玫瑰图效果如下: 使用函数配置分为三个部分:初始化=> 设置 ...
echarts南丁格尔玫瑰图每块单独设置颜色
UI效果图: 我参照官网的例子,默认的颜色,出来之后的效果: 页面源代码: <template><div class="pieChart" ref="p ...
echarts绘制嵌套环形图(南丁格尔玫瑰图)
根据专业总人数和学院总人数绘制嵌套环形图首先,echarts的基本步骤引入js,准备容器,初始化实例, <script src="lib/echarts.min.js"& ...
echarts 饼图的一种---南丁格尔玫瑰图按照百分比大小进行排序以及颜色设置的两种方式（普通设置颜色和渐变色设置）
本篇博文是记录一下我在开发过程中遇到的一个问题,那就是对于南丁格尔玫瑰图(或者饼图)如何根据百分比大小进行排列,可以很直观的看出数据高低. 首先给大家展示一下官方的样式,具体代码可以去官网上查看:ht ...
【Python数据分析——使用matplotlib制作南丁格尔玫瑰图】
目录一.介绍二.相关库三.数据准备四.pyecahrts代码实现五.matplotlib代码实现一.介绍玫瑰图是弗罗伦斯·南丁格尔所发明的.又名为极坐标面积图,是一种圆形的直方图. 南丁 ...
一个与战争、瘟疫、感染、死亡率有关的图形——南丁格尔玫瑰图
众所周知,世界上第一个护士便是弗洛伦斯·南丁格尔,她是护理事业的创始人和现代护理教育的奠基人.但也许大家不知道,她也是个伟大的统计学家. 19世纪50年代,在克里米亚战争中,南丁格尔主动申请,自愿担任 ...
tableau实战系列（三十九）-教你如何优雅的做图表展示-南丁格尔玫瑰图
前言饼图是常用的分析图表之一,但当分析的数据类别过多时,饼图就会因为分区密集,大大降低其可视化效果(如下图). 遇到这种情况,可以考虑使用南丁格尔玫瑰图.事实上,它的可视化呈现很不错. 如果觉得玫瑰 ...
26.27.28.29.极区图（南丁格尔玫瑰图）、维恩图（Venn diagram）、面状图（Area chart）、树地图
26.极区图(南丁格尔玫瑰图) 27.维恩图 (Venn diagram) 28.面状图(Area chart) 29.树地图 26.极区图(南丁格尔玫瑰图) 极区图(又名南丁格尔玫瑰图)呈放射延伸状 ...
Python数据可视化之南丁格尔玫瑰图(亲测)
文章目录 1. 什么是南丁格尔玫瑰图 2. 南丁格尔玫瑰图的绘制 1. 什么是南丁格尔玫瑰图央视新闻用来展示疫情0增长天数的图就是南丁格尔玫瑰图. 南丁格尔玫瑰图(Nightingale rose ...

关于Echarts南丁格尔玫瑰图的部分解释

关于Echarts南丁格尔玫瑰图的部分解释相关推荐

最新文章

热门文章