|
|
|
@ -1,750 +0,0 @@
|
|
|
|
|
|
|
|
|
|
|
|
proj4.defs("EPSG:4490", '+proj=longlat +ellps=GRS80 +no_defs')
|
|
|
|
|
|
|
|
/*自定义坐标系 命名、范围、单位等; */
|
|
|
|
|
|
|
|
var projection = new ol.proj.Projection({
|
|
|
|
|
|
|
|
// extent: MAPCONFIGS.Map_extent,
|
|
|
|
|
|
|
|
code: MAPCONFIGS.Map_Code,
|
|
|
|
|
|
|
|
units: MAPCONFIGS.Map_units,
|
|
|
|
|
|
|
|
axisOrientation: MAPCONFIGS.Map_axisOrientation,
|
|
|
|
|
|
|
|
global: MAPCONFIGS.Map_global,
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
ol.proj.addProjection(projection);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/**
|
|
|
|
|
|
|
|
*地图基本属性定义
|
|
|
|
|
|
|
|
**/
|
|
|
|
|
|
|
|
var ZJMAP;
|
|
|
|
|
|
|
|
var ClickMap = 0;//0点击地图 // 1 获取坐标 //2 测量 //3空间查询统计
|
|
|
|
|
|
|
|
var vectorLayer; //基本信息 ，统计等 查询结果层
|
|
|
|
|
|
|
|
var vectorLayer2; //定位展示
|
|
|
|
|
|
|
|
var vectorLayer3;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var vectorLayer1;
|
|
|
|
|
|
|
|
var source;//空间图层
|
|
|
|
|
|
|
|
var draw, drawtype, geomtype, geomdraw, radiusdraw;
|
|
|
|
|
|
|
|
var yxdtmap = true;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//页面加载完成后执行
|
|
|
|
|
|
|
|
$(document).ready(function () {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ZJMAP = new ol.Map({
|
|
|
|
|
|
|
|
view: new ol.View({
|
|
|
|
|
|
|
|
center: MAPCONFIGS.MAP_center,
|
|
|
|
|
|
|
|
zoom: MAPCONFIGS.Map_Zooms[0],
|
|
|
|
|
|
|
|
projection: projection,
|
|
|
|
|
|
|
|
maxZoom: MAPCONFIGS.Map_Zooms[1],
|
|
|
|
|
|
|
|
minZoom: MAPCONFIGS.Map_Zooms[2]
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
layers: [],
|
|
|
|
|
|
|
|
target: MAPCONFIGS.Map_ID,
|
|
|
|
|
|
|
|
interactions: ol.interaction.defaults({
|
|
|
|
|
|
|
|
doubleClickZoom: false,
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//加载图层
|
|
|
|
|
|
|
|
ShowLayers();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//加载查询结果层
|
|
|
|
|
|
|
|
vectorLayer = new ol.layer.Image({
|
|
|
|
|
|
|
|
source: new ol.source.ImageVector({
|
|
|
|
|
|
|
|
source: new ol.source.Vector(),
|
|
|
|
|
|
|
|
style: new ol.style.Style({
|
|
|
|
|
|
|
|
image: new ol.style.Icon(
|
|
|
|
|
|
|
|
({
|
|
|
|
|
|
|
|
anchor: [0.5, 60],
|
|
|
|
|
|
|
|
anchorOrigin: 'top-right',
|
|
|
|
|
|
|
|
anchorXUnits: 'fraction',
|
|
|
|
|
|
|
|
anchorYUnits: 'pixels',
|
|
|
|
|
|
|
|
offsetOrigin: 'top-right',
|
|
|
|
|
|
|
|
//透明度
|
|
|
|
|
|
|
|
opacity: 0.97,
|
|
|
|
|
|
|
|
//图标缩放比例
|
|
|
|
|
|
|
|
scale: 0.55,
|
|
|
|
|
|
|
|
//图标的url
|
|
|
|
|
|
|
|
src: '../image/标绘点.png'
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
fill: new ol.style.Fill({
|
|
|
|
|
|
|
|
color: 'rgba(255, 0, 0, 0.2)'
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
stroke: new ol.style.Stroke({
|
|
|
|
|
|
|
|
color: '#FF4500',
|
|
|
|
|
|
|
|
width: 4
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
ZJMAP.addLayer(vectorLayer);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//加载查询结果层
|
|
|
|
|
|
|
|
vectorLayer2 = new ol.layer.Image({
|
|
|
|
|
|
|
|
source: new ol.source.ImageVector({
|
|
|
|
|
|
|
|
source: new ol.source.Vector(),
|
|
|
|
|
|
|
|
style: new ol.style.Style({
|
|
|
|
|
|
|
|
image: new ol.style.Icon(
|
|
|
|
|
|
|
|
({
|
|
|
|
|
|
|
|
anchor: [0.5, 60],
|
|
|
|
|
|
|
|
anchorOrigin: 'top-right',
|
|
|
|
|
|
|
|
anchorXUnits: 'fraction',
|
|
|
|
|
|
|
|
anchorYUnits: 'pixels',
|
|
|
|
|
|
|
|
offsetOrigin: 'top-right',
|
|
|
|
|
|
|
|
//透明度
|
|
|
|
|
|
|
|
opacity: 0.97,
|
|
|
|
|
|
|
|
//图标缩放比例
|
|
|
|
|
|
|
|
scale: 0.55,
|
|
|
|
|
|
|
|
//图标的url
|
|
|
|
|
|
|
|
src: '../image/标绘点2.png'
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
fill: new ol.style.Fill({
|
|
|
|
|
|
|
|
color: 'rgba(255,255,102, 0.2)'
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
stroke: new ol.style.Stroke({
|
|
|
|
|
|
|
|
color: '#FFFF66',
|
|
|
|
|
|
|
|
width: 4
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
//image: new ol.style.Icon(
|
|
|
|
|
|
|
|
// ({
|
|
|
|
|
|
|
|
// anchor: [0.5, 60],
|
|
|
|
|
|
|
|
// anchorOrigin: 'top-right',
|
|
|
|
|
|
|
|
// anchorXUnits: 'fraction',
|
|
|
|
|
|
|
|
// anchorYUnits: 'pixels',
|
|
|
|
|
|
|
|
// offsetOrigin: 'top-right',
|
|
|
|
|
|
|
|
// //透明度
|
|
|
|
|
|
|
|
// opacity: 0.97,
|
|
|
|
|
|
|
|
// //图标缩放比例
|
|
|
|
|
|
|
|
// scale: 0.55,
|
|
|
|
|
|
|
|
// //图标的url
|
|
|
|
|
|
|
|
// src: '../image/标绘点.png'
|
|
|
|
|
|
|
|
// })
|
|
|
|
|
|
|
|
//),
|
|
|
|
|
|
|
|
//fill: new ol.style.Fill({
|
|
|
|
|
|
|
|
// color: 'rgba(255, 0, 0, 0.2)'
|
|
|
|
|
|
|
|
//}),
|
|
|
|
|
|
|
|
//stroke: new ol.style.Stroke({
|
|
|
|
|
|
|
|
// color: '#000080',
|
|
|
|
|
|
|
|
// width: 4
|
|
|
|
|
|
|
|
//})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
ZJMAP.addLayer(vectorLayer2);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
vectorLayer3 = new ol.layer.Image({
|
|
|
|
|
|
|
|
source: new ol.source.ImageVector({
|
|
|
|
|
|
|
|
source: new ol.source.Vector(),
|
|
|
|
|
|
|
|
style: new ol.style.Style({
|
|
|
|
|
|
|
|
image: new ol.style.Icon(
|
|
|
|
|
|
|
|
({
|
|
|
|
|
|
|
|
anchor: [0.5, 60],
|
|
|
|
|
|
|
|
anchorOrigin: 'top-right',
|
|
|
|
|
|
|
|
anchorXUnits: 'fraction',
|
|
|
|
|
|
|
|
anchorYUnits: 'pixels',
|
|
|
|
|
|
|
|
offsetOrigin: 'top-right',
|
|
|
|
|
|
|
|
//透明度
|
|
|
|
|
|
|
|
opacity: 0.97,
|
|
|
|
|
|
|
|
//图标缩放比例
|
|
|
|
|
|
|
|
scale: 0.55,
|
|
|
|
|
|
|
|
//图标的url
|
|
|
|
|
|
|
|
src: '../image/标绘点.png'
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
),
|
|
|
|
|
|
|
|
fill: new ol.style.Fill({
|
|
|
|
|
|
|
|
color: 'rgba(255,255,102, 0.1)'
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
stroke: new ol.style.Stroke({
|
|
|
|
|
|
|
|
color: '#FFFF66',
|
|
|
|
|
|
|
|
width: 4
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
ZJMAP.addLayer(vectorLayer3);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
///临时图层
|
|
|
|
|
|
|
|
source = new ol.source.Vector({ wrapX: false });
|
|
|
|
|
|
|
|
vector = new ol.layer.Vector({
|
|
|
|
|
|
|
|
//数据源
|
|
|
|
|
|
|
|
source: source,
|
|
|
|
|
|
|
|
//样式
|
|
|
|
|
|
|
|
style: new ol.style.Style({
|
|
|
|
|
|
|
|
//样式填充
|
|
|
|
|
|
|
|
fill: new ol.style.Fill({
|
|
|
|
|
|
|
|
//填充颜色
|
|
|
|
|
|
|
|
color: 'rgba(37,241,239,0.2)'
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
//笔触
|
|
|
|
|
|
|
|
stroke: new ol.style.Stroke({
|
|
|
|
|
|
|
|
//笔触颜色
|
|
|
|
|
|
|
|
color: '#264df6',
|
|
|
|
|
|
|
|
//笔触宽度
|
|
|
|
|
|
|
|
width: 2
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
//图形样式，主要适用于点样式
|
|
|
|
|
|
|
|
image: new ol.style.Circle({
|
|
|
|
|
|
|
|
//半径大小
|
|
|
|
|
|
|
|
radius: 7,
|
|
|
|
|
|
|
|
//填充
|
|
|
|
|
|
|
|
fill: new ol.style.Fill({
|
|
|
|
|
|
|
|
//填充颜色
|
|
|
|
|
|
|
|
color: '#e81818'
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
ZJMAP.addLayer(vector);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var createLabelStyle = function (feature) {
|
|
|
|
|
|
|
|
return new ol.style.Style({
|
|
|
|
|
|
|
|
text: new ol.style.Text({
|
|
|
|
|
|
|
|
//位置
|
|
|
|
|
|
|
|
textAlign: 'center',
|
|
|
|
|
|
|
|
//基准线
|
|
|
|
|
|
|
|
textBaseline: 'bottom',
|
|
|
|
|
|
|
|
//文字样式
|
|
|
|
|
|
|
|
font: 'normal 16px 黑体',
|
|
|
|
|
|
|
|
//文本内容
|
|
|
|
|
|
|
|
text: feature.get('name'),
|
|
|
|
|
|
|
|
//文本填充样式（即文字颜色）
|
|
|
|
|
|
|
|
fill: new ol.style.Fill({ color: 'black' }),
|
|
|
|
|
|
|
|
stroke: new ol.style.Stroke({ color: 'white', width: 5 }),
|
|
|
|
|
|
|
|
offsetY: 20
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
var centerpoint = ol.proj.fromLonLat([0, 0]);
|
|
|
|
|
|
|
|
var iconFeature = new ol.Feature({
|
|
|
|
|
|
|
|
geometry: new ol.geom.Point(centerpoint),
|
|
|
|
|
|
|
|
//名称属性
|
|
|
|
|
|
|
|
name: '',
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
iconFeature.setStyle(createLabelStyle(iconFeature));
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//矢量标注的数据源
|
|
|
|
|
|
|
|
var vectorSource = new ol.source.Vector({
|
|
|
|
|
|
|
|
features: [iconFeature]
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
//矢量标注图层
|
|
|
|
|
|
|
|
vectorLayer1 = new ol.layer.Vector({
|
|
|
|
|
|
|
|
source: vectorSource
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function addVectorLabel(coordinate, text) {
|
|
|
|
|
|
|
|
//新建一个要素 ol.Feature
|
|
|
|
|
|
|
|
var newFeature = new ol.Feature({
|
|
|
|
|
|
|
|
//几何信息
|
|
|
|
|
|
|
|
geometry: new ol.geom.Point(coordinate),
|
|
|
|
|
|
|
|
//名称属性
|
|
|
|
|
|
|
|
name: text
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
//设置要素的样式
|
|
|
|
|
|
|
|
newFeature.setStyle(createLabelStyle(newFeature));
|
|
|
|
|
|
|
|
//将新要素添加到数据源中
|
|
|
|
|
|
|
|
vectorSource.addFeature(newFeature);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ZJMAP.addLayer(vectorLayer1);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ZJMAP.on('click', function (evt) {
|
|
|
|
|
|
|
|
coordinate = evt.coordinate;
|
|
|
|
|
|
|
|
console.log(coordinate);
|
|
|
|
|
|
|
|
if (ClickMap == 0) { //点击获取数据
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().clear();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
vectorLayer2.getSource().getSource().clear();
|
|
|
|
|
|
|
|
vectorLayer3.getSource().getSource().clear();
|
|
|
|
|
|
|
|
var Cextent = new ol.geom.Circle(coordinate, 0.000003).getExtent();
|
|
|
|
|
|
|
|
var ply = Cextent[0] + " " + Cextent[1] + "," + Cextent[2] + " " + Cextent[1] + "," + Cextent[2] + " " + Cextent[3] + "," + Cextent[0] + " " + Cextent[3] + "," + Cextent[0] + " " + Cextent[1];
|
|
|
|
|
|
|
|
var layers = ZJMAP.getLayers().getArray();
|
|
|
|
|
|
|
|
var Tlayers = "";
|
|
|
|
|
|
|
|
for (i = 0; i < layers.length; i++) {
|
|
|
|
|
|
|
|
var Visible = layers[i].getVisible();
|
|
|
|
|
|
|
|
if (Visible) {
|
|
|
|
|
|
|
|
if (layers[i].get("layerType") == "数据") {
|
|
|
|
|
|
|
|
var title = layers[i].get("id");
|
|
|
|
|
|
|
|
if (title != "") {
|
|
|
|
|
|
|
|
Tlayers += layers[i].get("id") + ",";
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
console.log(Tlayers);
|
|
|
|
|
|
|
|
if (ply == "" || ply == null || Tlayers == "") {
|
|
|
|
|
|
|
|
console.log("请打开图层，点击地图！")
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log("开始", Date())
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
$.post(HCONFIGS.SearchMap, { geom: ply, layers: Tlayers }, res => {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log("结束", Date())
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var title = [];
|
|
|
|
|
|
|
|
var geom = [];
|
|
|
|
|
|
|
|
if (res.lcount != 0) {
|
|
|
|
|
|
|
|
for (i = 1; i <= res.lcount; i++) {
|
|
|
|
|
|
|
|
var b = { id: "L" + i, name: "管网" + i, type: "line", geom: res.data.line[i - 1].geom };
|
|
|
|
|
|
|
|
title.push(b);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
geom.push(res.data.line[0].geom);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (res.pcount != 0) {
|
|
|
|
|
|
|
|
for (i = 1; i <= res.pcount; i++) {
|
|
|
|
|
|
|
|
var b = { id: "P" + i, name: "管井" + i, type: "point", geom: res.data.point[i - 1].geom };
|
|
|
|
|
|
|
|
title.push(b);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (geom == "") {
|
|
|
|
|
|
|
|
geom.push(res.data.point[0].geom);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (res.dcount != 0) {
|
|
|
|
|
|
|
|
for (i = 1; i <= res.dcount; i++) {
|
|
|
|
|
|
|
|
var b = { id: "D" + i, name: "达标区" + i, type: "dbq", geom: res.data.dbq[i - 1].geom };
|
|
|
|
|
|
|
|
title.push(b);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (geom == "") {
|
|
|
|
|
|
|
|
geom.push(res.data.dbq[0].geom);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (res.ljcount != 0) {
|
|
|
|
|
|
|
|
for (i = 1; i <= res.ljcount; i++) {
|
|
|
|
|
|
|
|
var b = { id: "J" + i, name: "立交泵站" + i, type: "lj", geom: res.data.ljbz[i - 1].geom };
|
|
|
|
|
|
|
|
title.push(b);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (geom == "") {
|
|
|
|
|
|
|
|
geom.push(res.data.ljbz[0].geom);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (res.xcount != 0) {
|
|
|
|
|
|
|
|
for (i = 1; i <= res.xcount; i++) {
|
|
|
|
|
|
|
|
var b = { id: "X" + i, name: "巡查养护" + i, type: "xcyh", geom: res.data.xcyh[i - 1].geom };
|
|
|
|
|
|
|
|
title.push(b);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (geom == "") {
|
|
|
|
|
|
|
|
geom.push(res.data.xcyh[0].geom);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (geom != "") {
|
|
|
|
|
|
|
|
///绘制
|
|
|
|
|
|
|
|
MapShowClick(geom, false)
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
var ndata = {
|
|
|
|
|
|
|
|
"title": title,
|
|
|
|
|
|
|
|
"line": res.data.line,
|
|
|
|
|
|
|
|
"point": res.data.point,
|
|
|
|
|
|
|
|
"dbq": res.data.dbq,
|
|
|
|
|
|
|
|
"ljbz": res.data.ljbz,
|
|
|
|
|
|
|
|
"xcyh": res.data.xcyh,
|
|
|
|
|
|
|
|
"count": res.count
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
console.log(ndata);
|
|
|
|
|
|
|
|
app.tabShow(ndata)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else if (ClickMap == 1) { //点击获取坐标
|
|
|
|
|
|
|
|
var pit = "Point(" + coordinate[0] + " " + coordinate[1] + ")";
|
|
|
|
|
|
|
|
MapShowClick([pit], false);
|
|
|
|
|
|
|
|
vectorLayer1.getSource().clear();
|
|
|
|
|
|
|
|
var center = [coordinate[0], coordinate[1]];
|
|
|
|
|
|
|
|
addVectorLabel(center, "坐标：" + coordinate[0] + "," + coordinate[1]);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else if (ClickMap == 2) { //测量情况
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else if (ClickMap == 3) { //空间查询
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (drawtype == "Circle") {
|
|
|
|
|
|
|
|
var len = vector.getSource().getFeatures().length;
|
|
|
|
|
|
|
|
if (len > 0) {
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
if (geomtype == "circle") {
|
|
|
|
|
|
|
|
var a = vector.getSource().getFeatures()[len - 1].getGeometry();
|
|
|
|
|
|
|
|
console.log(a);
|
|
|
|
|
|
|
|
geom = a.getCenter();
|
|
|
|
|
|
|
|
radiusdraw = a.getRadius();
|
|
|
|
|
|
|
|
var showlength = "半径：" + (radiusdraw / 0.0000089932).toFixed(2) + "m";
|
|
|
|
|
|
|
|
// showtext = "半径：" + radiusdraw + "m";
|
|
|
|
|
|
|
|
addVectorLabel(geom, showlength);
|
|
|
|
|
|
|
|
geomdraw = GetPolygon(geom)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log(geomdraw, radiusdraw)
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
var a = vector.getSource().getFeatures()[len - 1].getGeometry();
|
|
|
|
|
|
|
|
geomdraw = GetPolygon(a.A)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//if (geomdraw != "") {
|
|
|
|
|
|
|
|
// app.kjSearch();
|
|
|
|
|
|
|
|
// app.kjCensus();
|
|
|
|
|
|
|
|
//}
|
|
|
|
|
|
|
|
ClickMap = 0;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} else if (drawtype == "Polygon") {
|
|
|
|
|
|
|
|
var len = vector.getSource().getFeatures().length;
|
|
|
|
|
|
|
|
if (len > 0) {
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
var a = vector.getSource().getFeatures()[len - 1].getGeometry();
|
|
|
|
|
|
|
|
geomdraw = GetPolygon(a.A)
|
|
|
|
|
|
|
|
ClickMap = 0;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
ZJMAP.on('dblclick', function (evt) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (ClickMap == 0) {
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
/* modify.setActive(false);*/
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else if (ClickMap == 2) {
|
|
|
|
|
|
|
|
var points = evt.coordinate;
|
|
|
|
|
|
|
|
var center = [points[0], points[1]];
|
|
|
|
|
|
|
|
var showtext;
|
|
|
|
|
|
|
|
var len = vector.getSource().getFeatures().length;
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
if (drawtype == "LineString") {
|
|
|
|
|
|
|
|
if (vector.getSource().getFeatures()[len - 1].getGeometry().getLength()) {
|
|
|
|
|
|
|
|
showtext = vector.getSource().getFeatures()[len - 1].getGeometry().getLength();
|
|
|
|
|
|
|
|
showtext = showtext / 0.0000089932;
|
|
|
|
|
|
|
|
var showtextsp = showtext.toString().split(".");
|
|
|
|
|
|
|
|
showtext = showtextsp[0];
|
|
|
|
|
|
|
|
showtext += "m";
|
|
|
|
|
|
|
|
addVectorLabel(center, showtext);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
} else if (drawtype == "Polygon") {
|
|
|
|
|
|
|
|
if (vector.getSource().getFeatures()[len - 1].getGeometry().getArea()) {
|
|
|
|
|
|
|
|
showtext = vector.getSource().getFeatures()[len - 1].getGeometry().getArea();
|
|
|
|
|
|
|
|
console.log(showtext);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
showtext = showtext / (0.0000089932 * 0.0000089932 );
|
|
|
|
|
|
|
|
showtext = showtext.toFixed(2);
|
|
|
|
|
|
|
|
showtext += "㎡";
|
|
|
|
|
|
|
|
addVectorLabel(center, showtext);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
ClickMap = 0;
|
|
|
|
|
|
|
|
} else if (ClickMap == 3) {
|
|
|
|
|
|
|
|
if (drawtype == "Polygon") {
|
|
|
|
|
|
|
|
var len = vector.getSource().getFeatures().length;
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
var a = vector.getSource().getFeatures()[len - 1].getGeometry();
|
|
|
|
|
|
|
|
geomdraw = GetPolygon(a.A)
|
|
|
|
|
|
|
|
//if (geomdraw != "") {
|
|
|
|
|
|
|
|
// app.kjSearch();
|
|
|
|
|
|
|
|
// app.kjCensus();
|
|
|
|
|
|
|
|
//}
|
|
|
|
|
|
|
|
ClickMap = 0;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
////////////////////////////////////
|
|
|
|
|
|
|
|
//加载图层
|
|
|
|
|
|
|
|
function ShowLayers() {
|
|
|
|
|
|
|
|
//var a = [120, 31];
|
|
|
|
|
|
|
|
//a = ol.proj.fromLonLat(a, "EPSG:4490")
|
|
|
|
|
|
|
|
//console.log(a);
|
|
|
|
|
|
|
|
for (i = 0; i < CONFIGS.length; i++) {
|
|
|
|
|
|
|
|
var result = CONFIGS[i];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (result.layerType == "TD地图") {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var layer = new ol.layer.Tile({
|
|
|
|
|
|
|
|
title: result.title,
|
|
|
|
|
|
|
|
id: result.id,
|
|
|
|
|
|
|
|
type: result.type,
|
|
|
|
|
|
|
|
visible: result.visible,
|
|
|
|
|
|
|
|
layerType: result.layerType,
|
|
|
|
|
|
|
|
opacity: result.opacity,
|
|
|
|
|
|
|
|
source: new ol.source.XYZ({
|
|
|
|
|
|
|
|
crossOrigin: 'anonymous',
|
|
|
|
|
|
|
|
url: result.url,
|
|
|
|
|
|
|
|
// projection: result.projection
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
ZJMAP.addLayer(layer);
|
|
|
|
|
|
|
|
///tile/6/33543/47426
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
if (result.layerType == "GIS地图") {
|
|
|
|
|
|
|
|
var projection = ol.proj.get(result.projection);
|
|
|
|
|
|
|
|
var origin = [-400.0, 399.9999999999998];
|
|
|
|
|
|
|
|
var resolutions = [0.0027465820824835565,0.0013732910412417782,6.866455206208891E-4,3.4332276031044456E-4,1.7166138015522228E-4,8.583069007761114E-5,4.291534503880557E-5,2.1457672519402785E-5,1.0728836259701392E-5];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var fullExtent = [118.63622216442072, 30.12564516975147, 122.81217622965288, 32.74305227616479];
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var tileGrid = new ol.tilegrid.TileGrid({
|
|
|
|
|
|
|
|
tileSize: 256,
|
|
|
|
|
|
|
|
origin: origin,
|
|
|
|
|
|
|
|
extent: fullExtent,
|
|
|
|
|
|
|
|
resolutions: resolutions
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var layer = new ol.layer.Tile({
|
|
|
|
|
|
|
|
title: result.title,
|
|
|
|
|
|
|
|
id: result.id,
|
|
|
|
|
|
|
|
type: result.type,
|
|
|
|
|
|
|
|
visible: result.visible,
|
|
|
|
|
|
|
|
layerType: result.layerType,
|
|
|
|
|
|
|
|
opacity: result.opacity,
|
|
|
|
|
|
|
|
source: new ol.source.XYZ({
|
|
|
|
|
|
|
|
tileGrid: tileGrid,
|
|
|
|
|
|
|
|
url: result.url,
|
|
|
|
|
|
|
|
projection: projection
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
ZJMAP.addLayer(layer);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
///tile/6/33543/47426
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else {
|
|
|
|
|
|
|
|
var layer = new ol.layer.Tile({
|
|
|
|
|
|
|
|
title: result.title,
|
|
|
|
|
|
|
|
id: result.id,
|
|
|
|
|
|
|
|
type: result.type,
|
|
|
|
|
|
|
|
visible: result.visible,
|
|
|
|
|
|
|
|
layerType: result.layerType,
|
|
|
|
|
|
|
|
opacity: result.opacity,
|
|
|
|
|
|
|
|
source: new ol.source.TileArcGISRest({
|
|
|
|
|
|
|
|
url: result.url,
|
|
|
|
|
|
|
|
projection: result.projection
|
|
|
|
|
|
|
|
}),
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
ZJMAP.addLayer(layer);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//选择取消图层
|
|
|
|
|
|
|
|
function checkLayers(id, bool) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var layers = ZJMAP.getLayers().getArray();
|
|
|
|
|
|
|
|
for (i = 0; i < layers.length; i++) {
|
|
|
|
|
|
|
|
if (layers[i].get("id") == id) {
|
|
|
|
|
|
|
|
if (bool) {
|
|
|
|
|
|
|
|
layers[i].setVisible(true);
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
layers[i].setVisible(false);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//基本信息查询展示 ，
|
|
|
|
|
|
|
|
function MapSearchShow(data, bool) {
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().clear();
|
|
|
|
|
|
|
|
var features = [];
|
|
|
|
|
|
|
|
var format = new ol.format.WKT();
|
|
|
|
|
|
|
|
for (i = 0; i < data.length; i++) {
|
|
|
|
|
|
|
|
var feature = format.readFeature(data[i].geom, {});
|
|
|
|
|
|
|
|
features.push(feature);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().addFeatures(features);
|
|
|
|
|
|
|
|
if (bool) {
|
|
|
|
|
|
|
|
var extent = vectorLayer.getSource().getSource().getExtent();
|
|
|
|
|
|
|
|
ZJMAP.getView().fit(extent, {
|
|
|
|
|
|
|
|
duration: 1,
|
|
|
|
|
|
|
|
callback: null
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//空间查询展示
|
|
|
|
|
|
|
|
function MapSearchShow2(data, bool) {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var features = [];
|
|
|
|
|
|
|
|
var format = new ol.format.WKT();
|
|
|
|
|
|
|
|
for (i = 0; i < data.length; i++) {
|
|
|
|
|
|
|
|
var feature = format.readFeature(data[i].geom, {});
|
|
|
|
|
|
|
|
features.push(feature);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().addFeatures(features);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function MapSearchShow3(data, bool) {
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().clear();
|
|
|
|
|
|
|
|
vectorLayer3.getSource().getSource().clear();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
console.log(data);
|
|
|
|
|
|
|
|
var features = [];
|
|
|
|
|
|
|
|
var rfeatures = [];
|
|
|
|
|
|
|
|
var format = new ol.format.WKT();
|
|
|
|
|
|
|
|
for (i = 0; i < data.length; i++) {
|
|
|
|
|
|
|
|
var feature = format.readFeature(data[i].geom, {});
|
|
|
|
|
|
|
|
if (data[i].layers == "road") {
|
|
|
|
|
|
|
|
features.push(feature);
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
rfeatures.push(feature);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().addFeatures(rfeatures);
|
|
|
|
|
|
|
|
vectorLayer3.getSource().getSource().addFeatures(features);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (bool) {
|
|
|
|
|
|
|
|
var extent = vectorLayer3.getSource().getSource().getExtent();
|
|
|
|
|
|
|
|
ZJMAP.getView().fit(extent, {
|
|
|
|
|
|
|
|
duration: 1,
|
|
|
|
|
|
|
|
callback: null
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//点击定位
|
|
|
|
|
|
|
|
function MapShowClick(geom, bool) {
|
|
|
|
|
|
|
|
vectorLayer2.getSource().getSource().clear();
|
|
|
|
|
|
|
|
var features = [];
|
|
|
|
|
|
|
|
var format = new ol.format.WKT();
|
|
|
|
|
|
|
|
for (i = 0; i < geom.length; i++) {
|
|
|
|
|
|
|
|
var feature = format.readFeature(geom[i], {});
|
|
|
|
|
|
|
|
features.push(feature);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
vectorLayer2.getSource().getSource().addFeatures(features);
|
|
|
|
|
|
|
|
if (bool) {
|
|
|
|
|
|
|
|
var extent = vectorLayer2.getSource().getSource().getExtent();
|
|
|
|
|
|
|
|
ZJMAP.getView().fit(extent, {
|
|
|
|
|
|
|
|
duration: 1,
|
|
|
|
|
|
|
|
callback: null
|
|
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//获取Polygon
|
|
|
|
|
|
|
|
function GetPolygon(points) {
|
|
|
|
|
|
|
|
var polygon = "";
|
|
|
|
|
|
|
|
for (i = 0; i < points.length; i++) {
|
|
|
|
|
|
|
|
var poly = points[i];
|
|
|
|
|
|
|
|
if (i == 0) {
|
|
|
|
|
|
|
|
polygon += poly + " ";
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
if (i % 2 == 0) {
|
|
|
|
|
|
|
|
//双数
|
|
|
|
|
|
|
|
polygon += poly + " ";
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
polygon += poly + ","
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
polygon = polygon.substring(0, polygon.length - 1);
|
|
|
|
|
|
|
|
return polygon;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//空间查询-绘制双击结束
|
|
|
|
|
|
|
|
function addInteraction(value, id, type) {
|
|
|
|
|
|
|
|
if (draw) {
|
|
|
|
|
|
|
|
vectorLayer1.getSource().clear();
|
|
|
|
|
|
|
|
drawtype = "";
|
|
|
|
|
|
|
|
geomtype = "";
|
|
|
|
|
|
|
|
source = null;
|
|
|
|
|
|
|
|
//设置矢量图层的数据源为空
|
|
|
|
|
|
|
|
vector.setSource(source);
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
//获取当前选择的绘图类型
|
|
|
|
|
|
|
|
//如果当前选择的绘图类型不为"None"的话，则进行相应绘图操作
|
|
|
|
|
|
|
|
//如果当前选择的绘图类型为"None"的话，则清空矢量数据源
|
|
|
|
|
|
|
|
if (value !== 'None') {
|
|
|
|
|
|
|
|
if (id == 2) {
|
|
|
|
|
|
|
|
ClickMap = 2;
|
|
|
|
|
|
|
|
drawtype = value;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
else if (id == 3) {
|
|
|
|
|
|
|
|
ClickMap = 3;
|
|
|
|
|
|
|
|
drawtype = value;
|
|
|
|
|
|
|
|
geomtype = type;
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
ClickMap = 0;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//如果当前的矢量数据源为空的话，则重新创建和设置数据源
|
|
|
|
|
|
|
|
//因为当你选择的绘图类型为"None"时，会清空数据源
|
|
|
|
|
|
|
|
if (source == null) {
|
|
|
|
|
|
|
|
source = new ol.source.Vector({ wrapX: false });
|
|
|
|
|
|
|
|
vector.setSource(source);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (geomtype == "box") {
|
|
|
|
|
|
|
|
//将交互绘图对象赋给draw对象
|
|
|
|
|
|
|
|
//初始化交互绘图对象
|
|
|
|
|
|
|
|
draw = new ol.interaction.Draw({
|
|
|
|
|
|
|
|
//数据源
|
|
|
|
|
|
|
|
source: source,
|
|
|
|
|
|
|
|
//绘制类型
|
|
|
|
|
|
|
|
type: value,
|
|
|
|
|
|
|
|
geometryFunction: ol.interaction.Draw.createBox()
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
draw = new ol.interaction.Draw({
|
|
|
|
|
|
|
|
//数据源
|
|
|
|
|
|
|
|
source: source,
|
|
|
|
|
|
|
|
//绘制类型
|
|
|
|
|
|
|
|
type: value,
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
//将draw对象添加到map中，然后就可以进行图形绘制了
|
|
|
|
|
|
|
|
ZJMAP.addInteraction(draw);
|
|
|
|
|
|
|
|
} else {
|
|
|
|
|
|
|
|
//清空矢量数据源
|
|
|
|
|
|
|
|
source = null;
|
|
|
|
|
|
|
|
//设置矢量图层的数据源为空
|
|
|
|
|
|
|
|
vector.setSource(source);
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//清空图层
|
|
|
|
|
|
|
|
function clearmap() {
|
|
|
|
|
|
|
|
ClickMap = 0;
|
|
|
|
|
|
|
|
if (draw) {
|
|
|
|
|
|
|
|
drawtype = "";
|
|
|
|
|
|
|
|
geomtype = "";
|
|
|
|
|
|
|
|
geomdraw = "";
|
|
|
|
|
|
|
|
source = null;
|
|
|
|
|
|
|
|
//设置矢量图层的数据源为空
|
|
|
|
|
|
|
|
vector.setSource(source);
|
|
|
|
|
|
|
|
ZJMAP.removeInteraction(draw);
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
vectorLayer1.getSource().clear();
|
|
|
|
|
|
|
|
vectorLayer.getSource().getSource().clear();
|
|
|
|
|
|
|
|
vectorLayer2.getSource().getSource().clear();
|
|
|
|
|
|
|
|
vectorLayer3.getSource().getSource().clear();
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
