echarts 饼图demo
来源:互联网 发布:大富豪5.2源码 编辑:程序博客网 时间:2024/05/21 12:40
echarts 饼图demo
echarts写了一个饼图demo
1.引入echarts的js文件
<script src="static/common/script/echarts.common.min.js"></script>
2.声明echarts的dom对象
<!-- 为ECharts准备一个具备大小(宽高)的Dom --> <div id="pieDemo" style="width: 800px;height:800px;"></div>
3.js编码
<script type="text/javascript"> function createChart(loanType){ // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('pieDemo')); // 指定图表的配置项和数据 var titleTxt = ""; if(loanType=='Cash'){ titleTxt='现金贷款信息分析'; }else if(loanType=='Car'){ titleTxt='购车贷款信息分析'; } $.post('admin/queryChart/queryChartsDemo',{"loanType":loanType}, function(data) { if(data!=null){ var LevelOne = data.LevelOne; var LevelTwo = data.LevelTwo; var LevelThr = data.LevelThr; var option = { title : { text: titleTxt, subtext: '饼图分析DEMO', x:'center' }, tooltip : { trigger: 'item', formatter: "{a} <br/>{b} : {c} ({d}%)" }, legend: { orient: 'vertical', left: 'right', data: ['1万以下(含1万)','1万-10万(含10万)','10万-100万(含100万)'] }, series : [{ name: '数据分析', type: 'pie', radius : '55%', center: ['50%', '60%'], data:[ {value:LevelOne, name:'1万以下(含1万)'}, {value:LevelTwo, name:'1万-10万(含10万)'}, {value:LevelThr, name:'10万-100万(含100万)'}, ], itemStyle: { emphasis: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } }] }; myChart.setOption(option); } }); }</script>
阅读全文
0 0
- echarts 饼图demo
- ECharts demo
- echarts HelloWord Demo
- echarts图表demo
- ECharts简单Demo
- echarts柱状图实现demo
- Echarts教程--java使用demo
- 【Echarts】——上手Demo
- 关于echarts 图标的 demo
- Echarts动态加载数据demo
- echarts饼图实例demo
- echarts 动态获取数据demo
- 【Echarts】——上手Demo
- ECharts 饼图
- echarts 饼图
- echarts 百度开源图标工具demo
- ASP.Net MVC中 Echarts简单Demo
- echarts动态加载折线图数据demo
- @RequestParam与@PathVariable的区别
- 缓存回收策略 以及 回收算法
- 浏览器加载和渲染html的顺序
- Python 列表解析
- javascript event.target 和 event.currentTarget
- echarts 饼图demo
- centos6.8 内存数据库Couchbase集群部署详细操作
- 不仅限于智慧城市 低功耗广域网络也在改变农业生产方式
- 微服务介绍
- TabLayou选项无法点击的问题
- 定制你的WordPress
- jenkins搭建及基础配置
- 使用 slidedown做划下菜单时的一些问题!!
- logback.xml常用配置详解——<configuration> and <logger>