zhangzl
/
nsgk_web
1
0
複製 0
程式碼 問題 0 合併請求 0 版本發佈 0 Wiki 活動
瀏覽代碼

信息港宅基地地图开发

RongCheng
QI_YUJIE 2 年之前
父節點
bc82fdb43b
當前提交
34acab8b6c
共有 3 個檔案被更改，包括 122 行新增 和 31 行删除
統一視圖
Diff Options
Show Stats Download Patch File Download Diff File
  1. +2
    -6
      infoport/homestead.html
  2. +108
    -11
      infoport/static/js/project/homestead.js
  3. +12
    -14
      infoport/static/js/project/resource.js

+ 2
- 6
infoport/homestead.html 查看文件

@@ -13,7 +13,8 @@
<link href="static/css/index.css" rel="stylesheet" type="text/css" /> <link href="static/css/index.css" rel="stylesheet" type="text/css" />
<link href="static/css/property.css" rel="stylesheet" type="text/css" /> <link href="static/css/property.css" rel="stylesheet" type="text/css" />
<link href="static/css/page_common.css" rel="stylesheet" type="text/css" /> <link href="static/css/page_common.css" rel="stylesheet" type="text/css" />
<script src="https://api.map.baidu.com/api?type=webgl&v=1.0&ak=XzwOBaO4CElCsPdl8LIFEvv5rTemG6w1"></script>
<link href="../static/css/ol/ol.css" rel="stylesheet" type="text/css" />
<script src="../static/js/common/ol.js"></script>
</head> </head>


<body> <body>
@@ -125,11 +126,6 @@
<div style="box-shadow: 0px 5px 20px #999 inset;width: 100%;height: 16vh;"> <div style="box-shadow: 0px 5px 20px #999 inset;width: 100%;height: 16vh;">
<div id="container"></div> <div id="container"></div>
</div> </div>
<script>
var map = new BMapGL.Map('container'); // 创建Map实例
map.centerAndZoom(new BMapGL.Point(116.320938,39.950026), 18); // 初始化地图,设置中心点坐标和地图级别
map.enableScrollWheelZoom(false); // 开启鼠标滚轮缩放
</script>
</div> </div>


<div class="dialog" id="dialog" style="display: none;"> <div class="dialog" id="dialog" style="display: none;">


+ 108
- 11
infoport/static/js/project/homestead.js 查看文件

@@ -19,22 +19,14 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
dictValue:'', dictValue:'',
dictLabel:'全部' dictLabel:'全部'
}], }],
propertyDetail:{}
propertyDetail:{},
map: '', // 地图图层
homesteadLayer: '', // 宅基地图层
}, },
}; };
var tools = new Tools(); var tools = new Tools();


module.init = function (page) { module.init = function (page) {
//资产列表
tools.doGet(zjdzdxxList, {
deptId: 100,
translate_dict: 1,
houseOwnership:1,
pageNum: 1,
pageSize: 10,
}, module.assetList , true);

tools.doGet(treeselectSecond+'100', {}, module.useContent, true);
tools.doGet(treeselect, {}, module.treeselect , true); tools.doGet(treeselect, {}, module.treeselect , true);
tools.doGet(webList, {}, module.webList , true); tools.doGet(webList, {}, module.webList , true);
// tools.doGet(webDeptType+'land_status', {}, module.webDeptType , true); // tools.doGet(webDeptType+'land_status', {}, module.webDeptType , true);
@@ -47,6 +39,8 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
module.data.leader = data.data.leader; module.data.leader = data.data.leader;
var propertyDetailData = template('propertyDetailData', module.data); var propertyDetailData = template('propertyDetailData', module.data);
$("#propertyDetailContent").html(propertyDetailData); $("#propertyDetailContent").html(propertyDetailData);
module.data.map.getView().setCenter(ol.proj.fromLonLat([data.data.lng, data.data.lat]));
module.data.map.getView().setZoom(13);
} }
} }


