05_findMTSPPathsService.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  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_findMTSPPathsServiceLogistics"></title>
  9. <script type="text/javascript" include="bootstrap-css" src="../js/include-web.js"></script>
  10. <script type="text/javascript" src="../../dist/ol/include-ol.js"></script>
  11. </head>
  12. <body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%; position: absolute;top: 0;">
  13. <div id="map" style="width: 100%;height:100%"></div>
  14. <script type="text/javascript">
  15. var map, options,
  16. baseUrl = (window.isLocal ? window.server : "https://iserver.supermap.io")+"/iserver/services/map-changchun/rest/maps/长春市区图",
  17. serviceUrl = (window.isLocal ? window.server : "https://iserver.supermap.io")+"/iserver/services/transportationanalyst-sample/rest/networkanalyst/RoadNet@Changchun";
  18. var extent = [48.4, -7668.25, 8958.85, -55.58];
  19. var projection = new ol.proj.Projection({
  20. code:'',
  21. extent: extent,
  22. units: 'm'
  23. });
  24. new ol.supermap.MapService(baseUrl).getMapInfo(function (serviceResult) {
  25. var mapJSONObj = serviceResult.result;
  26. map = new ol.Map({
  27. target: 'map',
  28. controls: ol.control.defaults({attributionOptions: {collapsed: false}})
  29. .extend([new ol.supermap.control.Logo()]),
  30. view: new ol.View({
  31. center: [5000, -3700],
  32. zoom: 2,
  33. projection: projection,
  34. multiWorld: true
  35. })
  36. });
  37. options = ol.source.TileSuperMapRest.optionsFromMapJSON(baseUrl, mapJSONObj);
  38. var layer = new ol.layer.Tile({
  39. source: new ol.source.TileSuperMapRest(options)
  40. });
  41. map.addLayer(layer);
  42. findMTSPPathsProcess();
  43. });
  44. function findMTSPPathsProcess() {
  45. //添加配送点
  46. var facilityPoint1 = new ol.geom.Point([6000, -5500]);
  47. var facilityPoint2 = new ol.geom.Point([5500, -2500]);
  48. var facilityPoint3 = new ol.geom.Point([2500, -3500]);
  49. var facilityFeature1 = new ol.Feature(facilityPoint1);
  50. var facilityFeature2 = new ol.Feature(facilityPoint2);
  51. var facilityFeature3 = new ol.Feature(facilityPoint3);
  52. var iconStyle_facility = new ol.style.Style({
  53. image: new ol.style.Icon(({
  54. src: '../img/marker-gold.png'
  55. }))
  56. });
  57. facilityFeature1.setStyle(iconStyle_facility);
  58. facilityFeature2.setStyle(iconStyle_facility);
  59. facilityFeature3.setStyle(iconStyle_facility);
  60. var facilitySource = new ol.source.Vector({
  61. features: [facilityFeature1, facilityFeature2, facilityFeature3]
  62. });
  63. var facilityLayer = new ol.layer.Vector({
  64. source: facilitySource
  65. });
  66. //添加配送目的地
  67. var destPoint1 = new ol.geom.Point([5000, -5000]);
  68. var destPoint2 = new ol.geom.Point([6500, -3200]);
  69. var destFeature1 = new ol.Feature(destPoint1);
  70. var destFeature2 = new ol.Feature(destPoint2);
  71. var iconStyle_dest = new ol.style.Style({
  72. image: new ol.style.Icon(({
  73. src: '../img/marker.png'
  74. }))
  75. });
  76. destFeature1.setStyle(iconStyle_dest);
  77. destFeature2.setStyle(iconStyle_dest);
  78. var destSource = new ol.source.Vector({
  79. features: [destFeature1, destFeature2]
  80. });
  81. var destLayer = new ol.layer.Vector({
  82. source: destSource
  83. });
  84. //创建多旅行商分析参数实例
  85. var resultSetting = new SuperMap.TransportationAnalystResultSetting({
  86. returnEdgeFeatures: true,
  87. returnEdgeGeometry: true,
  88. returnEdgeIDs: true,
  89. returnNodeFeatures: true,
  90. returnNodeGeometry: true,
  91. returnNodeIDs: true,
  92. returnPathGuides: true,
  93. returnRoutes: true
  94. });
  95. var analystParameter = new SuperMap.TransportationAnalystParameter({
  96. resultSetting: resultSetting,
  97. weightFieldName: "length" //"length"或者"time"
  98. });
  99. var findMTSPPathsParameter = new SuperMap.FindMTSPPathsParameters({
  100. centers: [new ol.geom.Point([6000, -5500]), new ol.geom.Point([5500, -2500]), new ol.geom.Point([2500, -3500])],
  101. isAnalyzeById: false,
  102. nodes: [new ol.geom.Point([5000, -5000]), new ol.geom.Point([6500, -3200])],
  103. hasLeastTotalCost: true,
  104. parameter: analystParameter
  105. });
  106. //进行查找
  107. new ol.supermap.NetworkAnalystService(serviceUrl).findMTSPPaths(findMTSPPathsParameter, function (serviceResult) {
  108. serviceResult.result.pathList.map(function (result) {
  109. var vectorSource = new ol.source.Vector({
  110. features: (new ol.format.GeoJSON()).readFeatures(result.route)
  111. });
  112. var pathLayer = new ol.layer.Vector({
  113. source: vectorSource,
  114. style: new ol.style.Style({
  115. stroke: new ol.style.Stroke({
  116. color: 'rgba(100, 100, 225, 10)',
  117. width: 3
  118. }),
  119. fill: new ol.style.Fill({
  120. color: 'rgba(0, 0, 255, 0.1)'
  121. })
  122. })
  123. });
  124. map.addLayer(pathLayer);
  125. });
  126. map.addLayer(facilityLayer);
  127. map.addLayer(destLayer);
  128. });
  129. }
  130. </script>
  131. </body>
  132. </html>