| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879 |
- <!--********************************************************************
- * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
- *********************************************************************-->
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title data-i18n="resources.title_measureDistance"></title>
- </head>
- <body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
- <div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
- <script type="text/javascript" include="bootstrap,jquery,widgets.alert" src="../js/include-web.js"></script>
- <script type="text/javascript" include="draw" src="../../dist/mapboxgl/include-mapboxgl.js"></script>
- <script type="text/javascript">
- var host = window.isLocal ? window.server : "https://iserver.supermap.io";
- var url = host + "/iserver/services/map-world/rest/maps/World";
- var attribution = "<a href='https://www.mapbox.com/about/maps/' target='_blank'>© Mapbox </a>" +
- "with <span>© <a href='https://iclient.supermap.io' target='_blank'>SuperMap iClient</a> | </span>" +
- " Map Data <span>© <a href='http://support.supermap.com.cn/product/iServer.aspx' target='_blank'>SuperMap iServer</a></span> ";
- var map = new mapboxgl.Map({
- container: 'map',
- style: {
- "version": 8,
- "sources": {
- "raster-tiles": {
- "attribution": attribution,
- "type": "raster",
- "tiles": [host + '/iserver/services/maps/rest/maps/World/zxyTileImage.png?prjCoordSys='+encodeURIComponent('{"epsgCode":3857}')+'&z={z}&x={x}&y={y}'],
- "tileSize": 256,
- },
- },
- "layers": [{
- "id": "simple-tiles",
- "type": "raster",
- "source": "raster-tiles",
- "minzoom": 0,
- "maxzoom": 22
- }],
- },
- center: [0, 0],
- maxZoom: 18,
- zoom: 3
- });
- map.addControl(new mapboxgl.supermap.LogoControl(), 'bottom-right');
- map.addControl(new mapboxgl.NavigationControl(), 'top-left');
- var draw = new MapboxDraw({
- displayControlsDefault: false,
- controls: {
- line_string: true,
- trash: true
- }
- });
- map.addControl(draw, "top-left");
- function measureDistance(e) {
- if (!e.features) {
- widgets.alert.showAlert(resources.msg_noDataRedraw, false);
- }
- var param = new SuperMap.MeasureParameters(e.features[0]);
- new mapboxgl.supermap.MeasureService(url).measureDistance(param, function (serviceResult) {
- var distance = serviceResult.result.distance;
- widgets.alert.showAlert(distance + resources.msg_m, true);
- });
- }
- function removeMsg() {
- $('#msg_container').remove();
- }
- map.on('draw.create', measureDistance);
- map.on('draw.delete', removeMsg);
- </script>
- </body>
- </html>
|
