echarts--例子
2024-10-07 23:12:42
echarts使用例子:
<script type="text/javascript">
option = {
title : {'x': 'center','y':'top','text': '时间关键指标趋势图'},
tooltip : {
trigger: 'axis'
},
legend: {
'x': '5%',
'y': 'top',
selectedMode:true, // 是否启用点击事件
data:['申请量(条)','成功数(条)','成功率(%)']
},
toolbox: {
show : true,
feature : {
mark : {show: false}, // 是否启用标记笔
dataView : {show: false, readOnly: false}, // 是否可以预览数据
magicType : {show: false, type: ['line', 'bar', 'stack', 'tiled']}, // 是否显示选择表格样式
restore : {show: false}, // 是否可以恢复
saveAsImage : {show: false} // 是否保存截图
}
},
calculable : true,
xAxis : [
{
type : 'category',
boundaryGap : false ,
data : [<{$days_str}>] // 底部x轴的数据 格式['a','b','c']
}
],
yAxis : [ // 设置左右Y轴数据
{'type' : 'value',
'splitNumber': '5', // 设置Y轴数据的格数
'name':'申请量(条)/成功数(条)', // 设置Y轴数据的标题
'axisLabel' : {formatter: '{value}'}
},
{'type' : 'value',
'splitNumber': '5',
'name':'成功率(%)',
'axisLabel' : {formatter: '{value}'
},
axisLabel: {
show: true,
interval: 'auto',
formatter: '{value} %' // 设置单位
}, }],
series : [ {
name:'成功率(%)',
type:'line',
yAxisIndex:1 , // 右边Y轴显示成功率等,默认是0
data:[<{foreach $success_str as $item}><{$item}>,<{/foreach}>] // smarty遍历,数据格式 [1,2,3]
},
{
name:'申请量(条)',
type:'line',
data:[<{foreach $loannum_str as $item}><{$item}>,<{/foreach}>]
},
{
name:'成功数(条)',
type:'line',
data:[<{foreach $success_count_str as $item}><{$item}>,<{/foreach}>]
}
]
}; // 为echarts对象加载数据
var cityChart = echarts.init(document.getElementById('main0'));
cityChart.setOption(option); </script>
最新文章
- Cats(3)- freeK-Free编程更轻松,Free programming with freeK
- WIN7-64位安装PLSQL-Developer步骤
- 百度文件上传webuploader上传文件,含文件大小、类型验证
- [LeetCode] Remove Duplicates from Sorted Array
- oracle logminer全解析
- 桶排序之python实现源码
- mysql中文名字按首字母排序
- MultiView空间例子
- 团队作业4——第一次项目冲刺(Alpha版本) 2
- left join on/right join on/inner join on/full join on连接
- disk.go
- fastJson解析报错:com.alibaba.fastjson.JSONException: can&#39;t create non-static inner class instance.
- nginx非root安装
- GitHub Desktop下载及使用
- .Net架构篇:实用中小型公司支付中心设计
- InfluxDB添加新服务
- 【树莓派+.NET MF打造视频监控智能车】控制篇(.NET MF)
- 关于mysql的wait_timeout参数 设置不生效的问题【转】
- ubuntu16.04下安装opencv3的viz模块
- A-B Problem nyoj