餐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还是比较不错的,文档也挺全的,还是中文的,给大家推荐一下. ...
随机推荐
- JavaWeb创建的文件夹默认在tomcat/bin中
系统项目中需要设置缓存目录,原本项目中的目录设置为D:/cache目录,这怎么成?于是手动改成了cache目录,原本想使用了相对路径,web项目能够把缓存路径设置到tomcat的webapp的具体项目 ...
- No symbol "xxx" in current context解决
当gdb的版本低于相应的gcc版本的时候,就会出现debug的时候出现No symbol "*" in current context或者The address where a.o ...
- MySql数据库概念
一.什么是数据库? 数据库(Database)是按照数据结构来组织.存储和管理数据的建立在计算机存储设备上的仓库. 简单来说是本身可视为电子化的文件柜——存储电子文件的处所,用户可以对文件中的数据进行 ...
- Linear Regression with PyTorch
Linear Regression with PyTorch Problem Description 初始化一组数据 \((x,y)\),使其满足这样的线性关系 \(y = w x + b\) .然后 ...
- 18位身份证验证(Java)加入身份证输入验证是否满足18位代码(修订稿)
package day20181016; /** * 身份证的验证 34052419800101001X * */ import java.util.Scanner; public class Zuo ...
- 05: 使用axios/vue-resource发送HTTP请求
1.1 axios 简介与安装 1.axios简介 1. vue本身不支持发送AJAX请求,需要使用vue-resource.axios等插件实现 2. axios是一个基于Promise的HTTP请 ...
- thinkphp5 tp5 与 nginx 搭配在根目录和子目录中如何设置伪静态
配置文件参考一下: location /public/ { if (!-e $request_filename){ rewrite ^/public/(.*)$ /public/index.php?s ...
- (12网络化部署深化下)自己动手,编写神经网络程序,解决Mnist问题,并网络化部署
网络化部署一直是我非常想做的,现在已经基本看到了门路.今天早上实验,发现在手机上的支持也非常好(对于相机的支持还差一点),证明B/S结构的框架是非常有生命力的.下一步就是要将这个过程深化.总结,并且封 ...
- Codeforces Round #423 (Div. 2, rated, based on VK Cup Finals) Problem D (Codeforces 828D) - 贪心
Arkady needs your help again! This time he decided to build his own high-speed Internet exchange poi ...
- 上传svn失败,代码冲突解决方式
1,修改文件后提交不了,大多是因为版本不一致造成的.更新一下,不产生冲突的情况,就可以提交了. 2,更新文件,如果出现冲突的情况,打开冲突文件test.php会看到类似以下的内容 <<&l ...