plot_addfile.html 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  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_addfile"></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: 15px;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_addfile"></h5></div>
  14. <div class='panel-body content' id="panelbodycontent">
  15. <div class='panel'>
  16. <div class='input-group' style=" margin-bottom: 10px;">
  17. <input type="file" id="file" name="file" style="margin-left: 50px"/>
  18. </div>
  19. </div>
  20. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_overlay" onclick="add()"/>
  21. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_addToLater" onclick="addtolayer()"/>
  22. <input type="button" class="btn btn-default" data-i18n="[value]resources.btn_open" onclick="openSmlData()"/>
  23. <input type="button" class="btn btn-default" data-i18n="[value]resources.text_input_value_clear" onclick="clearLayers()"/>
  24. </div>
  25. </div>
  26. <div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
  27. <script type="text/javascript" include="bootstrap,widgets.alert,fileupLoad" src="../js/include-web.js"></script>
  28. <script type="text/javascript" include="iclient-plot-leaflet" src="../../dist/leaflet/include-leaflet.js"></script>
  29. <script type="text/javascript">
  30. var host = window.isLocal ? window.server : "https://iserver.supermap.io";
  31. var url = host + "/iserver/services/map-china400/rest/maps/China_4326";
  32. var serverUrl = host + "/iserver/services/plot-jingyong/rest/plot/";
  33. var map;
  34. map = L.map('map', {
  35. preferCanvas: true,
  36. crs: L.CRS.EPSG4326,
  37. center: [35,104],
  38. maxZoom: 18,
  39. zoom: 3
  40. });
  41. L.supermap.tiledMapLayer(url).addTo(map);
  42. var plottingLayer = L.supermap.plotting.plottingLayer("plot", serverUrl);
  43. plottingLayer.addTo(map);
  44. var drawControl = L.supermap.plotting.drawControl(plottingLayer);
  45. drawControl.addTo(map);
  46. var editControl = L.supermap.plotting.editControl();
  47. editControl.addTo(map);
  48. var plotting = L.supermap.plotting.getControl(map, serverUrl);
  49. var sitDataManager = plotting.getSitDataManager();
  50. function add() {
  51. widgets.alert.clearAlert();
  52. sitDataManager.addSmlFile('file', true, function(evt){
  53. if(evt.success){
  54. widgets.alert.showAlert("叠加态势图成功!",true);
  55. } else {
  56. widgets.alert.showAlert("叠加态势图失败!",true);
  57. }
  58. });
  59. }
  60. //叠加到指定图层
  61. function addtolayer(){
  62. widgets.alert.clearAlert();
  63. sitDataManager.addSmlFileToLayer('file', "plot", function(evt){
  64. if(evt.success){
  65. widgets.alert.showAlert("叠加态势图成功!",true);
  66. } else {
  67. widgets.alert.showAlert("叠加态势图失败!",true);
  68. }
  69. });
  70. }
  71. //打开并上传到服务器
  72. // function openFileToServer() {
  73. // widgets.alert.clearAlert();
  74. // sitDataManager.openSmlFile('file', function(evt){
  75. // if(evt.success){
  76. // widgets.alert.showAlert("打开态势图成功!",true);
  77. // } else {
  78. // widgets.alert.showAlert("打开态势图失败!",true);
  79. // }
  80. // });
  81. // }
  82. //打开本地态势图文件不上传服务器
  83. function openSmlData() {
  84. widgets.alert.clearAlert();
  85. var files = document.getElementById("file").files;
  86. if (files.length === 0) {
  87. widgets.alert.showAlert("请选择态势图文件!",true);
  88. return;
  89. }else{
  90. var reader = new FileReader();
  91. reader.readAsText(files[0]);
  92. reader.onload = function (e) {
  93. function strToObj(str){//这里是处理json格式不是很标准的情况
  94. var jsonObj = (new Function("return" + str))();
  95. return jsonObj;
  96. }
  97. sitDataManager.openSmlData(strToObj(e.target.result));
  98. }
  99. }
  100. }
  101. function clearLayers() {
  102. widgets.alert.clearAlert();
  103. for (var i = 0; i < map.getPlottingLayers().length; i++) {
  104. map.getPlottingLayers()[i].removeAllFeatures();
  105. }
  106. }
  107. $(document).ready(function(){
  108. $('#panelheading').click(function(){
  109. $('#panelbodycontent').toggle();
  110. });
  111. });
  112. </script>
  113. </body>
  114. </html>