plot_editPlottingLayer.html 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  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_editPlottingLayer"></title>
  9. <style type="text/css">
  10. body {
  11. margin: 0;
  12. overflow: hidden;
  13. background: #fff;
  14. width: 100%;
  15. height: 100%
  16. }
  17. #map {
  18. position: absolute;
  19. width: 100%;
  20. height: 100%;
  21. }
  22. #toolbar {
  23. position: absolute;
  24. top: 50px;
  25. right: 10px;
  26. width: 300px;
  27. text-align: center;
  28. z-index: 100;
  29. border-radius: 4px;
  30. }
  31. .input-group {
  32. margin-bottom: 12px;
  33. }
  34. </style>
  35. </head>
  36. <body>
  37. <div id="toolbar" class="panel panel-primary">
  38. <div class='panel-heading'>
  39. <h5 class='panel-title text-center' data-i18n="resources.title_editPlottingLayer"></h5></div>
  40. <div class='panel-body content'>
  41. <div class='panel'>
  42. <div class='input-group'>
  43. <span class='input-group-addon' data-i18n="resources.text_editLayer"></span>
  44. <select class='form-control' id='editable' onchange="editableChanges()">
  45. <option value='0'>false</option>
  46. <option value='1'>true</option>
  47. </select>
  48. </div>
  49. <div class='input-group'>
  50. <span class='input-group-addon' data-i18n="resources.text_lockLayer"></span>
  51. <select class='form-control' id='locked' onchange="lockedChanges()">
  52. <option value='0'>false</option>
  53. <option value='1'>true</option>
  54. </select>
  55. </div>
  56. <div class='input-group'>
  57. <span class='input-group-addon' data-i18n="resources.text_selectLayer"></span>
  58. <select class='form-control' id='selected' onchange="selectedChanges()">
  59. <option value='0'>false</option>
  60. <option value='1'>true</option>
  61. </select>
  62. </div>
  63. </div>
  64. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_drawMarker" style="margin-bottom: 10px" onclick="drawPolygon()"/>
  65. </div>
  66. </div>
  67. <div id="map"></div>
  68. <script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
  69. <script type="text/javascript" exclude="iclient-classic" include="iclient8c-plot" src="../../dist/classic/include-classic.js"></script>
  70. <script>
  71. var map, baseLayer, plottingLayer, plottingEdit, drawFeature;
  72. var host = window.isLocal ? window.server : "https://iserver.supermap.io";
  73. var mapurl = host + "/iserver/services/map-world/rest/maps/World";
  74. var serverUrl = host + "/iserver/services/plot-jingyong/rest/plot/";
  75. init();
  76. function init() {
  77. map = new SuperMap.Map("map", {
  78. controls: [
  79. new SuperMap.Control.ScaleLine(),
  80. new SuperMap.Control.Zoom(),
  81. new SuperMap.Control.Navigation({
  82. dragPanOptions: {
  83. enableKinetic: true
  84. }
  85. })]
  86. });
  87. map.addControl(new SuperMap.Control.LayerSwitcher(), new SuperMap.Pixel(42, 80));
  88. baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer("World", mapurl, {
  89. transparent: true,
  90. cacheEnabled: true
  91. }, {maxResolution: "auto"});
  92. baseLayer.events.on({"layerInitialized": addLayer});
  93. plottingLayer = new SuperMap.Layer.PlottingLayer("PlottingLayer", serverUrl);
  94. plottingEdit = new SuperMap.Control.PlottingEdit();
  95. drawFeature = new SuperMap.Control.DrawFeature(plottingLayer, SuperMap.Handler.GraphicObject);
  96. drawFeature.events.on({"featureadded": drawCompleted});
  97. map.addControls([plottingEdit, drawFeature]);
  98. }
  99. function addLayer() {
  100. map.addLayers([baseLayer, plottingLayer]);
  101. map.setCenter(new SuperMap.LonLat(0, 0), 0);
  102. if (plottingLayer.isEditable)
  103. document.getElementById("editable").value = 1;
  104. else
  105. document.getElementById("editable").value = 0;
  106. if (plottingLayer.isLocked)
  107. document.getElementById("locked").value = 1;
  108. else
  109. document.getElementById("locked").value = 0;
  110. if (plottingLayer.isSelected)
  111. document.getElementById("selected").value = 1;
  112. else
  113. document.getElementById("selected").value = 0;
  114. }
  115. function drawCompleted() {
  116. drawFeature.deactivate();
  117. plottingEdit.activate();
  118. }
  119. function editableChanges() {
  120. plottingLayer.setEditable(document.getElementById("editable").selectedIndex);
  121. }
  122. function lockedChanges() {
  123. plottingLayer.setLocked(document.getElementById("locked").selectedIndex);
  124. }
  125. function selectedChanges() {
  126. plottingLayer.setSelected(document.getElementById("selected").selectedIndex);
  127. }
  128. function drawPolygon() {
  129. plottingEdit.deactivate();
  130. drawFeature.handler.serverUrl = serverUrl;
  131. drawFeature.handler.libID = 0;
  132. drawFeature.handler.symbolCode = 32;
  133. drawFeature.activate();
  134. }
  135. function PlottingDrawCancel() {
  136. if (drawFeature) {
  137. drawFeature.deactivate();
  138. }
  139. if (plottingEdit) {
  140. plottingEdit.activate();
  141. }
  142. }
  143. document.onmouseup = function (evt) {
  144. var evt = evt || window.event;
  145. if (evt.button === 2) {
  146. PlottingDrawCancel();
  147. return false;
  148. }
  149. evt.stopPropagation();
  150. }
  151. </script>
  152. </body>
  153. </html>