@@ -87,12 +81,53 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
}) })
} }
module.data.propertyList = content; module.data.propertyList = content;
// 添加宅基地图层
addHomesteadLayer(content);
// $('#page_s1').html('共' + 10 + '页') // $('#page_s1').html('共' + 10 + '页')
var propertyData = template('propertyData', module.data); var propertyData = template('propertyData', module.data);
$("#propertyContent").html(propertyData); $("#propertyContent").html(propertyData);
} }
} }


// 添加宅基地图层
addHomesteadLayer = function (content) {
if (module.data.homesteadLayer) {
module.data.map.removeLayer(module.data.homesteadLayer);
module.data.homesteadLayer = '';
}
let features = [];
content.forEach(item => {
if (item.theGeomJson != null && item.theGeomJson !== '') {
const iconFeature = new ol.Feature({
geometry: new ol.geom.MultiPolygon(JSON.parse(item.theGeomJson).coordinates),
// name: item.centerName,
// centerDeptId: item.deptId,
level: 'homestead',
});
features.push(iconFeature);
}
});
const vectorSource = new ol.source.Vector({
features: features,
});
module.data.homesteadLayer = new ol.layer.Vector({
source: vectorSource,
name: 'homesteadLayer',
style: new ol.style.Style({
fill: new ol.style.Fill({
//矢量图层填充颜色，以及透明度
color: "rgba(22, 233, 15, 0.3)",
}),
stroke: new ol.style.Stroke({
//边界样式
color: "#16E90F",
width: 2,
}),
})
});
module.data.map.getLayers().insertAt(3, module.data.homesteadLayer);
}

openDialog = function(id){ openDialog = function(id){
tools.doGet(zjdzdxxGet+id, {translate_dict: 1}, module.assetDetail , true); tools.doGet(zjdzdxxGet+id, {translate_dict: 1}, module.assetDetail , true);
} }
@@ -143,9 +178,71 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
$("#treeselectContent").html(treeselectData); $("#treeselectContent").html(treeselectData);
var treeselectSecondData = template('treeselectSecondData', module.data); var treeselectSecondData = template('treeselectSecondData', module.data);
$("#treeselectSecondContent").html(treeselectSecondData); $("#treeselectSecondContent").html(treeselectSecondData);
initMap(data.data[0]);
//资产列表
tools.doGet(zjdzdxxList, {
deptId: 100,
translate_dict: 1,
houseOwnership:1,
pageNum: 1,
pageSize: 10,
}, module.assetList , true);
tools.doGet(treeselectSecond+'100', {}, module.useContent, true);
} }
} }


initMap = function (dept) {
let mapCenterLocation;
if (dept.lng && dept.lat) {
mapCenterLocation = [dept.lng, dept.lat];
} else {
mapCenterLocation = [116.391461, 39.902359];
}

document.getElementById("container").innerHTML = "";
// 定义地图投影
let projection = new ol.proj.Projection({
code: "EPSG:3857",
units: "degrees",
});
// 定义地图图层
let aerial = new ol.layer.Tile({
source: new ol.source.XYZ({
url: "http://t{0-7}.tianditu.com/img_w/wmts?" +
"SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles" +
"&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=cc4aba6e967096098249efa069733067",
}),
isGroup: true,
name: "卫星影像图",
});
let yingxzi = new ol.layer.Tile({
source: new ol.source.XYZ({
url: "http://t{0-7}.tianditu.com/DataServer?T=cia_w&x={x}&y={y}&l={z}&tk=cc4aba6e967096098249efa069733067",
}),
isGroup: true,
name: "天地图文字标注--卫星影像图",
});
//加载地图
module.data.map = new ol.Map({
controls: ol.control.defaults({attribution: false, zoom: false, rotate: false}).extend([new ol.control.FullScreen()]),
layers: [aerial, yingxzi],
projection: projection,
target: "container",
view: new ol.View({
center: ol.proj.fromLonLat(mapCenterLocation), // 地图中心坐标
zoom: 13,
minZoom: 1, //地图缩小限制
maxZoom: 18, //地图放大限制
// extent: [13481224.75161,5667110.83528,13811063.06278,5880284.11416]
}),
/*interactions: ol.interaction.defaults({
doubleClickZoom: false, // 双击放大地图
// mouseWheelZoom: false, // 鼠标滚轮放大地图
// shiftDragZoom: false, // shift + 鼠标左键拖拽 放大地图
})*/
});
}

