|
@@ -1118,107 +1118,114 @@ export default {
|
|
|
},
|
|
|
//路线绘制
|
|
|
goPointMark(item) {
|
|
|
- var center = item.cp;
|
|
|
+ var center = item.center;
|
|
|
var cp = item.cp;
|
|
|
if (this.markerLayer) {
|
|
|
this.map.removeLayer(this.markerLayer);
|
|
|
this.markerLayer = null;
|
|
|
}
|
|
|
if (center != "") {
|
|
|
- var centerList = center.split(",");
|
|
|
+ var centerList = cp.split(",");
|
|
|
+ var className = "point-end-icon";
|
|
|
+ var myIcon = L.divIcon({
|
|
|
+ className: className,
|
|
|
+ //图标大小
|
|
|
+ iconSize: [32, 32],
|
|
|
+ });
|
|
|
+
|
|
|
this.markerLayer = L.marker([centerList[1], centerList[0]], {
|
|
|
- icon: L.icon({
|
|
|
- iconUrl: "/assets/image/staticImage/icon-end.png", // 标点图标地址
|
|
|
- iconSize: [50, 50], // 图标大小
|
|
|
- }),
|
|
|
+ icon: myIcon
|
|
|
})
|
|
|
.addTo(this.map)
|
|
|
.bindPopup(item.name);
|
|
|
- if (this.dkGeo) {
|
|
|
- const bounds = L.latLngBounds();
|
|
|
- bounds.extend(this.dkGeo.getBounds());
|
|
|
- var pointLng = L.latLngBounds([[centerList[1], centerList[0]]]);
|
|
|
- bounds.extend(pointLng);
|
|
|
- // this.map.fitBounds(bounds);
|
|
|
- this.map.fitBounds(bounds, { padding: [10, 10] });
|
|
|
- if (this.zoom == 0) {
|
|
|
- this.zoom = this.map.getZoom();
|
|
|
- }
|
|
|
- } else {
|
|
|
- let query =
|
|
|
- window.ApplicationConfig.landUrl +
|
|
|
- "/0/query?where=id=" +
|
|
|
- this.activeItem.id +
|
|
|
- "&" +
|
|
|
- "geometryType=esriGeometryPoint&inSR=4490&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&" +
|
|
|
- "maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&" +
|
|
|
- "outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&f=json";
|
|
|
- axios.get(query).then((data) => {
|
|
|
- console.log(data);
|
|
|
- if (data.data.features.length < 1) {
|
|
|
- return;
|
|
|
- }
|
|
|
- this.land = data.data.features[0].attributes;
|
|
|
- var geojson = arcgisToGeoJSON(data.data.features[0].geometry);
|
|
|
- var geos = L.geoJSON(geojson, {
|
|
|
- style: function (feature) {
|
|
|
- return { color: "#3BA5FF" };
|
|
|
- },
|
|
|
- });
|
|
|
- this.dkGeo = geos;
|
|
|
- this.dkGeoJson = geojson;
|
|
|
- const bounds = L.latLngBounds();
|
|
|
- bounds.extend(geos.getBounds());
|
|
|
-
|
|
|
- var pointLng = L.latLngBounds([[centerList[1], centerList[0]]]);
|
|
|
- bounds.extend(pointLng);
|
|
|
- this.map.fitBounds(bounds, { padding: [10, 10] });
|
|
|
- if (this.zoom == 0) {
|
|
|
- this.zoom = this.map.getZoom();
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
+ // if (this.dkGeo) {
|
|
|
+ // const bounds = L.latLngBounds();
|
|
|
+ // bounds.extend(this.dkGeo.getBounds());
|
|
|
+ // var pointLng = L.latLngBounds([[centerList[1], centerList[0]]]);
|
|
|
+ // bounds.extend(pointLng);
|
|
|
+ // // this.map.fitBounds(bounds);
|
|
|
+ // this.map.fitBounds(bounds, { padding: [10, 10] });
|
|
|
+ // if (this.zoom == 0) {
|
|
|
+ // this.zoom = this.map.getZoom();
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // let query =
|
|
|
+ // window.ApplicationConfig.landUrl +
|
|
|
+ // "/0/query?where=id=" +
|
|
|
+ // this.activeItem.id +
|
|
|
+ // "&" +
|
|
|
+ // "geometryType=esriGeometryPoint&inSR=4490&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&" +
|
|
|
+ // "maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&" +
|
|
|
+ // "outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&f=json";
|
|
|
+ // axios.get(query).then((data) => {
|
|
|
+ // console.log(data);
|
|
|
+ // if (data.data.features.length < 1) {
|
|
|
+ // return;
|
|
|
+ // }
|
|
|
+ // this.land = data.data.features[0].attributes;
|
|
|
+ // var geojson = arcgisToGeoJSON(data.data.features[0].geometry);
|
|
|
+ // var geos = L.geoJSON(geojson, {
|
|
|
+ // style: function (feature) {
|
|
|
+ // return { color: "#3BA5FF" };
|
|
|
+ // },
|
|
|
+ // });
|
|
|
+ // this.dkGeo = geos;
|
|
|
+ // this.dkGeoJson = geojson;
|
|
|
+ // const bounds = L.latLngBounds();
|
|
|
+ // bounds.extend(geos.getBounds());
|
|
|
+
|
|
|
+ // var pointLng = L.latLngBounds([[centerList[1], centerList[0]]]);
|
|
|
+ // bounds.extend(pointLng);
|
|
|
+ // this.map.fitBounds(bounds, { padding: [10, 10] });
|
|
|
+ // if (this.zoom == 0) {
|
|
|
+ // this.zoom = this.map.getZoom();
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+ // }
|
|
|
}
|
|
|
//路线
|
|
|
- var token = window.ApplicationConfig.tk;
|
|
|
- let that = this;
|
|
|
- // var token = "6dfd31e3b55a8466f34997aee5551a9c";
|
|
|
- var routerUrl = window.ApplicationConfig.routeUrl;
|
|
|
- var url = `${routerUrl}{"orig":"${center}","dest":"${cp}","style":"1"}&type=search&tk=${token}`;
|
|
|
- axios.get(url).then((res) => {
|
|
|
- if (res.data) {
|
|
|
- if (that.polyline) {
|
|
|
- that.map.removeLayer(that.polyline);
|
|
|
- }
|
|
|
- var data = res.data
|
|
|
- .substring(
|
|
|
- res.data.indexOf("<routelatlon>") + 13,
|
|
|
- res.data.indexOf("</routelatlon>")
|
|
|
- )
|
|
|
- .split(";");
|
|
|
- data = data.slice(0, data.length - 1);
|
|
|
- var latlngs = [];
|
|
|
- data.forEach((item) => {
|
|
|
- var i = item.split(",").reverse();
|
|
|
- latlngs.push(i);
|
|
|
- });
|
|
|
- that.polyline = L.polyline(latlngs, { color: "red" }).addTo(that.map);
|
|
|
- // that.map.fitBounds(that.polyline.getBounds());
|
|
|
- if (latlngs.length >= 20) {
|
|
|
- if (item.unit == "km" && item.distance >= 1.7) {
|
|
|
- that.map.setZoom(that.zoom - 3);
|
|
|
- if (latlngs.length >= 30) {
|
|
|
- that.map.setZoom(that.zoom - 4);
|
|
|
- }
|
|
|
- } else {
|
|
|
- that.map.setZoom(that.zoom - 2);
|
|
|
- }
|
|
|
- } else {
|
|
|
- that.map.setZoom(that.zoom - 1);
|
|
|
- }
|
|
|
- that.$refs.znxz.showDistance(item);
|
|
|
- }
|
|
|
- });
|
|
|
+ // var token = window.ApplicationConfig.tk;
|
|
|
+ // let that = this;
|
|
|
+ // // var token = "6dfd31e3b55a8466f34997aee5551a9c";
|
|
|
+ // var routerUrl = window.ApplicationConfig.routeUrl;
|
|
|
+ // console.log(routerUrl);
|
|
|
+ // var url = `${routerUrl}{"orig":"${center}","dest":"${cp}","style":"1"}&type=search&tk=${token}`;
|
|
|
+ // axios.get(url).then((res) => {
|
|
|
+ // if (res.data) {
|
|
|
+ // if (that.polyline) {
|
|
|
+ // that.map.removeLayer(that.polyline);
|
|
|
+ // }
|
|
|
+ // var data = res.data
|
|
|
+ // .substring(
|
|
|
+ // res.data.indexOf("<routelatlon>") + 13,
|
|
|
+ // res.data.indexOf("</routelatlon>")
|
|
|
+ // )
|
|
|
+ // .split(";");
|
|
|
+ // data = data.slice(0, data.length - 1);
|
|
|
+ // var latlngs = [];
|
|
|
+ // data.forEach((item) => {
|
|
|
+ // var i = item.split(",").reverse();
|
|
|
+ // latlngs.push(i);
|
|
|
+ // });
|
|
|
+ // that.polyline = L.polyline(latlngs, { color: "red" }).addTo(that.map);
|
|
|
+ // // that.map.fitBounds(that.polyline.getBounds());
|
|
|
+ // if (latlngs.length >= 20) {
|
|
|
+ // if (item.unit == "km" && item.distance >= 1.7) {
|
|
|
+ // that.map.setZoom(that.zoom - 3);
|
|
|
+ // if (latlngs.length >= 30) {
|
|
|
+ // that.map.setZoom(that.zoom - 4);
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // that.map.setZoom(that.zoom - 2);
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // that.map.setZoom(that.zoom - 1);
|
|
|
+ // }
|
|
|
+ // that.$refs.znxz.showDistance(item);
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+
|
|
|
+
|
|
|
},
|
|
|
//所有地块仿百度地图绘制
|
|
|
showXgdkCenterPoint() {
|
|
@@ -2525,6 +2532,19 @@ export default {
|
|
|
</style>
|
|
|
|
|
|
<style>
|
|
|
+.point-end-icon {
|
|
|
+ width: 36px !important;
|
|
|
+ height: 42px !important;
|
|
|
+ text-align: center !important;
|
|
|
+ font-size: 14px;
|
|
|
+ padding-top: 8px;
|
|
|
+ color: white;
|
|
|
+ font-weight: 400;
|
|
|
+ cursor: pointer;
|
|
|
+ background: url("~@/assets/image/staticImage/icon-end.png");
|
|
|
+ background-size: cover;
|
|
|
+}
|
|
|
+
|
|
|
.point-div-icon {
|
|
|
/*width: 36px !important;
|
|
|
height: 52px !important; */
|