|
|
@@ -0,0 +1,63 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<!--<html lang="en" xmlns:th="http://www.thymeleaf.org">-->
|
|
|
+<html xmlns:th="http://www.w3.org/1999/xhtml">
|
|
|
+<head>
|
|
|
+ <meta charset="UTF-8">
|
|
|
+ <title data-i18n="resources.title_measureDistance"></title>
|
|
|
+ <script th:src="@{/visualization/superMap/examples/js/include-web.js}"></script>
|
|
|
+</head>
|
|
|
+<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
|
|
|
+
|
|
|
+
|
|
|
+<button onclick="addMark()">打点</button>
|
|
|
+<button onclick="offMark()">关闭</button>
|
|
|
+<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
|
|
|
+<script type="text/javascript" src="../../dist/leaflet/include-leaflet.js"></script>
|
|
|
+<script type="text/javascript">
|
|
|
+ var host = "http://218.27.1.157:8090";
|
|
|
+ var map, resultLayer,
|
|
|
+ url = "http://218.27.1.157:8090/iserver/services/map-SiPingLinYe4326/rest/maps/1%E6%9E%97%E5%9C%BA%E5%BD%B1%E5%83%8F";
|
|
|
+ map = L.map('map', {
|
|
|
+ preferCanvas: true,
|
|
|
+ crs: L.CRS.EPSG4326,
|
|
|
+ center: [43.15, 124.78],
|
|
|
+ maxZoom: 10,
|
|
|
+ zoom: 10
|
|
|
+ });
|
|
|
+ L.supermap.tiledMapLayer(url).addTo(map);
|
|
|
+ resultLayer = L.featureGroup().addTo(map);
|
|
|
+ measureDistance();
|
|
|
+
|
|
|
+
|
|
|
+ function addMark() {
|
|
|
+ map.on("click",addMarkSuccess)
|
|
|
+ }
|
|
|
+ function offMark() {
|
|
|
+ map.off("click");
|
|
|
+ }
|
|
|
+ function addMarkSuccess(e) {
|
|
|
+ console.log(e.latlng.lat,e.latlng.lng)
|
|
|
+ var marker = L.marker([e.latlng.lat,e.latlng.lng]);
|
|
|
+ resultLayer.addLayer(marker);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ function measureDistance() {
|
|
|
+ var polyLine = L.polyline([ [43.15,124.78], [43.15,124.79] ], {color: "red"});
|
|
|
+ var marker1 = L.marker([43.15,124.78]);
|
|
|
+ var marker2 = L.marker([43.15,124.79]);
|
|
|
+ resultLayer.addLayer(polyLine);
|
|
|
+ resultLayer.addLayer(marker1);
|
|
|
+ resultLayer.addLayer(marker2);
|
|
|
+ var distanceMeasureParam = new SuperMap.MeasureParameters(polyLine);
|
|
|
+ L.supermap
|
|
|
+ .measureService(url)
|
|
|
+ .measureDistance(distanceMeasureParam, function (serviceResult) {
|
|
|
+ var content = resources.text_distance + "：" + serviceResult.result.distance + resources.msg_m;
|
|
|
+ marker1.bindPopup(content).openPopup(marker1.getLatLng());
|
|
|
+ });
|
|
|
+ }
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
wangzhe