selectChange = function(){ selectChange = function(){
// tools.doGet(treeselectSecond+$('#treeselectContent').val(), {}, module.selectSecondChange , true); // tools.doGet(treeselectSecond+$('#treeselectContent').val(), {}, module.selectSecondChange , true);
if ($('#treeselectContent').val() == 100){ if ($('#treeselectContent').val() == 100){


+ 12
- 14
infoport/static/js/project/resource.js 查看文件

@@ -20,22 +20,12 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
}], }],
propertyDetail:{}, propertyDetail:{},
map: '', // 地图图层 map: '', // 地图图层
resourceLayer: '', // 资产图层
resourceLayer: '', // 资源图层
}, },
}; };
var tools = new Tools(); var tools = new Tools();


module.init = function (page) { module.init = function (page) {
//资产列表
tools.doGet(resourceList, {
deptId: 187,
translate_dict: 1,
pageNum: 1,
pageSize: 10,
}, module.assetList , true);


tools.doGet(treeselectSecond+'100', {}, module.useContent, true);
tools.doGet(treeselect, {}, module.treeselect , true); tools.doGet(treeselect, {}, module.treeselect , true);
tools.doGet(webList, {}, module.webList , true); tools.doGet(webList, {}, module.webList , true);
// tools.doGet(webDeptType+'use_code', {}, module.webDeptType , true); // tools.doGet(webDeptType+'use_code', {}, module.webDeptType , true);
@@ -90,7 +80,7 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
}) })
} }
module.data.propertyList = content; module.data.propertyList = content;
// 添加资产图层
// 添加资源图层
addResourceLayer(content); addResourceLayer(content);
// $('#page_s1').html('共' + 10 + '页') // $('#page_s1').html('共' + 10 + '页')
var propertyData = template('propertyData', module.data); var propertyData = template('propertyData', module.data);
@@ -98,7 +88,7 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
} }
} }


// 添加资产图层
// 添加资源图层
addResourceLayer = function (content) { addResourceLayer = function (content) {
if (module.data.resourceLayer) { if (module.data.resourceLayer) {
module.data.map.removeLayer(module.data.resourceLayer); module.data.map.removeLayer(module.data.resourceLayer);
@@ -106,7 +96,7 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
} }
let features = []; let features = [];
content.forEach(item => { content.forEach(item => {
if (item.theGeom != null && item.theGeom !== '') {
if (item.theGeomJson != null && item.theGeomJson !== '') {
const iconFeature = new ol.Feature({ const iconFeature = new ol.Feature({
geometry: new ol.geom.MultiPolygon(JSON.parse(item.theGeomJson).coordinates), geometry: new ol.geom.MultiPolygon(JSON.parse(item.theGeomJson).coordinates),
// name: item.centerName, // name: item.centerName,
@@ -188,6 +178,14 @@ define(['jquery', "template", "Tools", "paging", 'dateTime', 'swiper'], function
var treeselectSecondData = template('treeselectSecondData', module.data); var treeselectSecondData = template('treeselectSecondData', module.data);
$("#treeselectSecondContent").html(treeselectSecondData); $("#treeselectSecondContent").html(treeselectSecondData);
initMap(data.data[0]); initMap(data.data[0]);
//资产列表
tools.doGet(resourceList, {
deptId: 100,
translate_dict: 1,
pageNum: 1,
pageSize: 10,
}, module.assetList , true);
tools.doGet(treeselectSecond+'100', {}, module.useContent, true);
} }
} }




Write Preview
Loading…
取消
儲存