mapVLayerPolylineSimple.html 2.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
  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_mapVLayerPolylineSimple"></title>
  9. <script type="text/javascript" src="../js/include-web.js"></script>
  10. </head>
  11. <body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
  12. <div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
  13. <script type="text/javascript" include="mapv" src="../../dist/leaflet/include-leaflet.js"></script>
  14. <script type="text/javascript">
  15. var map = L.map('map', {
  16. center: [36.64, 108.15],
  17. zoom: 4,
  18. });
  19. var host = window.isLocal ? window.server : "https://iserver.supermap.io";
  20. var url = host + "/iserver/services/map-china400/rest/maps/ChinaDark";
  21. L.supermap.tiledMapLayer(url).addTo(map);
  22. loadData();
  23. //示例数据来源为百度MapV的加偏数据,iClient未做纠偏处理
  24. function loadData() {
  25. var randomCount = 1000;
  26. var data = [];
  27. var citys = [
  28. "北京", "天津", "上海", "重庆", "石家庄", "太原", "呼和浩特",
  29. "哈尔滨", "长春", "沈阳", "济南", "南京", "合肥", "杭州", "南昌",
  30. "福州", "郑州", "武汉", "长沙", "广州", "南宁", "西安", "银川",
  31. "兰州", "西宁", "乌鲁木齐", "成都", "贵阳", "昆明", "拉萨", "海口"
  32. ];
  33. //自定义数据
  34. while (randomCount--) {
  35. var cityCenter1 = mapv.utilCityCenter.getCenterByCityName(citys[parseInt(Math.random() * citys.length)]);
  36. var cityCenter2 = mapv.utilCityCenter.getCenterByCityName(citys[parseInt(Math.random() * citys.length)]);
  37. data.push({
  38. geometry: {
  39. type: 'LineString',
  40. coordinates: [
  41. [cityCenter1.lng - 1 + Math.random() * 1, cityCenter1.lat - 1 + Math.random() * 1],
  42. [cityCenter2.lng - 1 + Math.random() * 1, cityCenter2.lat - 1 + Math.random() * 1]
  43. ]
  44. },
  45. count: 30 * Math.random()
  46. });
  47. }
  48. var dataSet = new mapv.DataSet(data);
  49. var options = {
  50. strokeStyle: 'rgba(255, 250, 50, 0.3)',
  51. shadowColor: 'rgba(255, 250, 50, 1)',
  52. shadowBlur: 20,
  53. lineWidth: 0.7,
  54. draw: 'simple'
  55. };
  56. L.supermap.mapVLayer(dataSet, options).addTo(map);
  57. setTimeout(function () {
  58. map.openPopup(resources.text_iClient, map.getCenter());
  59. }, 1000)
  60. }
  61. </script>
  62. </body>
  63. </html>