plot_editPlottingLayer.html 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  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. </head>
  10. <body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
  11. <div id="toolbar" class="panel panel-primary" style=" position: absolute;top: 10px;right: 10px;text-align: center;z-index: 9999;border-radius: 4px;">
  12. <div class='panel-heading' id="panelheading">
  13. <h5 class='panel-title text-center' data-i18n="resources.title_editPlottingLayer"></h5></div>
  14. <div class='panel-body content' id="panelbodycontent">
  15. <div class='panel'>
  16. <div class='input-group' style=" margin-bottom: 12px;width: 240px;">
  17. <span class='input-group-addon' data-i18n="resources.text_editLayer"></span>
  18. <select class='form-control' id='editable' onchange="editableChanges()">
  19. <option value='0'>false</option>
  20. <option value='1' selected>true</option>
  21. </select>
  22. </div>
  23. <div class='input-group' style=" margin-bottom: 12px;width: 240px;">
  24. <span class='input-group-addon' data-i18n="resources.text_lockLayer"></span>
  25. <select class='form-control' id='locked' onchange="lockedChanges()">
  26. <option value='0' selected>false</option>
  27. <option value='1'>true</option>
  28. </select>
  29. </div>
  30. <div class='input-group' style=" margin-bottom: 12px;width: 240px;">
  31. <span class='input-group-addon' data-i18n="resources.text_selectLayer"></span>
  32. <select class='form-control' id='selected' onchange="selectedChanges()">
  33. <option value='0'>false</option>
  34. <option value='1' selected>true</option>
  35. </select>
  36. </div>
  37. </div>
  38. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_drawMarker" style="margin-bottom: 10px" onclick="plotSymbol()"/>
  39. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_cancelMarker" style="margin-bottom: 10px" onclick="plottingDrawCancel()"/>
  40. </div>
  41. </div>
  42. <div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
  43. <script type="text/javascript" include="bootstrap-css" src="../js/include-web.js"></script>
  44. <script type="text/javascript" include="iclient-plot-leaflet" src="../../dist/leaflet/include-leaflet.js"></script>
  45. <script type="text/javascript">
  46. var host = window.isLocal ? window.server : "https://iserver.supermap.io";
  47. var url = host + "/iserver/services/map-china400/rest/maps/China_4326";
  48. var serverUrl = host + "/iserver/services/plot-jingyong/rest/plot/";
  49. var map,drawControl,editFlag,lockedFlag,selectedFlag;
  50. map = L.map('map', {
  51. preferCanvas: true,
  52. crs: L.CRS.EPSG4326,
  53. center: [35,104],
  54. maxZoom: 18,
  55. zoom: 3
  56. });
  57. L.supermap.tiledMapLayer(url).addTo(map);
  58. var plottingLayer = L.supermap.plotting.plottingLayer("plot", serverUrl);
  59. plottingLayer.addTo(map);
  60. var drawControl = L.supermap.plotting.drawControl(plottingLayer);
  61. drawControl.addTo(map);
  62. var editControl = L.supermap.plotting.editControl();
  63. editControl.addTo(map);
  64. function editableChanges(){
  65. if(document.getElementById("editable").selectedIndex === 0){
  66. editFlag = false;
  67. }else{
  68. editFlag = true;
  69. }
  70. plottingLayer.setEditable(editFlag);
  71. }
  72. function lockedChanges(){
  73. if(document.getElementById("locked").selectedIndex === 0){
  74. lockedFlag = false;
  75. }else{
  76. lockedFlag = true;
  77. }
  78. plottingLayer.setLocked(lockedFlag);
  79. }
  80. function selectedChanges(){
  81. if(document.getElementById("selected").selectedIndex === 0){
  82. selectedFlag = false;
  83. }else{
  84. selectedFlag = true;
  85. }
  86. plottingLayer.setSelected(selectedFlag);
  87. }
  88. function plotSymbol(){
  89. drawControl.handler.libID = 0;
  90. drawControl.handler.code = 32;
  91. drawControl.handler.serverUrl = serverUrl;
  92. drawControl.handler.enable();
  93. }
  94. function plottingDrawCancel(){
  95. drawControl.handler.disable();
  96. }
  97. $(document).ready(function(){
  98. $('#panelheading').click(function(){
  99. $('#panelbodycontent').toggle();
  100. });
  101. });
  102. </script>
  103. </body>
  104. </html>