<div carousel-item id="LAY-index-pagethree">
<div>
<i class="layui-icon layui-icon-loading1 layadmin-loading"></i>
</div>
</div>
<div carousel-item id="LAY-index-pagetwo">
<div>
<i class="layui-icon layui-icon-loading1 layadmin-loading"></i>
</div>
</div>
<!-- 图表 -->
https://www.bootcdn.cn/echarts/
<script type="text/javascript" src="__TMPL__/public/assets/js/echarts.js"></script>
<!-- 主题 -->
下载地址:http://echarts.baidu.com/download-theme.html
<script type="text/javascript" src="__TMPL__/public/assets/js/macarons.js"></script>
<!-- 地图文件 -->
https://github.com/Luna829/incubator-echarts/blob/master/map/js/china.js
<script type="text/javascript" src="__TMPL__/public/assets/js/china.js"></script>
<!-- 地图 -->
<script type="text/javascript">
var echartsApp = [],
options = [{
title: {
text: '粉丝分布',
subtext: '不完全统计'
},
tooltip: {
trigger: 'item'
},
dataRange: {
orient: 'horizontal',
min: 0,
max: 60000,
text: ['高', '低'],
splitNumber: 0
},
series: [{
name: '粉丝分布',
type: 'map',
mapType: 'china',
selectedMode: 'multiple',
itemStyle: {
normal: { label: { show: true } },
emphasis: { label: { show: true } }
},
data: [
{ name: '西藏', value: 60 },
{ name: '青海', value: 167 },
{ name: '宁夏', value: 210 },
{ name: '海南', value: 252 },
{ name: '甘肃', value: 502 },
{ name: '贵州', value: 570 },
{ name: '新疆', value: 661 },
{ name: '云南', value: 8890 },
{ name: '重庆', value: 10010 },
{ name: '吉林', value: 5056 },
{ name: '山西', value: 2123 },
{ name: '天津', value: 9130 },
{ name: '江西', value: 10170 },
{ name: '广西', value: 6172 },
{ name: '陕西', value: 9251 },
{ name: '黑龙江', value: 5125 },
{ name: '内蒙古', value: 1435 },
{ name: '安徽', value: 9530 },
{ name: '北京', value: 51919 },
{ name: '福建', value: 3756 },
{ name: '上海', value: 59190 },
{ name: '湖北', value: 37109 },
{ name: '湖南', value: 8966 },
{ name: '四川', value: 31020 },
{ name: '辽宁', value: 7222 },
{ name: '河北', value: 3451 },
{ name: '河南', value: 9693 },
{ name: '浙江', value: 62310 },
{ name: '山东', value: 39231 },
{ name: '江苏', value: 35911 },
{ name: '广东', value: 55891 }
]
}]
}],
elemDataView = $('#LAY-index-pagethree').children('div'),
renderDataView = function (index) {
echartsApp[index] = echarts.init(elemDataView[index], 'macarons');
echartsApp[index].setOption(options[index]);
window.onresize = echartsApp[index].resize;
};
//没找到DOM,终止执行
// if (!elemDataView[0]) return 0;
renderDataView(0);
</script>
<!-- 访问量 -->
<script type="text/javascript">
var echartsApp = [],
options = [{
tooltip: {
trigger: 'axis'
},
calculable: true,
legend: {
data: ['访问量', '下载量', '平均访问量']
},
xAxis: [{
type: 'category',
data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
}],
yAxis: [{
type: 'value',
name: '访问量',
axisLabel: {
formatter: '{value} 万'
}
},
{
type: 'value',
name: '下载量',
axisLabel: {
formatter: '{value} 万'
}
}
],
series: [{
name: '访问量',
type: 'line',
data: [900, 850, 950, 1000, 1100, 1050, 1000, 1150, 1250, 1370, 1250, 1100]
},
{
name: '下载量',
type: 'line',
yAxisIndex: 1,
data: [850, 850, 800, 950, 1000, 950, 950, 1150, 1100, 1240, 1000, 950]
},
{
name: '平均访问量',
type: 'line',
data: [870, 850, 850, 950, 1050, 1000, 980, 1150, 1000, 1300, 1150, 1000]
}
]
}],
elemDataView = $('#LAY-index-pagetwo').children('div'),
renderDataView = function (index) {
echartsApp[index] = echarts.init(elemDataView[index], 'macarons');
echartsApp[index].setOption(options[index]);
window.onresize = echartsApp[index].resize;
};
//没找到DOM,终止执行
// if (!elemDataView[0]) return;
renderDataView(0);
</script>
echarts图表使用
猜你喜欢
转载自blog.csdn.net/weixin_43993175/article/details/104393047
今日推荐
周排行