|
|
@@ -0,0 +1,56 @@
|
|
|
+<!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>
|
|
|
+ <script type="text/javascript" th:src="@{/dist/ol/include-ol.js}"></script>
|
|
|
+</head>
|
|
|
+<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%; position: absolute;top: 0;">
|
|
|
+<div id="map" style="width: 100%;height:100%"></div>
|
|
|
+<script type="text/javascript">
|
|
|
+ var map, interaction, vectorLayer, feature,
|
|
|
+ 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 = new ol.Map({
|
|
|
+ target: 'map',
|
|
|
+ controls: ol.control.defaults({attributionOptions: {collapsed: false}})
|
|
|
+ .extend([new ol.supermap.control.Logo()]),
|
|
|
+ view: new ol.View({
|
|
|
+ center: [43.15, 124.78],
|
|
|
+ zoom: 10,
|
|
|
+ projection: 'EPSG:4326',
|
|
|
+ multiWorld: true
|
|
|
+ })
|
|
|
+ });
|
|
|
+ var layer = new ol.layer.Tile({
|
|
|
+ source: new ol.source.TileSuperMapRest({
|
|
|
+ url: url
|
|
|
+ }),
|
|
|
+ projection: 'EPSG:4326'
|
|
|
+ });
|
|
|
+ map.addLayer(layer);
|
|
|
+ var source = new ol.source.Vector({wrapX: false});
|
|
|
+ vectorLayer = new ol.layer.Vector({
|
|
|
+ source: source
|
|
|
+ });
|
|
|
+ map.addLayer(vectorLayer);
|
|
|
+ interaction = new ol.interaction.Draw({
|
|
|
+ source: source,
|
|
|
+ type: "Polygon",
|
|
|
+ });
|
|
|
+ interaction.on('drawstart', function (evt) {
|
|
|
+ feature = evt.feature;
|
|
|
+ });
|
|
|
+ interaction.on('drawend', function () {
|
|
|
+ var areaMeasureParam = new SuperMap.MeasureParameters(feature.getGeometry());
|
|
|
+ new ol.supermap.MeasureService(url).measureArea(areaMeasureParam, function (serviceResult) {
|
|
|
+ widgets.alert.showAlert(serviceResult.result.area + resources.msg_sqm, true);
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ map.addInteraction(interaction);
|
|
|
+
|
|
|
+</script>
|
|
|
+</body>
|
|
|
+</html>
|
s9th