// 点击切换三维地图
$("#3DMapSwitch").click(function() {
toPage('/new/zkdp/tozkdp3DMap.do');
});
这个是2d地图和3D地图的切换按钮 就是进入另一个页面
完整3D代码如下
简要说一下 也是初始化一个容器 然后就可以了 具体的打点什么的 和2D类似 可以看我上篇博客
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ include file="/WEB-INF/jsp/include/jsp_include.jsp"%>
<!DOCTYPE html>
<html lang="zh-cn" style="background: #004E7B;">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<title>一图感知</title>
<link rel="stylesheet" type="text/css" href="/js/zk/Cesium3DMap/Widgets/widgets.css"/>
<link rel="stylesheet" type="text/css" href="/css/style7/normalize.css"/>
<link rel="stylesheet" type="text/css" href="/css/style7/style.css"/>
<link rel="stylesheet" type="text/css" href="/css/style7/popUpBox.css"/>
<script type="text/javascript" src="/js/zk/style7/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="/js/zk/style7/jquery.nicescroll.min.js"></script>
<script type="text/javascript" src="/js/zk/style7/divselect.js"></script>
<script type="text/javascript">
//控制弹出框的大小
function changeFrameHeight2(that){
$(that).height(document.documentElement.clientHeight-290);
}
</script>
<style>
input[type="date"]::-webkit-calendar-picker-indicator {
background:url('/images/style8/date.png') center center no-repeat;
}
/*三维地图弹出层样式开始*/
.leaflet-popup {
position: absolute;
/*text-align: center;*/
color: black;
width: 300px;
}
.leaflet-popup-close-button {
position: absolute;
top: 0;
right: 0;
padding: 4px 4px 0 0;
text-align: center;
width: 18px;
height: 18px;
/*font: 16px/14px Tahoma, Verdana, sans-serif;*/
text-decoration: none;
color: black;
/*font-weight: bold;*/
/*background: transparent;*/
cursor: pointer;
}
.leaflet-popup-content-wrapper {
text-align: center;
max-height: 200px;
overflow-y: auto;
background: white;
box-shadow: 0 3px 14px rgba(0,0,0,0.4);
padding: 1px;
text-align: left;
border-radius: 10px;
}
.leaflet-popup-content {
margin: 0px 15px;
line-height: 1.4;
}
.leaflet-popup-tip-container {
/*修改弹窗位置*/
margin: 0 auto;
width: 300px;
/*height: 50px;*/
position: relative;
overflow: hidden;
}
.leaflet-popup-tip {
background: white;
box-shadow: 0 3px 14px rgba(0,0,0,0.4);
width: 17px;
height: 17px;
padding: 1px;
margin: -10px auto 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
/*三维地图弹出层样式结束*/
</style>
</head>
<body>
<div class="ba_wrapper page1_wrapper01">
<!-- 三维地图容器和样式 -->
<div class="map_wrap" id="cesiumContainer" style="position: absolute;width: 100%;height: 100%;margin: 0;padding: 0;overflow: hidden;">
</div>
<!--标题-->
<div class="h_tit">互联网+政务服务</div>
<!--顶部链接-->
<div class="top_link">
<a href="javascript:;" class="active">一图感知</a>
<a href="javascript:toPage('/new/zkdp/tozwtx.do');">政务体系</a>
<a href="javascript:toPage('/new/zkdp/newZwdyt.do');">实时监测</a>
</div>
<!--选择区划-->
<div class="qh_select" id="qhSelect">
<div class="corner_box">
<!--装饰-->
<span class="zs zs_01"></span>
<span class="zs zs_02"></span>
<span class="zs zs_03"></span>
<span class="zs zs_04"></span>
<!--内容区域-->
<div id="customAreaName" class="qh_cont" style="cursor: default;">宝安区</div>
</div>
<div class="qh_subCont" style="display: block;">
<div class="qh_tit">
<a class="qh_cont" href="javascript:getSingleAreaData('440306', '宝安区','113.878526','22.347567');">宝安区</a>
<!-- <img id="2DMapSwitch" src="/images/style8/3DSwitch.png" width="32px" height="32px" alt="切换" style="cursor:pointer;"/> -->
</div>
<div class="qh_txt">
<!-- <a href="javascript:getSingleAreaData('440306001', '新安街道','113.902413','22.574601');">新安街道</a> -->
<a href="javascript:getSingleAreaData('440306001', '新安街道','113.873954','22.45959118');">新安街道</a>
<!-- <a href="javascript:getSingleAreaData('440306003', '西乡街道','113.890041','22.586689');">西乡街道</a> -->
<a href="javascript:getSingleAreaData('440306003', '西乡街道','113.861582','22.47167918');">西乡街道</a>
<!-- <a href="javascript:getSingleAreaData('440306009', '航城街道','113.850099','22.635659');">航城街道</a> -->
<a href="javascript:getSingleAreaData('440306009', '航城街道','113.82164','22.52064918');">航城街道</a>
<!-- <a href="javascript:getSingleAreaData('440306004', '福永街道','113.829299','22.67708');">福永街道</a> -->
<a href="javascript:getSingleAreaData('440306004', '福永街道','113.80084','22.56207018');">福永街道</a>
<!-- <a href="javascript:getSingleAreaData('440306010', '福海街道','113.80566','22.678651');">福海街道</a> -->
<a href="javascript:getSingleAreaData('440306010', '福海街道','113.777201','22.56364118');">福海街道</a>
<!-- <a href="javascript:getSingleAreaData('440306005', '沙井街道','113.818248','22.739132');">沙井街道</a> -->
<a href="javascript:getSingleAreaData('440306005', '沙井街道','113.789789','22.62412218');">沙井街道</a>
<!-- <a href="javascript:getSingleAreaData('440306011', '新桥街道','113.836276','22.748901');">新桥街道</a> -->
<a href="javascript:getSingleAreaData('440306011', '新桥街道','113.807817','22.63389118');">新桥街道</a>
<!-- <a href="javascript:getSingleAreaData('440306006', '松岗街道','113.854628','22.770833');">松岗街道</a> -->
<a href="javascript:getSingleAreaData('440306006', '松岗街道','113.826169','22.65582318');">松岗街道</a>
<!-- <a href="javascript:getSingleAreaData('440306012', '燕罗街道','113.868375','22.803618');">燕罗街道</a> -->
<a href="javascript:getSingleAreaData('440306012', '燕罗街道','113.839916','22.68860818');">燕罗街道</a>
<!-- <a href="javascript:getSingleAreaData('440306008', '石岩街道','113.94603','22.687349');">石岩街道</a> -->
<a href="javascript:getSingleAreaData('440306008', '石岩街道','113.917571','22.57233918');">石岩街道</a>
</div>
</div>
</div>
<!--服务点-->
<div class="l_fwd">
<div class="corner_box">
<!--装饰-->
<span class="zs zs_01"></span>
<span class="zs zs_02"></span>
<span class="zs zs_03"></span>
<span class="zs zs_04"></span>
<!--内容区域-->
<ul class="fwd_list" id="fwdList">
<li class="tit"><span>服务点</span></li>
<li>
<span>区政务服务中心</span>
<span>1</span>
<span class="state on" id="areaSwitchState">
<i id="areaSwitch"></i>
</span>
</li>
<li>
<span>街道政务服务中心</span>
<span>10</span>
<span class="state on" id="streetSwitchState">
<i id="streetSwitch"></i>
</span>
</li>
<li>
<span>社区工作站</span>
<span>124</span>
<span class="state" id="communitySwitchState">
<i id="communitySwitch"></i>
</span>
</li>
<li>
<span>自助服务区</span>
<span id="regionTotal">50</span>
<span class="state" id="serviceAreaSwitchState">
<i id="serviceAreaSwitch"></i>
</span>
</li>
<li>
<span>自助服务终端机</span>
<span>204</span>
<span>
<i></i>
</span>
</li>
</ul>
</div>
</div>
<!--右侧全区业务量-->
<div class="r_qqywl">
<!--标题-->
<div class="title_wrap02">
<div class="tit_txt">
<div class="tit_dh">
<span></span>
<span></span>
<span></span>
</div>
<span id="areaName">宝安区</span>业务量
</div>
</div>
<div class="cont_box">
<div style="margin-bottom: 10px;margin-top: -10px;">
<img src="/images/style8/update_time.png" width="24px" height="24px">
<span id="time_update">00:00:00</span> 数据已更新
</div>
<!-- 根据日期查询业务量数据 -->
<!-- <div class="corner_box" style="margin:15px 0">
装饰
<span class="zs zs_01"></span>
<span class="zs zs_02"></span>
<span class="zs zs_03"></span>
<span class="zs zs_04"></span>
装饰 end
<div class="tab_tit01" style="text-align: center;">
<input type="date" id="startDate" style="border:none;padding: 0 6px;color: #fff;background: none;width: 133px;height:30px;" />
<span>-</span>
<input type="date" id="endDate" style="border:none;padding: 0 6px;color: #fff;background: none;width: 133px;height:30px;" />
</div>
隐藏区域id
<input type="hidden" id="areaIdHidden" value="440306"/>
</div> -->
<!--tab标题-->
<div class="corner_box">
<!--装饰-->
<span class="zs zs_01"></span>
<span class="zs zs_02"></span>
<span class="zs zs_03"></span>
<span class="zs zs_04"></span>
<!--装饰 end-->
<div class="tab_tit01" id="qqywlTabTit">
<a href="javascript:;" class="active" id="tab_lj">累计</a>
<a href="javascript:;" id="tab_jr">今日</a>
<a href="javascript:;" id="tab_bz">本周</a>
<a href="javascript:;" id="tab_by">本月</a>
</div>
</div>
<!--内容区域-->
<div class="tab_content">
<ul class="qqywl_list">
<li>
<span><img src="/images/style8/wssbl_icon.png"></span>
<span><!-- 网上<br/> -->申报量</span>
<span><i class="fontNum" id="wssbl" style="cursor:pointer;">0</i>件</span>
</li>
<li>
<span><img src="/images/style8/jhl_icon.png"></span>
<span>叫号量</span>
<span><i class="fontNum" id="jhl" style="cursor:pointer;">0</i>件</span>
</li>
<li>
<span><img src="/images/style8/sll_icon.png"></span>
<span>受理量</span>
<span><i class="fontNum" id="sll" style="cursor:pointer;">0</i>件</span>
</li>
<li>
<span><img src="/images/style8/bjl_icon.png"></span>
<span>办结量</span>
<span><i class="fontNum" id="bjl" style="cursor:pointer;">0</i>件</span>
</li>
<li>
<span><img src="/images/style8/fzl_icon.png"></span>
<span>发证量</span>
<span><i class="fontNum" id="fzl" style="cursor:pointer;">0</i>件</span>
</li>
</ul>
</div>
</div>
</div>
<!-- 2D地图切换 -->
<div>
<img id="2DMapSwitch" src="/images/style8/2D.png" width="60px" height="60px" alt="切换"
style="border: none;position: absolute;right: 50px;bottom: 50px;cursor:pointer;
border-radius: 6px;" />
</div>
<!-- 点击弹出按部门弹窗 -->
<div class="r_subWrap" style="display: none;">
<div class="tit_txt"><span id="ywlsj">累计</span><span id="ywllx">申报量</span></div>
<!--关闭按钮-->
<a href="javascript:;" class="Close" id="closeDept"></a>
<div class="scrollWrap">
<table class="table_a table_a2">
<thead>
<tr>
<th width="60">序号</th>
<th>部门名称</th>
<th width="110">业务量</th>
</tr>
</thead>
<tbody id="dept_ywllist_body">
</tbody>
</table>
</div>
</div>
</div>
<!--弹出框1 区行政服务大厅-->
<div class="popBg" id="qzwdtPop">
<div class="popWrap_qubum">
<!--关闭按钮-->
<a href="javascript:;" data-name="popClose" class="popClose" id="qzwdtPopClose"></a>
<!--内容区域-->
<div class="pop_content qfwdt_pop_content" style="">
<div class="tab_content" id="tabContent1">
<div class="tab_cont" style="display: block;">
<div class="ckfb_cont">
<div>
<iframe id="qubum" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" width="100%" height="100%" onload="changeFrameHeight2(this)"></iframe>
</div>
</div>
</div>
<div class="tab_cont">
<div class="scrollWrap">
<table class="table_a table_a1">
<thead></thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
<!--弹出框2 街道行政服务大厅-->
<div class="popBg" id="jdzwdtPop">
<div class="popWrap_qubum">
<!--关闭按钮-->
<a href="javascript:;" data-name="popClose" class="popClose"></a>
<!--标题-->
<!-- <div class="pop_tit">新安政务服务中心-窗口分布</div> -->
<!--内容区域-->
<div class="pop_content">
<div class="ckfb_cont" style="width: 1850px;">
<div>
<iframe id="jdpmt" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" width="100%" height="100%" onload="changeFrameHeight2(this)"></iframe>
</div>
</div>
</div>
</div>
</div>
<!--弹出框3 社区政务服务微中心-->
<div class="popBg" id="sqwfwPop">
<div class="popWrap_qubum">
<!--关闭按钮-->
<a href="javascript:;" data-name="popClose" class="popClose"></a>
<!--标题-->
<!-- <div class="pop_tit">宝民社区政务服务微中心</div> -->
<div style="width: 1850px;">
<iframe id="zksqList" frameborder="no" marginwidth="0" marginheight="0" scrolling="no" width="100%" height="100%" onload="changeFrameHeight2(this)"></iframe>
</div>
</div>
</div>
<!-- 三维地图自助服务区弹出层 -->
<div id="trackPopUp" style="display:none;">
<div id="trackPopUpContent" class="leaflet-popup" style="top:5px;left:0;">
<span class="leaflet-popup-close-button">x</span>
<div class="leaflet-popup-content-wrapper">
<div id="trackPopUpLink" class="leaflet-popup-content" style="max-width:100%;"></div>
</div>
<div class="leaflet-popup-tip-container">
<div class="leaflet-popup-tip"></div>
</div>
</div>
</div>
<script type="text/javascript" src="/js/zk/style7/pub.js"></script>
<script type="text/javascript" src="/js/zk/Cesium3DMap/Cesium.js"></script>
<script type="text/javascript" src="/js/zk/Cesium3DMap/Cesium_ext_min.js"></script>
<%@ include file="/WEB-INF/jsp/include/js_include.jsp"%>
<script type="text/javascript">
// 接入三维地图相关
var map = null;
// 地图相机初始高度
var initHeight = 30000;
// 地图倾斜角度
var initRadians = -40.0;
// 飞行定位初始经纬度
initLongitude = "113.878526";
initLatitude = "22.347567";
// 区图层
var areaLayerUrl = "http://10.99.85.192:6080/arcgis/rest/services/BAKSJ/CX_KJK/MapServer/0/query";
// 街道图层
var streetLayerUrl = "http://10.99.85.192:6080/arcgis/rest/services/BAKSJ/CX_KJK/MapServer/1/query";
// 社区图层
// var communityLayerUrl = "http://10.99.85.192:6080/arcgis/rest/services/BAKSJ/CX_KJK/MapServer/2/query";
// 全区业务量
var lj_data = null; // 累计业务量
var jr_data = null; // 今日业务量
var bz_data = null; // 本周业务量
var by_data = null; // 本月业务量
//时间判断
var startTime="";
var endTime="";
var type;
var deptAreaId = "440306"; // 宝安区区号
var areaId; // 宝安区区号
$(function () {
// 初始化地图
initMap();
// 全区业务量数据显示
areaId = "440306"; // 宝安区区号
getAllAreaData(areaId);
// 根据区划id获取区划落点数据
var areaIdParam = "440306";
getRegionDataByAreaid(areaIdParam);
// 添加弹窗
addPopup();
// 获取自助服务区数量
getRegionTotal("4");
// 设置边界线
setMapBoundary(map, '宝安区', 4.5, 'rgba(115,255,255,1)');
setMapBoundary(map, '街道', 1.5, 'rgba(115,255,255,1)');
// 业务量数据时间更新
updateTime();
setInterval(updateTime, 300000);
//setInterval(loopGetAllAreaData, 300000);
// 根据日期更新业务量数据
// updateBusinessDataByDate();
});
// 定时更新业务量数据
function loopGetAllAreaData() {
getAllAreaData("440306");
}
// 根据日期更新业务量数据
function updateBusinessDataByDate() {
// 开始日期，指定 2016-06-27
$("#startDate").val("2016-06-27");
// 结束日期，当前日期
$("#endDate").val(getCurrDate());
$("#startDate").on('change',function () {
getYWlDataByDate();
// 还原业务量样式，定位到累计
$("#tab_lj").addClass("active").siblings().removeClass("active");
});
$("#endDate").on('change',function () {
getYWlDataByDate();
// 还原业务量样式，定位到累计
$("#tab_lj").addClass("active").siblings().removeClass("active");
});
}
// 根据日期查询业务量数据
function getYWlDataByDate() {
var areaId = $("#areaIdHidden").val();
var startDate = $("#startDate").val();
var endDate = $("#endDate").val();
var param = {};
param.areaId = areaId;
param.startDate = startDate;
param.endDate = endDate;
$.post("/new/zkdp/getYWlDataByDate.do",param,function(data){
var lj_data = JSON.parse(data.returnValue);
$("#wssbl").html(toThousands(lj_data.wssbl)); // 网上申报量
$("#jhl").html(toThousands(lj_data.jhl)); // 叫号量
$("#sll").html(toThousands(lj_data.sll)); // 受理量
$("#bjl").html(toThousands(lj_data.bjl)); // 办结量
$("#fzl").html(toThousands(lj_data.fzl)); // 发证量
});
}
// 初始化地图
function initMap() {
// 地理范围
var fullExtent = [112.50368615984928, 21.62574656405662, 115.19050696492206, 23.703616633031594];
// 地图每级分辨率
var resolutions = [
0.00137329101562499, 0.000686645507812497, 0.000343322753906248, 0.000171661376953124,
858306884765621e-19, 42915344238281e-18, 214576721191405e-19, 107288360595703e-19,
536441802978513e-20, 268220901489257e-20, 134110450744628e-20
];
// 三维地图容器
var container ="cesiumContainer";
// 初始化图层
var tilingScheme = new Cesium.CustomGeographicTilingScheme({
resolutions: resolutions,
origin: [-180, 90],
fullExtent: fullExtent,
matrixWidth: 1680,
matrixHeight: 389
});
// 三维地图选项
var options = {
scene3DOnly: true, // 3D模式
imageryProvider: new Cesium.UrlTemplateImageryProvider({
url: "http://10.99.85.187:80/arcgis/rest/services/BAKSJ/DTVEC_SS_ZQ_BA_BJT/MapServer/tile/{z}/{y}/{x}",
tilingScheme: tilingScheme,
maximumLevel: tilingScheme.maximumLevel,
rectangle: tilingScheme.dataRectangle
}),
infoBox: false, // 左边弹窗
selectionIndicator: true, // 选中样式
};
//初始化三维球
map = new Cesium.Map(container, options);
// 添加宝安区图层
var layers = map.scene.imageryLayers;
var imageryProvider = new Cesium.UrlTemplateImageryProvider({
url: "http://10.99.85.187:80/arcgis/rest/services/BAKSJ/DTVEC_SS_ZQ_BA_2/MapServer/tile/{z}/{y}/{x}",
tilingScheme: tilingScheme,
maximumLevel: tilingScheme.maximumLevel,
rectangle: tilingScheme.dataRectangle
});
layers.addImageryProvider(imageryProvider);
// 飞行定位到宝安区
map.camera.flyTo({
//destination: Cesium.Cartesian3.fromDegrees(113.85531454, 22.46257682, initHeight), // height:58000
destination: Cesium.Cartesian3.fromDegrees(initLongitude,initLatitude, initHeight),
orientation: {
heading: Cesium.Math.toRadians(0.0), // 方向
pitch : Cesium.Math.toRadians(initRadians), // 倾斜角度 -66
roll: 0.0
}
});
}
// 地图落点设置数据
function addPoints(coordinates) {
for (var i=0; i<coordinates.length; i++) {
var entity = new Cesium.Entity({
id: coordinates[i].areaid,
name: coordinates[i].name,
layer: coordinates[i].layer, // 自定义类型的数据
position: Cesium.Cartesian3.fromDegrees(coordinates[i].longitude, coordinates[i].lATITUDE),
//文字标签
label: {
text : coordinates[i].name,
font : '12px',
showBackground: true,
//backgroundColor: new Color(0.165, 0.165, 0.165, 0.6),
backgroundColor: new Color(0, 0, 0, 0.4),
fillColor: Color.WHITE,
//outlineColor: Color.WHITE,
//scale: 1.6,
scale: 1,
style : Cesium.LabelStyle.FILL,
verticalOrigin : Cesium.VerticalOrigin.CENTER,
//pixelOffset : new Cesium.Cartesian2(0, -54), // X,Y轴偏移量
pixelOffset : new Cesium.Cartesian2(0, -33),
backgroundPadding: new Cartesian2(5, 2),
},
// 广告牌图标
billboard: {
image: "/images/style8/location_"+coordinates[i].layer+".png",
verticalOrigin: Cesium.VerticalOrigin.CENTER,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
width: 36,
height: 42,
//scale: 1.6,
scale: 1,
},
});
map.entities.add(entity);
}
}
// 点击添加弹窗
function addPopup() {
// 创建屏幕控制
var handler = new Cesium.ScreenSpaceEventHandler(map.scene.canvas);
// 设置输入行为,单击事件
handler.setInputAction(function(movement){
var pickedObject = map.scene.pick(movement.position);
if (Cesium.defined(pickedObject)) {
// 点击对象的数据
var areaid = pickedObject.id.id;
var name = pickedObject.id.name;
var layer = pickedObject.id.layer;
//根据layer判断弹出框是弹哪个页面
if(layer!=null&&layer=='1'){
$("#qzwdtPop").addClass("showPop");
var src = "/count/sy/qubum_new.do?areaid=440306";
$("#qubum").attr("src",src);
}else if(layer!=null&&layer=='2'){
$("#jdpmt").attr("src","");
if(areaid=='440306001'){ //新安街道
var src = "/count/sy/xapmt_new.do?areaid=440306001";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
} else if(areaid=='440306003'){ //西乡街道
var src = "/count/sy/xxpmt_new.do?areaid=440306003";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306004'){ //福永街道
var src = "/count/sy/fypmt_new.do?areaid=440306004";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306005'){ //沙井街道
var src = "/count/sy/sjpmt_new.do?areaid=440306005";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306006'){ //松岗街道
var src = "/count/sy/sgpmt_new.do?areaid=440306006";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306008'){ //石岩街道
var src = "/count/sy/sypmt_new.do?areaid=440306008";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306009'){ //航城街道
var src = "/count/sy/hcpmt_new.do?areaid=440306009";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306010'){ //福海街道
var src = "/count/sy/fhpmt_new.do?areaid=440306010";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306011'){ //新桥街道
var src = "/count/sy/xqpmt_new.do?areaid=440306011";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}else if(areaid=='440306012'){ //燕罗街道
var src = "/count/sy/ylpmt_new.do?areaid=440306012";
$("#jdpmt").attr("src",src);
$("#jdzwdtPop").addClass("showPop");
}
}else if(layer!=null&&layer=='3'){ //社区
$("#zksqList").attr("src","");
var src = "/new/zkdp/zksqList.do?sqAreaid="+areaid;
/* var src = "/mainframe/style7/zksqList.jsp?areaid="+areaid; */
/* var src = "/mainframe/style6/zksqList.jsp?areaid="+areaid; */
$("#zksqList").attr("src",src);
$("#sqwfwPop").addClass("showPop");
}else if(layer != null && layer == '4'){ // 自助服务区
// 显示弹窗容器
var cartographic = Cesium.Cartographic.fromCartesian(pickedObject.primitive._actualPosition);
// 获取点的经纬度
var point=[cartographic.longitude / Math.PI * 180, cartographic.latitude / Math.PI * 180];
// 转换坐标,destination是我们点击之后,flyto的位置
var destination=Cesium.Cartesian3.fromDegrees(point[0], point[1], initHeight);
$.post("/new/zkdp/getRegionServiceByAreaid.do",{"areaId":areaid},function(data){
var data = JSON.parse(data.returnValue);
var content = "<table width='300px' style='border-collapse:separate; border-spacing:0px 12px;'>" +
"<tr><td style='text-align: center;'>" + name + "</td></tr>" +
"<tr><td style='text-align: left;'>" + "所在地址：" + data[0] + "</td></tr>" +
"<tr><td style='text-align: left;'>" + "自助服务终端机数：" + data[1] + "</td></tr></table>";
var obj = {position:movement.position,destination:destination,content:content};
infoWindow(obj,pickedObject);
});
}
}else {
$('#trackPopUp').hide();
$('#trackPopUpLink').empty();
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
// 设置输入行为,鼠标移入事件
handler.setInputAction(function(movement) {
if (map.scene.mode !== Cesium.SceneMode.MORPHING) {
var pickedObject = map.scene.pick(movement.endPosition);
if(Cesium.defined(pickedObject)) {
map._container.style.cursor = "pointer";
}else {
map._container.style.cursor = "default";
}
}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
// 清除双击事件行为
map.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
// 三维地图弹出层
function infoWindow(obj,pickedObject) {
var picked = map.scene.pick(obj.position);
// 首先获取点击点的信息
if (Cesium.defined(picked)) {
// 判断如果点被定义了
var id = Cesium.defaultValue(picked.id, picked.primitive.id);
// 获取id(id就是原生弹窗的标题)
if(id){
$('#trackPopUpLink').empty();
$('#trackPopUpLink').append(obj.content);
function positionPopUp(c) {
var x = c.x - ($('#trackPopUpContent').width()) / 2;
var y = c.y - ($('#trackPopUpContent').height());
$('#trackPopUpContent').css('transform', 'translate3d(' + x + 'px, ' + y + 'px, 0)');
}
var c = new Cesium.Cartesian2(obj.position.x, obj.position.y);
$('#trackPopUp').show();
positionPopUp(c);
// //实时更新位置
var removeHandler = map.scene.postRender.addEventListener(function () {
var changedC = Cesium.SceneTransforms.wgs84ToWindowCoordinates(map.scene, pickedObject.primitive._actualPosition);
// 我们转动地球,也会实时更新弹窗的位置.并不会一成不变
if (c && changedC && c.x && changedC.x && c.y && changedC.y) {
if ((c.x !== changedC.x) || (c.y !== changedC.y)) {
positionPopUp(changedC);
c = changedC;
}
}
});
// 关闭隐藏
$('.leaflet-popup-close-button').click(function () {
$("#trackPopUp").hide();
$("#trackPopUpLink").empty();
removeHandler.call();
return false;
});
}
}
}
}
// 设置地图边界
function setMapBoundary(map, type, lineWidth, lineColor){
var layerUrl = streetLayerUrl;
if (type == '宝安区') {
layerUrl = areaLayerUrl;
} else if (type == '街道') {
layerUrl = streetLayerUrl;
}
$.ajax({
url: layerUrl,
type: 'get',
data: {
where: '1=1',
geometryType: 'esriGeometryEnvelope',
spatialRel: 'esriSpatialRelIntersects',
outFields: '*',
returnGeometry: true,
f: 'pjson'
},
success: function (data) {
data = JSON.parse(data);
if (data.features.length > 0) {
$.each(data.features, function(j, item) {
for (var w = 0; w < data.features[j].geometry.rings.length; w++) {
var polylinePositions = [];
for (var x = 0; x < data.features[j].geometry.rings[w].length; x++) {
polylinePositions = polylinePositions.concat(data.features[j].geometry.rings[w][x]);
}
var lineData = {
polyline: {
positions: Cesium.Cartesian3.fromDegreesArray(polylinePositions),
width: lineWidth,
material: Cesium.Color.fromCssColorString(lineColor),
clampToGround: true
}
};
map.entities.add(lineData);
}
});
}
}
});
}
// 根据areaId获取落点数据
function getRegionDataByAreaid(areaId) {
$.post("/new/zkdp/getRegionListByAreaid.do",{"areaId":areaId},function(data){
var coordinates = JSON.parse(data.returnValue);
addPoints(coordinates);
});
}
// 清除指定类型落点，layer说明 ：1为区，2为街道，3为社区，4为自助服务区
function removeRegionDataByLayer(layer) {
$.post("/new/zkdp/getRegionListBylayer.do",{"layer":layer},function(data){
var coordinates = JSON.parse(data.returnValue);
for (var i=0; i<coordinates.length; i++){
var entity = map.entities.getById(coordinates[i].areaid);
map.entities.remove(entity);
}
});
}
// 根据区域类型layer设置区划落点数据，layer说明 ：1为区，2为街道，3为社区，4为自助服务区
function setRegionDataByLayer(layer) {
$.post("/new/zkdp/getRegionListBylayer.do",{"layer":layer},function(data){
var coordinates = JSON.parse(data.returnValue);
addPoints(coordinates);
});
}
// 全区业务量数据获取
function getAllAreaData(areaId) {
deptAreaId=areaId;
$.post("/new/zkdp/getYWlStatistic.do",{"areaId":areaId},function(data){
var businessData = JSON.parse(data.returnValue);
lj_data = businessData.LJYWL; // 累计业务量
jr_data = businessData.JRYWL; // 今日业务量
bz_data = businessData.BZYWL; // 本周业务量
by_data = businessData.BYYWL; // 本月业务量
$("#wssbl").html(toThousands(lj_data.wssbl)); // 网上申报量
$("#jhl").html(toThousands(lj_data.jhl)); // 叫号量
$("#sll").html(toThousands(lj_data.sll)); // 受理量
$("#bjl").html(toThousands(lj_data.bjl)); // 办结量
$("#fzl").html(toThousands(lj_data.fzl)); // 发证量
//处理部门弹出框相关参数
$(".r_subWrap").css("display","none");
$("#dept_ywllist_body").html("");
startTime="2016-06-27";
endTime=getCurrDate();
$("#ywlsj").html("累计");
//拼接调整url
//toWylUrl("lj",areaId);
/*setAllAreaData("lj", lj_data, areaId);
setAllAreaData("jr", jr_data, areaId);
setAllAreaData("bz", bz_data, areaId);
setAllAreaData("by", by_data, areaId); */
},"json");
}
//对累计，今日，本周，本月按钮处理
$("#tab_lj").click(function() {
//拼接调整url
$("#wssbl").html(toThousands(lj_data.wssbl)); // 网上申报量
$("#jhl").html(toThousands(lj_data.jhl)); // 叫号量
$("#sll").html(toThousands(lj_data.sll)); // 受理量
$("#bjl").html(toThousands(lj_data.bjl)); // 办结量
$("#fzl").html(toThousands(lj_data.fzl)); // 发证量
//处理部门弹出框相关参数
$(".r_subWrap").css("display","none");
$("#dept_ywllist_body").html("");
startTime="2016-06-27";
endTime=getCurrDate();
$("#ywlsj").html("累计");
});
$("#tab_jr").click(function() {
//拼接调整url
$("#wssbl").html(toThousands(jr_data.wssbl)); // 网上申报量
$("#jhl").html(toThousands(jr_data.jhl)); // 叫号量
$("#sll").html(toThousands(jr_data.sll)); // 受理量
$("#bjl").html(toThousands(jr_data.bjl)); // 办结量
$("#fzl").html(toThousands(jr_data.fzl)); // 发证量
//处理部门弹出框相关参数
$(".r_subWrap").css("display","none");
$("#dept_ywllist_body").html("");
startTime=getCurrDate();
endTime=getCurrDate();
$("#ywlsj").html("今日");
});
$("#tab_bz").click(function() {
//拼接调整url
$("#wssbl").html(toThousands(bz_data.wssbl)); // 网上申报量
$("#jhl").html(toThousands(bz_data.jhl)); // 叫号量
$("#sll").html(toThousands(bz_data.sll)); // 受理量
$("#bjl").html(toThousands(bz_data.bjl)); // 办结量
$("#fzl").html(toThousands(bz_data.fzl)); // 发证量
//处理部门弹出框相关参数
$(".r_subWrap").css("display","none");
$("#dept_ywllist_body").html("");
startTime=getWeekStartDate();
endTime=getWeekEndDate();
$("#ywlsj").html("本周");
});
$("#tab_by").click(function() {
//拼接调整url
$("#wssbl").html(toThousands(by_data.wssbl)); // 网上申报量
$("#jhl").html(toThousands(by_data.jhl)); // 叫号量
$("#sll").html(toThousands(by_data.sll)); // 受理量
$("#bjl").html(toThousands(by_data.bjl)); // 办结量
$("#fzl").html(toThousands(by_data.fzl)); // 发证量
//处理部门弹出框相关参数
$(".r_subWrap").css("display","none");
$("#dept_ywllist_body").html("");
startTime=getMonthStartDate();
endTime=getMonthEndDate();
$("#ywlsj").html("本月");
});
/*
*处理业务量按钮
*/
//加载转圈圈效果
function getLoading(){
$("#dept_ywllist_body").html("<tr><td colspan='3'><div class='loading'></div></td></tr>");
}
// 网上申报量
$("#wssbl").click(function() {
$("#ywllx").html("申报量");
getLoading();
$(".r_subWrap").css("display","block");
type="wssbl";
getDeptWyl(deptAreaId,startTime,endTime);
});
// 叫号量
$("#jhl").click(function() {
var count = $("#jhl").html();
var url="/new/zkdp/zksxxq_jhl.do?areaid="+deptAreaId+"&sDate1="+startTime+"&sDate2="+endTime+"&count="+count;
toPage(url);
});
// 受理量
$("#sll").click(function() {
$("#ywllx").html("受理量");
getLoading();
$(".r_subWrap").css("display","block");
type="sll";
getDeptWyl(deptAreaId,startTime,endTime);
});
// 办结量
$("#bjl").click(function() {
$("#ywllx").html("办结量");
getLoading();
$(".r_subWrap").css("display","block");
type="bjl";
getDeptWyl(deptAreaId,startTime,endTime);
});
// 发证量
$("#fzl").click(function() {
$("#ywllx").html("发证量");
getLoading();
$(".r_subWrap").css("display","block");
type="fzl";
getDeptWyl(deptAreaId,startTime,endTime);
});
//关闭部门分类弹窗口按钮事件
$("#closeDept").click(function () {
$(".r_subWrap").css("display","none");
});
//判断跳转对应二级个页面
function getDeptWyl(areaId,sDate1,sDate2){
var params = {areaid:areaId,sDate1:sDate1,sDate2:sDate2};
if(type == 'wssbl'){
queryData("newzk_sxxq_wssql_dept_#role", dataHandler_newzk_sxxq_dept, params, -1);
}else if(type == 'sll'){
queryData("newzk_sxxq_sll_dept_#role", dataHandler_newzk_sxxq_dept, params, -1);
}else if(type == 'bjl'){
queryData("newzk_sxxq_bjl_dept_#role", dataHandler_newzk_sxxq_dept, params, -1);
}else if(type == 'fzl'){
queryData("newzk_sxxq_fzl_dept_#role", dataHandler_newzk_sxxq_dept, params, -1);
}
}
var dataHandler_newzk_sxxq_dept = function(data) {
var html = "";
var i = 1;
$(data).find("item").each(function(){
var shortname = getValue(this,"shortname");
var ywl = getValue(this,"ywl");
html = html + "<tr><td>"+i+"</td><td class='textLeft'>"+shortname+"</td>" +
"<td class='textLeft' style = \"cursor:pointer;\" onclick=\"toDept('"+shortname+"')\"> <span class='fontNum'>"+ywl+"</span></td>" +
"</tr>";
i++;
});
$("#dept_ywllist_body").html(html);
}
function toDept(shortname){
var url;
if(type == 'wssbl'){
url="/new/zkdp/zksxxq_wssql.do?areaid="+deptAreaId+"&deptname="+encodeURIComponent(shortname)+"&sDate1="+startTime+"&sDate2="+endTime;
}else if(type == 'sll'){
url="/new/zkdp/zksxxq_sll.do?areaid="+deptAreaId+"&deptname="+encodeURIComponent(shortname)+"&sDate1="+startTime+"&sDate2="+endTime;
}else if(type == 'bjl'){
url="/new/zkdp/zksxxq_bjl.do?areaid="+deptAreaId+"&deptname="+encodeURIComponent(shortname)+"&sDate1="+startTime+"&sDate2="+endTime;
}else if(type == 'fzl'){
url="/new/zkdp/zksxxq_fzl.do?areaid="+deptAreaId+"&deptname="+encodeURIComponent(shortname)+"&sDate1="+startTime+"&sDate2="+endTime;
}
toPage(url);
}
// 点击街道获取数据
function getSingleAreaData(areaId, areaName, longitude, latitude) {
// 隐藏弹出层
$("#trackPopUp").hide();
$("#trackPopUpLink").empty();
// 地图相机高度、倾斜角度
/* var height = "24000";
var radians = "-88"; */
var height = 12000;
var radians = initRadians;
if (areaId === "440306") {
height = initHeight;
radians = initRadians;
}
// 飞行定位
map.camera.flyTo({
destination: Cesium.Cartesian3.fromDegrees(longitude, latitude, height), // height:58000
orientation: {
heading: Cesium.Math.toRadians(0.0),
pitch : Cesium.Math.toRadians(radians), // 倾斜角度
roll: 0.0
}
});
// 删除所有的实体对象
map.entities.removeAll();
// 设置边界线
setMapBoundary(map, '宝安区', 3, 'rgba(115,255,255,1)');
setMapBoundary(map, '街道', 1.5, 'rgba(115,255,255,1)');
// 获取街道落点数据进行落点
getRegionDataByAreaid(areaId);
// 获取业务量数据
getAllAreaData(areaId);
$("#areaName").html(areaName);
// 修改名称
if (areaId === "440306") {
$("#customAreaName").html("宝安区");
}else {
$("#customAreaName").html(areaName);
}
// 添加地图弹框
addPopup();
// 还原服务点开关样式
if (areaId === "440306") {
$("#areaSwitchState").addClass("on");
$("#streetSwitchState").addClass("on");
$("#communitySwitchState").removeClass("on");
$("#serviceAreaSwitchState").removeClass("on");
}else {
$("#areaSwitchState").removeClass("on");
$("#streetSwitchState").addClass("on");
$("#communitySwitchState").addClass("on");
$("#serviceAreaSwitchState").removeClass("on");
}
// 还原业务量样式，定位到累计
$("#tab_lj").addClass("active").siblings().removeClass("active");
// 设置隐藏区域id的值
$("#areaIdHidden").val(areaId);
}
// 区政务服务中心切换
$("#areaSwitch").click(function() {
if($("#areaSwitchState").hasClass("on")){
removeRegionDataByLayer("1");
$("#areaSwitchState").removeClass("on");
}else{
setRegionDataByLayer("1");
$("#areaSwitchState").addClass("on");
}
});
// 街道政务服务中心切换
$("#streetSwitch").click(function() {
if($("#streetSwitchState").hasClass("on")){
removeRegionDataByLayer("2");
$("#streetSwitchState").removeClass("on");
}else{
setRegionDataByLayer("2");
$("#streetSwitchState").addClass("on");
}
});
// 社区工作站
$("#communitySwitch").click(function() {
if($("#communitySwitchState").hasClass("on")){
removeRegionDataByLayer("3");
$("#communitySwitchState").removeClass("on");
}else{
setRegionDataByLayer("3");
$("#communitySwitchState").addClass("on");
}
});
// 自助服务区
$("#serviceAreaSwitch").click(function() {
if($("#serviceAreaSwitchState").hasClass("on")){
removeRegionDataByLayer("4");
$("#serviceAreaSwitchState").removeClass("on");
// 隐藏地图弹窗
$("#trackPopUp").hide();
$("#trackPopUpLink").empty();
}else{
setRegionDataByLayer("4");
$("#serviceAreaSwitchState").addClass("on");
}
});
// 跳转页面
function toPage(url) {
window.location.href = url;
}
// 获取自助服务区数量
function getRegionTotal(layer) {
$.post("/new/zkdp/getRegionTotal.do",{"layer":layer},function(data){
$("#regionTotal").html(data.returnValue);
});
}
// 点击切换二维地图页面
$("#2DMapSwitch").click(function() {
toPage('/new/zkdp/tozkdp.do');
});
// 千分位分隔
function toThousands(num) {
var result = [ ], counter = 0;
num = (num || 0).toString().split('');
for (var i = num.length - 1; i >= 0; i--) {
counter++;
result.unshift(num[i]);
if (!(counter % 3) && i != 0) { result.unshift(','); }
}
return result.join('');
}
// 每5分钟更新一次时间
function updateTime() {
var now = new Date();
var hh = now.getHours();
var mm = now.getMinutes();
var ss = now.getSeconds();
if (mm - 5 < 0) {
mm = mm - 5 + 60;
hh = hh - 1 >= 0 ? hh-1 : 0;
}else {
mm = mm -5;
}
if(hh < 10){
hh = "0" + hh;
}
if(mm < 10){
mm = "0" + mm;
}
if(ss < 10){
ss = "0" + ss;
}
$("#time_update").html(hh+":"+mm+":"+ss);
}
//中间区划选择
/* $("#qhSelect").hover(function () {
$(this).find(".qh_subCont").fadeIn(1000);
},function () {
$("#qhSelect .qh_subCont").stop().fadeOut(0);
}); */
//全区业务量 顶部链接 切换
changeBg($("#qqywlTabTit>a,.top_link>a"));
</script>
</body>
</html>
包在这 拿走不谢 有问题直接评论问 看到一定回
https://download.csdn.net/download/weixin_45447370/20033277
学海无涯，致奋斗的自己，加油
485
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
