3.类迁徙图
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>公民系统——公民大数据</title>
<link type="text/css" rel="stylesheet" href="css/normalize.css"/>
<link type="text/css" rel="stylesheet" href="css/cssgai.css"/>
<link type="text/css" rel="stylesheet" href="css/bar.css"/>
<link type="text/css" rel="stylesheet" href="css/liMarquee.css"/>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/bar.js"></script>
<script src="js/easing.js"></script>
<script src="js/jquery.liMarquee.js"></script>
<script src="js/jiankong.js"></script>
<script src="js/initechart.js"></script>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0, minimum-scale=1, maximum-scale=1"/>
</head>
<body>
<div class="content">
<div class="top">
<div class="top-left">
<div class="top-left-content">
<div class="top-left-one2 setpp">
<p><span>数据采集</span></p>
<ul class="top-left-one2ul">
<li class="first-li">
<div class="list-one one-list">
<div class="list-img"><img src="img/hose.png" ></div>
<div class="company">提供单位</div>
<div class="nmber"><em id="dws1">17</em>家</div>
</div>
</li>
<li class="second-li">
<div class="list-one one-list">
<div class="list-img"><img src="img/pie.png"></div>
<div class="company">提供类别</div>
<div class="nmber"><em id="sjls">79</em>类</div>
</div>
</li>
<li class="three-li">
<div class="list-one one-list">
<div class="list-img"><img src="img/bar.png"></div>
<div class="company">数据条款</div>
<div class="nmber"><em id="sjts">2322</em>万条</div>
</div>
</li>
</ul>
</div>
<div class="top-list1 setpp">
<p>数据归集类型排名</p>
<div class="progeress2">
<ul >
<li><span><em class="set">1.</em></span>
<div class="join2" id="sjl0">参保信息<span class="canbao2"><em>123</em>万条</span></div>
<div class="bars"><span id="bar1">55</span></div>
</li>
<li><span class="card"><em class="set">2.</em></span>
<div class="join2" id="sjl1">身份证信息<span class="canbao2"><em class="card">123</em>万条</span></div>
<div class="bars"><span id="bar2">55</span></div>
</li>
<li><span class="hunyian"><em class="set">3.</em></span>
<div class="join2" id="sjl2">婚姻信息<span class="canbao2"><em class="hunyian">123</em>万条</span></div>
<div class="bars"><span id="bar3">55</span></div>
</li>
</ul>
<ul class="progressRight">
<li><span class="four"><em class="set">4.</em></span>
<div class="join2" id="sjl3">住房信息<span class="canbao2"><em >123</em>万条</span></div>
<div class="bars"><span id="bar4">55</span></div>
</li>
<li><span class="four"><em class="set">5.</em></span>
<div class="join2" id="sjl4">犯罪信息<span class="canbao2"><em>123</em>万条</span></div>
<div class="bars"><span id="bar5">55</span></div>
</li>
<li><span class="four"><em class="set">6.</em></span>
<div class="join2" id="sjl5">犯罪信息<span class="canbao2"><em>123</em>万条</span></div>
<div class="bars"><span id="bar6">55</span></div>
</li>
</ul>
</div>
</div>
<div class="top-list2 setpp">
<p>数据归集历程</p>
<div class="top-list2-content">
<Ul class="firstul firbox">
<li>归集条数</li>
<li>归集条款</li>
<li>归集条款</li>
</Ul>
<Ul class="firstul">
<li><em id="gjts1">1090</em>万条</li>
<li><em id="gjts2">1090</em>万条</li>
<li><em id="gjts3">1090</em>万条</li>
</Ul>
<div class="img-bg"><img src="img/timg-bg.png"></div>
<Ul class="timeul">
<li>2014</li>
<li>2015</li>
<li>2016</li>
</Ul>
</div>
</div>
</div>
</div>
<div class="top-middle">
<div class="top-middle-content">
<div class="text">
<button οnclick="fnJump();">查看人口云图</button>
<p>公民大数据</p>
</div>
<div class="main" id="main">
</div>
<div class="bot-text">
<p>数据交互图</p>
</div>
</div>
</div>
<div class="top-right">
<div class="top-right-content ">
<div class="top-right-right setp">
<span>实时协同数据</span>
<span class="setp-right"><img src="img/ringht_top1.png"/><span id="jrgxcs">27854</span></span>
<span class="setp-left"><img src="img/right_top.png"/><span id="jrfkts">27854</span></span>
<ul class="table-title">
<li>时间<span>|</span></li>
<li>使用单位<span>|</span></li>
<li>提供单位<span>|</span></li>
<li>数据类<span>|</span></li>
</ul>
</div>
<div class="dowebok">
<ol class="olscoll" id="breakNewsList">
<!--<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>
<li>
<a href="#">网易网易女网易女女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
<a href="#">网易女</a>
</li>-->
</ol>
</div>
</div>
</div>
</div>
<div class="bottom">
<div class="bottom-content1">
<div class="bottom-left">
<div class="bottom-left-content">
<div class="top-left-four setp">
<p><span>养老待遇人员生存状态核查</span></p>
<div class="bottom-content">
<div class="olderone">
<div class="inspect-left">
核查期数：
<span id="hcjs">5</span>
期
</div>
<div class="inspect-right">
涉及人数：
<span id="sjrs">2222</span>
人
</div>
</div>
<ul class="death2-ul">
<li >死亡、注销（公安）<span id="swga">3507<em>人</em></span></li>
<li >死亡医学证明（卫计）<span id="swwjw">3507<em>人</em></span></li>
<li class="firstli">殡葬火化（民政）<span id="swmz">3507<em>人</em></span></li>
<li class="countrest" >合计<span id="deathall">3507<em>人</em></span></li>
</ul>
</div>
</div>
</div>
</div>
<div class="bottom-right bottom-right-title">
<p><span>业务协同</span></p>
<div class="bottom-right-left-content">
<ul>
<li class="first-li">
<div class="bottom-img"><img src="img/hose.png"> </div>
<div class="bottom-company">涉及单位</div>
<div class="bottom-number sheiji" id="dws"><span>17</span>家</div>
</li>
<li class="bottom-li">
<div class="bottom-img"><img src="img/computer.png"> </div>
<div class="bottom-company">对接系统</div>
<div class="bottom-number system" id="xts"><span>17</span>个</div>
</li>
<li class="bottom-li2">
<div class="bottom-img"><img src="img/share.png"> </div>
<div class="bottom-company">数据共享</div>
<div class="bottom-number bottom-share" id="sjgx"><span>17</span>万次</div>
</li>
<li class="bottom-li3">
<div class="bottom-img"><img src="img/clause.png"> </div>
<div class="bottom-company">反馈条款</div>
<div class="bottom-number bottom-suggestion" id="fks"><span>17</span>万条</div>
</li>
</ul>
</div>
<div class="bottom-right-content">
<div id="badiv"></div>
</div>
</div>
</div>
</div>
</div>
<!--进度条-->
<script>
/*$('#bar1').barIndicator({
milestones:false,
backColor:false,
horBarHeight:10,
foreColor:'#ff5555',
animTime:1000
});
$('#bar2').barIndicator({
milestones:false,
backColor:false,
horBarHeight:10,
foreColor:'#edca16',
animTime:1000
});
$('#bar3').barIndicator({
milestones:false,
backColor:false,
horBarHeight:10,
foreColor:'#02c9b6',
animTime:1000
});
$('#bar4').barIndicator({
milestones:false,
backColor:false,
horBarHeight:10,
foreColor:'#27bdf0',
animTime:1000
});
$('#bar5').barIndicator({
milestones:false,
backColor:false,
horBarHeight:10,
foreColor:'#27bdf0',
animTime:1000
});
$('#bar6').barIndicator({
milestones:false,
backColor:false,
horBarHeight:10,
foreColor:'#27bdf0',
animTime:1000
});*/
</script>
<script>
$('.bi-label').remove()
</script>
</body>
<script>
(function (doc, win) {
// 分辨率Resolution适配
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function () {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
docEl.style.fontSize = 100 * (clientWidth / 1349) + 'px';
};
// Abort if browser does not support addEventListener
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);
})(document, window);
</script>
<script>
$(function(){
// $('.dowebok').liMarquee({
// direction: 'down',
// loop:1,
// runshort:true
//
// });
});
</script>
<script src="js/echarts.js"></script>
<script>
var myChart= echarts.init(document.getElementById('badiv'));
option = {
title : {
text: '单位（万条）',
textStyle: {
color: '#fff',
fontSize:10,
}
},
tooltip : {
trigger: 'axis'
},
grid:{
borderWidth:0,
x:50,
y:40,
x2:20,
y2:40
},
calculable : true,
xAxis : [
{
type : 'category',
axisTick:false,
splitArea:false,
axisLabel:{
textStyle: {
color: '#4e758d',
}
},
splitLine:false,
data : ['身份证信息','社保信息','婚姻状况',
{
value:'医疗信息',
textStyle: {
color: '#abc0ce',
}
}
,'住房信息','犯罪信息',
'年龄信息','死亡信息']
}
],
yAxis : [
{
type : 'value',
axisLine:false,
splitArea:false,
splitLine:false,
axisLabel:{
textStyle: {
color: '#4e758d',
}
},
splitLine:{
lineStyle:{
color: '#1f5575',
width: 4,
type: 'solid'
},
},
}
],
series : [
{
itemStyle: {
normal: {
color:'#27bdf0',
},
},
type:'bar',
data:[2.0, 4.9, 7.0,
{
value:9,
itemStyle: {
normal: {
color:'#ccec5a',
},
},
}
,
25.6, 76.7, 135.6,2.6],
}
]
};
myChart.setOption(option)
window.onresize = myChart.resize
//中间的公民系统echarts数据
/* <!-- JavaScript 生成的标签 让内容变得不易查找、编辑，并且降低性能，尽量避免 --!>*/
// center:104.12556,30.763712
// 102.848672,29.968017
//上排单位距离中心的距离参数
var a = 1;
//下排单位距离中心的距离参数
var b =-1;
var screenwidth = window.screen.width;
if(screenwidth==1366){
var points = {"公民系统":[103.12556,30.363712,33],
"市人民政府应急办":[92.62556,32.763712+a,33],
"市委组织部":[95.62556,32.763712+a,33],
"市法院":[98.62556,32.763712+a,33],
"市检察院":[101.62556,32.763712+a,33],
"市公安局":[104.62556,32.763712+a,33],
"市民政局":[107.62556,32.763712+a,33],
"市司法局":[110.62556,32.763712+a,33],
"市人社局":[113.62556,32.763712+a,33],
"市房管局":[92.62556,27.563712+b,33],
"市农委":[95.62556,27.563712+b,33],
"市卫计委":[98.62556,27.563712+b,33],
"成都公积金中心":[101.62556,27.563712+b,33],
"市政府政务中心":[104.62556,27.563712+b,33],
"市国安局":[107.62556,27.563712+b,33],
"成都12345APP":[110.62556,27.563712+b,33],
"市民融合平台":[113.62556,27.563712+b,33]};
}else{
var points = {"公民系统":[103.12556,30.363712,33],
"市人民政府应急办":[95.12556,32.763712+a,33],
"市委组织部":[98.12556,32.763712+a,33],
"市法院":[100.12556,32.763712+a,33],
"市检察院":[102.12556,32.763712+a,33],
"市公安局":[104.12556,32.763712+a,33],
"市民政局":[106.12556,32.763712+a,33],
"市司法局":[108.12556,32.763712+a,33],
"市人社局":[110.12556,32.763712+a,33],
"市房管局":[94.62556,27.563712+b,33],
"市农委":[96.62556,27.563712+b,33],
"市卫计委":[98.62556,27.563712+b,33],
"成都公积金中心":[100.62556,27.563712+b,33],
"市政府政务中心":[103.32556,27.563712+b,33],
"市国安局":[105.62556,27.563712+b,33],
"成都12345APP":[107.75056,27.563712+b,33],
"市民融合平台":[110.52556,27.563712+b,33]};
}
// label为top
var label_top = ["市人民政府应急办","市委组织部","市法院","市检察院","市公安局","市民政局","市司法局","市人社局"];
//label 为 bottom
var label_bottom =["市房管局","市农委","市卫计委","成都公积金中心","市政府政务中心","市国安局","成都12345APP","市民融合平台"];
// 线条弯强度系数
var n=0.6;
// 流入数据流
// var lines0 = [
// [{name:'市人民政府应急办'},{name:'公民系统',value:22,curveness:-0.3*n}],
// [{name:'市委组织部'},{name:'公民系统',value:22,curveness:0.1*n}],
// [{name:'市法院'},{name:'公民系统',value:22,curveness:-0.2*n}],
// [{name:'市检察院'},{name:'公民系统',value:22,curveness:0.2*n}],
// [{name:'市公安局'},{name:'公民系统',value:22,curveness:-0.2*n}],
// [{name:'市民政局'},{name:'公民系统',value:22,curveness:0.2*n}],
// [{name:'市司法局'},{name:'公民系统',value:22,curveness:-0.1*n}],
// [{name:'市人社局'},{name:'公民系统',value:22,curveness:0.3*n}],
//
// [{name:'市房管局'},{name:'公民系统',value:22,curveness:0.4*n}],
// [{name:'市农委'},{name:'公民系统',value:22,curveness:0.3*n}],
// [{name:'市卫计委'},{name:'公民系统',value:22,curveness:0.2*n}],
// [{name:'成都公积金中心'},{name:'公民系统',value:22,curveness:0.1*n}],
// [{name:'市政府政务中心'},{name:'公民系统',value:22,curveness:0*n}],
// [{name:'市国安局'},{name:'公民系统',value:22,curveness:-0.2*n}],
// [{name:'成都12345APP'},{name:'公民系统',value:22,curveness:-0.1*n}],
// [{name:'市民融合平台'},{name:'公民系统',value:22,curveness:-0.3*n}]
//
// ];
// 流出数据流
var linesdata=[];
var xietongdata=[];
var lindesobj={
'市人民政府应急办':[{name:'公民系统'},{name:'市人民政府应急办',value:0,curveness:0.3*n}],
'市委组织部':[{name:'公民系统'},{name:'市委组织部',value:0,curveness:-0.1*n}],
'市法院':[{name:'公民系统'},{name:'市法院',value:2,curveness:0.2*n}],
'市检察院':[{name:'公民系统'},{name:'市检察院',value:2,curveness:-0.2*n}],
'市公安局':[{name:'公民系统'},{name:'市公安局',value:2,curveness:0.2*n}],
'市民政局':[{name:'公民系统'},{name:'市民政局',value:2,curveness:-0.2*n}],
'市司法局':[{name:'公民系统'},{name:'市司法局',value:2,curveness:0.1*n}],
'市人社局':[{name:'公民系统'},{name:'市人社局',value:2,curveness:-0.3*n}],
'市房管局':[{name:'公民系统'},{name:'市房管局',value:2,curveness:-0.4*n}],
'市农委':[{name:'公民系统'},{name:'市农委',value:2,curveness:-0.3*n}],
'市卫计委':[{name:'公民系统'},{name:'市卫计委',value:2,curveness:-0.2*n}],
'成都公积金中心':[{name:'公民系统'},{name:'成都公积金中心',value:2,curveness:-0.1*n}],
'市政府政务中心':[{name:'公民系统'},{name:'市政府政务中心',value:2,curveness:0*n}],
'市国安局':[{name:'公民系统'},{name:'市国安局',value:2,curveness:0.2*n}],
'成都12345APP':[{name:'公民系统'},{name:'成都12345APP',value:2,curveness:0.1*n}],
'市民融合平台':[{name:'公民系统'},{name:'市民融合平台',value:2,curveness:0.4*n}]
};
var lines1 = [
[{name:'公民系统'},{name:'市人民政府应急办',value:0,curveness:0.3*n}],
[{name:'公民系统'},{name:'市委组织部',value:0,curveness:0.2*n}],
[{name:'公民系统'},{name:'市法院',value:2,curveness:0.2*n}],
[{name:'公民系统'},{name:'市检察院',value:2,curveness:0.2*n}],
[{name:'公民系统'},{name:'市公安局',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'市民政局',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'市司法局',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'市人社局',value:2,curveness:-0.3*n}],
[{name:'公民系统'},{name:'市房管局',value:2,curveness:-0.4*n}],
[{name:'公民系统'},{name:'市农委',value:2,curveness:-0.3*n}],
[{name:'公民系统'},{name:'市卫计委',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'成都公积金中心',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'市政府政务中心',value:2,curveness:0*n}],
[{name:'公民系统'},{name:'市国安局',value:2,curveness:0.2*n}],
[{name:'公民系统'},{name:'成都12345APP',value:2,curveness:0.3*n}],
[{name:'公民系统'},{name:'市民融合平台',value:2,curveness:0.4*n}]
];
var lines2 = [
[{name:'公民系统'},{name:'市人民政府应急办',value:0,curveness:0.3*n}],
[{name:'公民系统'},{name:'市委组织部',value:0,curveness:-0.1*n}],
[{name:'公民系统'},{name:'市法院',value:2,curveness:0.2*n}],
[{name:'公民系统'},{name:'市检察院',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'市公安局',value:2,curveness:0.2*n}],
[{name:'公民系统'},{name:'市民政局',value:2,curveness:-0.2*n}],
[{name:'公民系统'},{name:'市司法局',value:2,curveness:0.1*n}],
[{name:'公民系统'},{name:'市人社局',value:2,curveness:-0.3*n}]
];
// 生成lines的data数据
var convertData = function(data){
var res = [];
for (var i=0; i<data.length; i++){
var dataItem = data[i];
var fromPoint = points[dataItem[0].name];
var toPoint = points[dataItem[1].name];
var curveness = dataItem[1].curveness;
if(fromPoint && toPoint){
res.push({
fromName: dataItem[0].name,
toName: dataItem[1].name,
coords: [fromPoint,toPoint],
lineStyle: {
normal: {
curveness: curveness
},
emphasis: {
curveness: curveness
}
}
});
}
}
//console.log(res);
return res;
};
// 判断数据中是否包含某函数
function hasElement(arr,ele){
if(arr){
for(var i=0;i<arr.length; i++){
if(arr[i]===ele){
return true;
}
}
}
return false;
}
// svg可以自定义生成
var planePath = 'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z';
// // 流入
// var lines_in = {
// name:'流入',
// type: 'lines',
// zlevel:2,
// lineStyle: {
// normal: {
// color: '#edca16',
// width: 1,
// opacity: 0.4,
// curveness: -0.2,
// shadowColor: 'rgba(225, 201, 60, 0.4)',
// shadowBlur: 5
// }
// },
// data:convertData(lines0)
// };
// 流出
var lines_out = {
name:'流出',
type: 'lines',
zlevel:2,
effect:{
show:false,
period:6,
trailLength:0.1,
color:'#edca16',
// symbol: 'roundReact',
// symbol: planePath,
symbolSize: 8
},
lineStyle: {
normal: {
color: '#edca16',
width: 1,
opacity: 0.4,
curveness: -0.2,
shadowColor: 'rgba(225, 201, 60, 0.4)',
shadowBlur: 5
}
},
data:convertData(lines1)
};
// 散列点
var effectScatter ={
name: '公民系统',
type: 'effectScatter',
coordinateSystem: 'geo',
zlevel: 2,
rippleEffect: {
brushType: 'fill',
period:0
},
label: {
normal: {
show: true,
position: 'right',
formatter: '{b}'
}
},
symbolSize: 10,
itemStyle: {
normal: {
color: '#a6c84c'
}
},
data: (function(){
var datas =[];
for(var name in points){
var val = points[name],option;
val.push(20);
if(name==='公民系统'){
option = {
name:name,
value: val,
symbolSize: 80,
label:{
normal: {
show:true,
position: 'inside',
formatter: function(s){
var name = s.data.name;
if(!name){
return "";
}else{
return name.replace(/公民/,'公民\n');
}
},
textStyle: {
color: '#6e361a',
fontStyle: 'normal',//TODO字体没确定
fontWeight: '700',
fontSize: 20
}
}
},
itemStyle: {
normal: {
color: '#edca16',
borderColor: '#faf9f6',
borderWidth: 1,
borderType: 'solid',
shadowColor: 'rgba(237,202,22,0.2)',
shadowBlur: 40
},
emphasis: {
color: '#edca16',
borderColor: '#faf9f6',
borderWidth: 1,
borderType: 'solid',
shadowColor: 'rgba(237,202,22,0.2)',
shadowBlur: 40
}
}
};
}else{
option = {
name:name,
value: val,
symbolSize: 20,
itemStyle: {
normal: {
color: '#27bdf0',
borderColor: '#faf9f6',
borderWidth: 1,
borderType: 'solid',
shadowColor: 'rgba(39,189,240,0.2)',
shadowBlur: 20
},
emphasis: {
color: '#27bdf0',
borderColor: '#faf9f6',
borderWidth: 1,
borderType: 'solid',
shadowColor: 'rgba(39,189,240,0.2)',
shadowBlur: 20,
}
},
label: {
normal: {
show: true,
position: (function(){
if(hasElement(label_top,name)){
// return 'top';
// return ['0%',-30];
if(name.length>4){
return [-30,-30];
}else if(name.length>3){
return [-15,-30];
}else{
return [-10,-30];
}
}else{
// return 'bottom';
// return ['center','150%'];
if(name.length>4){
return [-30,30]
}else if(name.length>3){
return [-15,30];
}else{
return [-10,30]
}
}
})(),
textStyle: {
color: '#27bdf0',
fontSize:18,
fontStyle:'宋体'
}
}
}
};
}
datas.push(option);
}
return datas;
})()
};
refreshMap();
var chart = echarts.init(document.getElementById("main"));
function refreshMap(){
var series = [lines_out,effectScatter];
//console.log(series);
$.get('data/sichuan.json',function(geo){
echarts.registerMap('sichuan',geo);
chart.setOption({
geo: {
map: 'sichuan',
scaleLimit:{
min:1,
max:1
},
label: {
emphasis: {
show: false
}
},
// roam: true,
itemStyle: {
normal: {
areaColor: '#323c48',
borderColor: '#404a59',
opacity: 0
},
emphasis: {
areaColor: '#2a333d',
opacity: 0
}
}
},
series: series
});
});
}
setInterval("showtimer()",7000);
function showtimer(){
if(linesdata.length>0){
lines1=linesdata;
console.info(lines1);
lines_out.effect.show=true;
lines_out.data=convertData(lines1);
//chart.resize();
refreshMap();
linesdata=[];
refreshtbData(xietongdata);
console.info(xietongdata);
xietongdata=[];
}else{
lines_out.effect.show=false;
refreshMap();
}
}
function refreshtbData(datas) {
var fkts=1;
for(i=0;i<datas.length;i++){
var eventdata=datas[i];
fkts=fkts+parseInt(eventdata.abg022);
var str = "";
str += "<li>"
str += "<a href='#'>" + eventdata.sj.substring(0,10) + "</a>";
var sjdw = eventdata.abg026_cn;
if (sjdw.length <= 4) {
str += "<a href='#'>" + sjdw + "</a>";
} else {
sjdw2 = sjdw.substr(0, 4) + "...";
str += "<a href='#' title=" + sjdw + ">" + sjdw2 + "</a>";
}
var tgdw = eventdata.bgm012_cn;
if (tgdw.length <= 4) {
str += "<a href='#'>" + tgdw + "</a>";
} else {
tgdw2 = tgdw.substr(0, 4) + "...";
str += "<a href='#' title=" + tgdw + ">" + tgdw2 + "</a>";
}
var sjl = eventdata.bgm009;
if (sjl.length <= 4) {
str += "<a href='#'>" + sjl + "</a>";
} else {
sjl2 = sjl.substr(0, 4) + "...";
str += "<a href='#' title=" + sjl + ">" + sjl2 + "</a>";
}
$("#breakNewsList").append(str);
}
$("#jrgxcs").html(parseInt($("#jrgxcs").html())+1);
$("#jrfkts").html(parseInt($("#jrfkts").html())+fkts)
}
function fnJump(){
var url="http://"+window.location.host+"/xz/xz/perdata/yuntu.html";
window.open(url);
}
</script>
</html>
2267
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
