餐E评echarts
所需要的数据结构
option = {
num:1212,//商圈数
numRate:34%,//商圈增长率
activation:1231,//活跃度
activationRate:23%,//活跃度增长
legend:['全市平均','酒仙桥'],
series : [{
data:[120, 118, 130]
},
{
data:[120, 118, 130]
},
]
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://cdn.bootcss.com/echarts/3.7.1/echarts.js"></script>
</head>
<body>
<div id="app" style="height: 400px;">
</div>
<script>
var ec = echarts.init(document.querySelector('#app'));
var option = {
title: {
text: '自定义雷达图'
},
legend: {
data: ['全市平均','酒仙桥'],
right: '5%'
},
radar: [
{
indicator: [
{ text: '环境', max: 150 }, { text: '口味', max: 150 }, { text: '服务', max: 150 }
],
center: ['75%', '50%'],
radius: 120
}
],
series: [
{
name: '成绩单',
type: 'radar',
data: [
{
value: [120, 118, 130],
name: '全市平均',
itemStyle : {
normal:{
color:'#9BDADC'
}
},
label: {
normal: {
show: true,
formatter:function(params) {
return params.value;
}
}
},
areaStyle: {
normal: {
opacity: 0.9,
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1, [
{
color: '#9BDADC',
offset: 0
},
{
color: '#9BDADC',
offset: 1
}
])
}
}
},
{
value: [90, 90, 100],
name: '酒仙桥',
itemStyle : {
normal:{
color:'#B3D3E2'
}
},
areaStyle: {
normal: {
opacity: 0.9,
color: new echarts.graphic.RadialGradient(0.5, 0.5, 1, [
{
color: '#B3D3E2',
offset: 0
},
{
color: '#B3D3E2',
offset: 1
}
])
}
}
}
]
}
]
}
ec.setOption(option);
</script>
</body>
</html>
餐E评echarts的更多相关文章
- [struts2]struts结合ECharts的用法
<script src="http://echarts.baidu.com/build/dist/echarts-all.js"></script> < ...
- echarts教程-asp.net+ashx实现堆积柱状
说说看.崔西莲夫人紧接着说. 想不到史春吉是这种人. 你会这样说倒是有趣,因为这正是我当时的感觉.这跟奈维尔的个性不合.奈维尔,就像大部分男人一样,通常都是尽量避开任何可能造成尴尬或不愉快的场面.我怀 ...
- echarts pie饼状图绑定点击事件
var valueData = [ {value: 33,name: '诊所'}, {value: 29,name: '汽车服务相关'}, {value: 27, name: '洗衣店'}, {val ...
- 一起来玩echarts系列（一）------箱线图的分析与绘制
一.箱线图 Box-plot 箱线图一般被用作显示数据分散情况.具体是计算一组数据的中位数.25%分位数.75%分位数.上边界.下边界,来将数据从大到小排列,直观展示数据整体的分布情况. 大部分正常数 ...
- Webstorm+Webpack+echarts构建个性化定制的数据可视化图表&&两个echarts详细教程（柱状图，南丁格尔图）
Webstorm+Webpack+echarts ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(I ...
- ASP.NET MVC5+EF6+EasyUI 后台管理系统（67）-MVC与ECharts
系列目录 ECharts 特性介绍 ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Fire ...
- echarts+php+mysql 绘图实例
最近在学习php+mysql,因为之前画图表都是直接在echart的实例demo中修改数据,便想着两相结合练习一下,通过ajax调用后台数据画图表. 我使用的是echart3,相比较第二版,echar ...
- 数据图表插件Echarts（一）
一.引言 最近做一个智慧城市项目,项目中需要图表和报表进行数据分析,从网上找了很多,最后找到了百度开放的echarts,一个很强大的插件. 二.介绍 ECharts,缩写来自Enterprise Ch ...
- ECharts数据图表系统？ 5分钟上手！
目录: 前言 简介 方法一:模块化单文件引入(推荐) 方法二:标签式单文件引入 [前言] 最近在捣鼓各种插件各种框架,发现这个ECharts还是比较不错的,文档也挺全的,还是中文的,给大家推荐一下. ...
随机推荐
- JVM结构及堆的划分
一.JVM结构 1.类加载子系统与方法区 类加载子系统负责从文件系统或者网络中加载Class信息,加载的类信息存放于一块称为方法区的内存空间.除了类的信息外,方法区中可能还会存放运行时常量池信息,包括 ...
- SolrCloud集群配置
前提: 1,已经做好zookeeper集群或伪集群配置. 2,已将solr部署到tomcat中 接下来,我们将zookeeper与tomcat进行关联 vim tomcat/bin/catalina. ...
- win7改装 CentOS7，装完后开机，没有引导
本来系统是win7,安装centos是用U盘启动安装方式安装成功后,发现win7的系统引导不见了.之前用的是centos6.4安装后依然保留win7引导的,到centos7就不行了 解决方法1.使用r ...
- Angular4.x 中的服务
Angular4.x 中的服务 写下前面 学习angular4.x中的服务需要借助 ToDoList 项目来做,项目代码在上篇博客中讲到. https://www.cnblogs.com/wjw101 ...
- 20145311 王亦徐《网络对抗技术》 逆向及BOF进阶实践
20145311<网络对抗技术>逆向及BOF进阶实践 学习目的 shellcode注入:shellcode实际是一段代码,但却作为数据发送给受攻击服务器,将代码存储到对方的堆栈中,并将堆栈 ...
- 【MonkeyRunner环境搭建】
一.配置MonkeyRunner环境变量 1.首先下载一个AndroidSDK,在SDK的目录中的tools文件夹中,直接带有MonkeyRunner 2.打开MonkeyRunner的方式: |-- ...
- python --- 21 MRO C3算法
一.python2.2之前用的是 经典类的MRO继承 ①深度递归继承 从左到右 ,一条路走到黑 ②广度继承 一层一层的继承 深度继承时 为 R 1 2 3 4 ...
- bzoj2086: [Poi2010]Blocks DP，单调栈
题目链接 https://www.lydsy.com/JudgeOnline/problem.php?id=2086 思路 这就有点妙了 题目意思就是让你求平均数>=k的最长序列 先求出a[i] ...
- 解决Visual Studio（2017）软件无法重新生成问题
https://blog.csdn.net/qq_38265674/article/details/80539228 笔者用VS2017打开VS2015创建的工程,出现如下图的问题. 不小心没有升级平 ...
- 【做题】arc068_e-Snuke Line——利用特殊性质分讨
显然,对于所有跨度暴力扫一遍的复杂度本身只有\(O(n \log n)\). 容易想到在每一个到达的位置加上覆盖这个位置的区间数.剩下的问题就在于如何处理覆盖了多个位置的区间. 记录已访问或去重都是难 ...