<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link href="css/mmain.css" rel="stylesheet" />
<script src="js/jquery-3.7.1.min.js"></script>
<script src="js/jquery.rotate.min.js"></script>
<script src="js/echart5.4/echarts.js"></script>
<script src="js/echart5.4/map/china.js"></script>
<script src="js/dfData.js"></script>
<script>
var H;
var itv;
var mapChart;
var mapindx = 0;//当前
var rotatedt = [{ id: "img0", sd: 0, rd: -200 }, { id: "img1", sd: 0, rd: 720 }, { id: "img2", sd: 0, rd: -360 }]//旋转参数
$(function () {
$(window).resize(function () { setsize(); });
setsize();
startitv();
});
function powerclick() {
var img3 = $("#img3").attr('src');
if (img3.indexOf('ecic0.png') > 0) {
$("#img3").attr('src', 'img/ecic1.png')
if (itv) { clearInterval(itv); }
} else {
$("#img3").attr('src', 'img/ecic0.png')
startitv();
}
}
function setsize() {
H = $(window).height();
$(".mainbk").css("height", H);
$("#map").css("height", parseInt(H * 20 / 30));
reloadchart();
}
function rotation() {
for (var i = 0; i < rotatedt.length; i++) {
var itm = rotatedt[i];
var tmp = itm.sd;
itm.sd = itm.rd;
itm.rd = tmp;
$("#" + itm.id).rotate({
angle: itm.sd,
animateTo: itm.rd,
duration: 2000
});
}
}
function startitv() {
if (itv) { clearInterval(itv); }
itv_do();
itv = setInterval(function () {
itv_do();
}, 2000);
}
function itv_do() {
rotation();//旋转
//地图轮播
if (mapChart) {
mapindx++
if (mapindx >= wince_ord_num.length) { mapindx = 0 }
mapChart.dispatchAction({ type: 'select', serieIndex: 0, dataIndex: mapindx });//选中
}
}
function reloadchart() {
loadmap('map');
}
function loadmap(did) {
mapChart = echarts.init(document.getElementById(did));
mapChart.setOption({
//title: {
// text: 'iphone销量',
// subtext: '纯属虚构',
// x: 'center'
//},
tooltip: {
trigger: 'item',
showDelay: 0, // 显示延迟，添加显示延迟可以避免频繁切换，单位ms
formatter: function (params) {
var res = params.name;
//res += '<br/>' + params.seriesName;
var data = 0;
if (params.value > 500 && params.value < 1000) { data = params.value - 500 + 24500; }
if (params.value > 1000 && params.value < 1500) { data = params.value - 1000 + 49500; }
if (params.value > 1500 && params.value < 2000) { data = params.value - 1500 + 74500; }
if (params.value > 2000 && params.value < 2500) { data = params.value - 2000 + 99500; }
if (params.value > 2500) { data = params.value - 2500 + 349500; }
res += '<br/> 订单数 : ' + data;
return res;
}
},
//legend: {
// orient: 'vertical',
// x: 'right',
//},
dataRange: {
show: false,
min: 0,
max: 2500,
x: 'left',
y: 'bottom',
text: ['高', '低'], // 文本，默认为数值文本
calculable: true
},
series: [
{
name: '订单数',
type: 'map',
map: 'china',
layoutCenter: ['50%', '50%'],
layoutSize: '120%',
selectedMode: 'single',//当选择一个时，上一个取消选择
roam: false,
label: {
show: true,
color: '#8cc',
},
itemStyle: {
areaColor: new echarts.graphic.RadialGradient(0.5, 0.5, 0.8, [{
offset: 0,
color: 'rgba(125, 255, 255, 0)' // 阴影颜色
}, {
offset: 1,
color: 'rgba(125, 255, 255, 0.2)' // 透明
}]),
borderColor: '#8ee',
borderWidth: 1,
shadowColor: '#88f',
shadowBlur: 20,
shadowOffsetX: 0,
shadowOffsetY: 0
},
emphasis: {
label: { color: '#8ff' },
itemStyle: {
areaColor: new echarts.graphic.RadialGradient(0.5, 0.5, 0.8, [{
offset: 0,
color: 'rgba(125, 255, 255, 0)' // 阴影颜色
}, {
offset: 1,
color: 'rgba(125, 255, 255, 0.4)' // 透明
}]),
borderColor: '#8ff',
borderWidth: 2,
}
},
select: {
label: { color: '#8ff' },
itemStyle: {
areaColor: new echarts.graphic.RadialGradient(0.5, 0.5, 0.8, [{
offset: 0,
color: 'rgba(125, 255, 125, 0)' // 阴影颜色
}, {
offset: 1,
color: 'rgba(125, 255, 125, 0.4)' // 透明
}]),
borderColor: '#8ff',
borderWidth: 2,
}
},
data: wince_ord_num,
markPoint: {
symbol: 'emptyCircle',
symbolSize: function (v) {
return 10 + v % 10
},
effect: {
show: true,
shadowBlur: 0
},
label: { show: false },
emphasis: {
label: { position: 'top' }
},
data: [
{ name: '云南', value: 95, coord: [101.412251, 24.440609] }
]
}
}
]
});
//var ecConfig = echarts.config;//事件命名统一挂载到require('echarts/config').E
EchartScreen.rar （18个子文件） 
EchartScreen js 
mrote.js 459B jquery-3.7.1.min.js 85KB dfData.js 4KB echart5.4 map china.js 61KB echarts.js 3.17MB wodanims.js 881B mmap.js 5KB jquery.rotate.min.js 7KB mcharts.js 15KB img 
0.png 22KB 1.png 17KB ecic0.png 3KB ecic1.png 4KB 2.png 49KB css mmain.css 152B Web.config 471B
index.html 5KB indextst.html 9KB资源评论
