mvtVectorTile_overlay.html 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <!--********************************************************************
  2. * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
  3. *********************************************************************-->
  4. <!DOCTYPE html>
  5. <html>
  6. <head>
  7. <meta charset='utf-8' />
  8. <title data-i18n="resources.title_mvtVectorLayer_overlay"></title>
  9. <meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' />
  10. <style>
  11. body {
  12. margin: 0;
  13. padding: 0;
  14. }
  15. #map {
  16. position: absolute;
  17. top: 0;
  18. bottom: 0;
  19. width: 100%;
  20. }
  21. </style>
  22. </head>
  23. <body>
  24. <div id='map'></div>
  25. <script type="text/javascript" include="jquery" src="../js/include-web.js"></script>
  26. <script type="text/javascript" include="mapbox-gl-enhance" src="../../dist/mapboxgl/include-mapboxgl.js"></script>
  27. <script type="text/javascript">
  28. var host = window.isLocal ? window.server : "https://iserver.supermap.io";
  29. var map = new mapboxgl.Map({
  30. container: 'map',
  31. style: host +
  32. '/iserver/services/map-mvt-China/rest/maps/China/tileFeature/vectorstyles.json?type=MapBox_GL&styleonly=true',
  33. center: [120.143, 30.236],
  34. zoom: 3,
  35. attributionControl: false
  36. });
  37. map.addControl(new mapboxgl.NavigationControl(), 'top-left');
  38. map.on('load', function () {
  39. //请使用mapboxgl增强版 https://iclient.supermap.io/web/libs/mapbox-gl-js-enhance/mapbox-gl-enhance.js
  40. map.addStyle(host +
  41. '/iserver/services/map-Population/rest/maps/PopulationDistribution/tileFeature/vectorstyles.json?type=MapBox_GL&styleonly=true'
  42. )
  43. })
  44. </script>
  45. </body>
  46. </html>