0001 <!DOCTYPE html>
0002 <html>
0003 <head>
0004 <title> Leaflet_Tutrial_601.html 2019/4/26 by T. Fujita </title>
0005 <meta charset = "utf-8" />
0006 <link rel = "stylesheet" href = "https://unpkg.com/leaflet@1.4.0/dist/leaflet.css" />
0007 <link rel = "stylesheet" href = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
0008 <link rel = "stylesheet" href = "./Plugins/Leaflet-MousePosition-master/src/L.Control.MousePosition.css" />
0009 <link rel = "stylesheet" href = "./Plugins/Leaflet-MiniMap-master/src/Control.MiniMap.css" />
0010 <link rel = "stylesheet" href = "./Plugins/leaflet-control-osm-geocoder-master/Control.OSMGeocoder.css" />
0011 <link rel = "stylesheet" href = "./Plugins/ms-Dropdown-master/css/msdropdown/dd.css" />
0012 <link rel = "stylesheet" href = "./CSS/Leaflet_Graticule.css" />
0013 <link rel = "stylesheet" href = "./CSS/scroll_menu.css" />
0014 <link rel = "stylesheet" href = "./CSS/Original_Style_505.css" />
0015
0016 <style>
0017 html, body {
0018 width: 99%;
0019 height: 98%;
0020 font-size: 14px;
0021 z-index: 0;
0022 }
0023 </style>
0024
0025 <script src = "https://unpkg.com/leaflet@1.4.0/dist/leaflet.js"></script>
0026 <script src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
0027 <script src = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
0028 <script src = "./Plugins/leaflet-GIBS-master/src/GIBSMetadata.js" ></script>
0029 <script src = "./Plugins/leaflet-GIBS-master/src/GIBSLayer.js" ></script>
0030 <script src = "./Plugins/leaflet-ajax-master/dist/leaflet.ajax.js" ></script>
0031 <script src = "./Plugins/Leaflet-MousePosition-master/src/L.Control.MousePosition.js" ></script>
0032 <script src = "./Plugins/Leaflet-MiniMap-master/src/Control.MiniMap.js" ></script>
0033 <script src = "./Plugins/leaflet-control-osm-geocoder-master/Control.OSMGeocoder_SRC.js" ></script>
0034 <script src = "./Plugins/ms-Dropdown-master/js/msdropdown/jquery.dd.js"></script>
0035 <script src = "./JS/Map_Data_601.JS" ></script>
0036 <script src = "./JS/Leaflet_Graticule.js" ></script>
0037 <script src = "./JS/Dialog_505.js" ></script>
0038 <script>
0039 var Marker_LAT = new Array();
0040 var Marker_LON = new Array();
0041 var Marker_NAM = new Array();
0042 var Marker_LNK = new Array();
0043 var Marker_ICN = new Array();
0044 var Marker_ID = new Array();
0045 var Marker_Drag_flag = new Array();
0046 var Marker_Drag_info = new Array();
0047 var ClickLat = null;
0048 var ClickLon = null;
0049 var Marker_count = 0;
0050 var Marker_ID_count = 0;
0051 var SelectedID;
0052 var Marker_flag = 0;
0053 var Temp_shape, Temp_shape_clone;
0054 var Temp, Temp_LAT, Temp_LON, Temp_NAM, Temp_LNK, Temp_ICN, Temp_ID;
0055 var Temp_Drag_flag, Temp_Drag_info;
0056 var Layer_404 = new Array();
0057 var Layer_404_clone = new Array();
0058
0059 var Lines_shape = new Array();
0060 var Lines_shape_clone_01 = new Array();
0061 var Lines_shape_clone_02 = new Array();
0062 var Lines_LAT = new Array();
0063 var Lines_LON = new Array();
0064 var Lines_NAM = new Array();
0065 var Lines_LNK = new Array();
0066 var Lines_ICN = new Array();
0067 var Lines_ID = new Array();
0068 var Lines_Marker_ID = new Array();
0069 var Lines_Drag_flag = new Array();
0070 var Lines_Drag_info = new Array();
0071 var Polygons_shape = new Array();
0072 var Polygons_shape_clone_01 = new Array();
0073 var Polygons_shape_clone_02 = new Array();
0074 var Polygons_pos = new Array();
0075 var Polygons_pos_clone_01 = new Array();
0076 var Polygons_pos_clone_02 = new Array();
0077 var Polygons_LAT = new Array();
0078 var Polygons_LON = new Array();
0079 var Polygons_NAM = new Array();
0080 var Polygons_LNK = new Array();
0081 var Polygons_ICN = new Array();
0082 var Polygons_ID = new Array();
0083 var Polygons_Marker_ID = new Array();
0084 var Polygons_Drag_flag = new Array();
0085 var Polygons_Drag_info = new Array();
0086 var Circles_shape = new Array();
0087 var Circles_shape_clone = new Array();
0088 var Circles_LAT = new Array();
0089 var Circles_LON = new Array();
0090 var Circles_RAD = new Array();
0091 var Circles_NAM = new Array();
0092 var Circles_LNK = new Array();
0093 var Circles_ID = new Array();
0094 var Circles_Drag_flag = new Array();
0095 var Circles_Drag_info = new Array();
0096 var Lines_Marker_count = 0;
0097 var Lines_Marker_ID_count = 0;
0098 var Lines_count = 0;
0099 var Lines_ID_count = 0;
0100 var Polygons_Marker_count = 0;
0101 var Polygons_Marker_ID_count = 0;
0102 var Polygons_count = 0;
0103 var Polygons_ID_count = 0;
0104 var Circles_count = 0;
0105 var Circles_ID_count = 0;
0106 var Layer_505_L = new Array();
0107 var Layer_505_L_clone_01 = new Array();
0108 var Layer_505_L_clone_02 = new Array();
0109 var Layer_505_LM = new Array();
0110 var Layer_505_LM_clone = new Array();
0111 var Layer_505_P = new Array();
0112 var Layer_505_P_clone_01 = new Array();
0113 var Layer_505_P_clone_02 = new Array();
0114 var Layer_505_PM = new Array();
0115 var Layer_505_PM_clone = new Array();
0116 var Layer_505_C = new Array();
0117 var Layer_505_C_clone = new Array();
0118 var Dialog_flag_001 = 0;
0119 var Lines_flag = 0;
0120 var Polygons_flag = 0;
0121 var Mouse_Position = L.control.mousePosition( {position:'bottomright'} );
0122 var map;
0123 var Layer_00;
0124
0125 function init() {
0126 map = L.map('map').setView([35.0, 137.0], 6);
0127 Layer_00 = Basic_Map[ 0 ];
0128 map.addLayer( Layer_00 );
0129 L.control.scale().addTo(map);
0130 var osm2 = new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {minZoom: 0, maxZoom: 15, attribution: 'Map data © OpenStreetMap contributors' });
0131 var miniMap = new L.Control.MiniMap(osm2, { toggleDisplay: true, position: 'bottomleft' }).addTo(map);
0132
0133 map.on('click', function(e) {
0134 ClickLat = e.latlng.lat;
0135 ClickLon = e.latlng.lng;
0136 while(ClickLon < -180) {
0137 ClickLon = ClickLon + 360;
0138 }
0139 while(ClickLon > 180) {
0140 ClickLon = ClickLon - 360;
0141 }
0142 if ( Marker_flag == 1 ) { Leaflet_Marker_401(); }
0143 if ( Marker_flag == 2 ) { Leaflet_Marker_403(); }
0144 if ( Lines_flag >= 1 ) { Leaflet_Lines_501(); };
0145 if ( Polygons_flag >= 1 ) { Leaflet_Polygons_501(); };
0146 });
0147 }
0148
0149 function Leaflet_Marker_400() { // 初期設定（マーカー単独設置）
0150 ClickLat = null;
0151 ClickLon = null;
0152 Marker_flag = 1;
0153 Lines_flag = 0;
0154 Polygons_flag = 0;
0155 }
0156
0157 function Leaflet_Marker_401() { // マーカー単独設置
0158 if(Marker_flag == 1) {
0159 Marker_LAT[ Marker_count ] = ClickLat;
0160 Marker_LON[ Marker_count ] = ClickLon;
0161 Marker_NAM[ Marker_count ] = Set_Text;
0162 Marker_LNK[ Marker_count ] = " ";
0163 Marker_ICN[ Marker_count ] = L.icon({
0164 iconUrl: Icon_Url,
0165 iconSize: [Icon_W, Icon_H],
0166 iconAnchor : [Icon_AW, Icon_AH],
0167 popupAnchor: [Icon_PW, Icon_PH]
0168 });
0169 Marker_ID[ Marker_count ] = "Marker" + Marker_ID_count;
0170 Marker_Drag_flag[ Marker_count ] = true;
0171 Marker_Drag_info[ Marker_count ] = "マウスで移動出来ます。";
0172 Temp = Marker_count;
0173 Marker_setting();
0174 Marker_set();
0175 Layer_404[ Temp ] = Temp_shape;
0176 Layer_404[ Temp ].addTo(map);
0177 Layer_404_clone[ Temp ] = Temp_shape_clone;
0178 Layer_404_clone[ Temp ].addTo(map);
0179 Marker_count = Marker_count + 1;
0180 Marker_ID_count = Marker_ID_count + 1;
0181 Marker_flag = 0;
0182 }
0183 }
0184
0185 function Leaflet_Marker_402() { // 初期設定（マーカー連続設置）
0186 ClickLat = null;
0187 ClickLon = null;
0188 Marker_flag = 2;
0189 Lines_flag = 0;
0190 Polygons_flag = 0;
0191 }
0192
0193 function Leaflet_Marker_403() { // マーカー連続設置
0194 if(Marker_flag == 2) {
0195 Marker_LAT[ Marker_count ] = ClickLat;
0196 Marker_LON[ Marker_count ] = ClickLon;
0197 Marker_NAM[ Marker_count ] = Set_Text;
0198 Marker_LNK[ Marker_count ] = Set_Link;
0199 Marker_ICN[ Marker_count ] = L.icon({
0200 iconUrl: Icon_Url,
0201 iconSize: [Icon_W, Icon_H],
0202 iconAnchor : [Icon_AW, Icon_AH],
0203 popupAnchor: [Icon_PW, Icon_PH]
0204 });
0205 Marker_ID[ Marker_count ] = "Marker" + Marker_ID_count;
0206 Marker_Drag_flag[ Marker_count ] = true;
0207 Marker_Drag_info[ Marker_count ] = "マウスで移動出来ます。";
0208 Temp = Marker_count;
0209 Marker_setting();
0210 Marker_set();
0211 Layer_404[ Temp ] = Temp_shape;
0212 Layer_404[ Temp ].addTo(map);
0213 Layer_404_clone[ Temp ] = Temp_shape_clone;
0214 Layer_404_clone[ Temp ].addTo(map);
0215 Marker_count = Marker_count + 1;
0216 Marker_ID_count = Marker_ID_count + 1;
0217 }
0218 }
0219
0220 function Leaflet_Marker_404() { // マーカー連続設置終了
0221 Marker_flag = 0;
0222 }
0223
0224 function Leaflet_Marker_405() { // マーカー全消去
0225 for(i = 0; i < Layer_404.length; i++) {
0226 if(Layer_404[i] != null) {
0227 map.removeLayer(Layer_404[i]);
0228 }
0229 }
0230 for(i = 0; i < Layer_404_clone.length; i++) {
0231 if(Layer_404[i] != null) {
0232 map.removeLayer(Layer_404_clone[ i ]);
0233 }
0234 }
0235 Marker_flag = 0;
0236 Marker_count = 0;
0237 Marker_LAT = new Array();
0238 Marker_LON = new Array();
0239 Marker_NAM = new Array();
0240 Marker_LNK = new Array();
0241 Marker_ICN = new Array();
0242 }
0243
0244 function Leaflet_Marker_406() { // マーカー保存（CSV形式）
0245 for (i = 0; i <= (Marker_LON.length - 1); i++) {
0246 if( !isNaN(Marker_LON[ i ]) ) {
0247 while( (Marker_LON[ i ] * 1.0) < -180) {
0248 Marker_LON[ i ] = (Marker_LON[ i ] * 1.0) + 360;
0249 }
0250 while( (Marker_LON[ i ] * 1.0) > 180) {
0251 Marker_LON[ i ] = (Marker_LON[ i ] * 1.0) - 360;
0252 }
0253 }
0254 }
0255 if(Marker_LAT[ 0 ] == "LAT(deg.)") {
0256 var CSV_content = [];
0257 } else {
0258 var CSV_content = "LAT(deg.),LONG(deg.),Name(by utf-8),Link,\r\n";
0259 }
0260 const aTag = document.createElement('a');
0261 aTag.download = "CSV_Data.csv";
0262 var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
0263 Temp = Marker_LAT.length;
0264 for ( i = 0; i < Temp; i++ ) {
0265 if( Marker_LAT[ i ] != "" && Marker_LON[ i ] != "" ) {
0266 CSV_content = CSV_content + Marker_LAT[ i ] + "," + Marker_LON[ i ] + "," + Marker_NAM[ i ] + "," + Marker_LNK[ i ] + ",\r\n";
0267 }
0268 }
0269 var blob = new Blob([ bom, CSV_content ], { "type": "text/csv"});
0270 if(window.navigator.msSaveBlob) {
0271 window.navigator.msSaveBlob(blob, aTag.download); // for IE
0272 } else if (window.URL && window.URL.createObjectURL) {
0273 aTag.href = window.URL.createObjectURL(blob); // for FireFox
0274 document.body.appendChild(aTag);
0275 aTag.click();
0276 document.body.removeChild(aTag);
0277 } else if (window.webkitURL && window.webkitURL.createObject) {
0278 aTag.href = (window.URL || window.webkitURL).createObjectURL(blob); // for Chrome
0279 aTag.click();
0280 } else {
0281 alert("保存に失敗しました！");
0282 }
0283 }
0284
0285 function Leaflet_Marker_407() { // マーカー読込（CSV形式）
0286 Dialog_002();
0287 }
0288
0289 function Marker_setting() { // マーカー設定
0290 Temp_LAT = Marker_LAT[ Temp ] * 1.0;
0291 Temp_LON = Marker_LON[ Temp ] * 1.0;
0292 Temp_NAM = Marker_NAM[ Temp ];
0293 Temp_LNK = Marker_LNK[ Temp ];
0294 Temp_ICN = Marker_ICN[ Temp ];
0295 Temp_ID = Marker_ID[ Temp ];
0296 Temp_Drag_flag = Marker_Drag_flag[ Temp ];
0297 Temp_Drag_info = Marker_Drag_info[ Temp ];
0298 Set_Link = " ";
0299 if(Temp_LNK != undefined ) {
0300 if( String( Temp_LNK ).length > 5 ) {
0301 Set_Link = "<a href= '" + Temp_LNK + "' target='_blank'> " + Temp_NAM + "情報にリンク</a>";
0302 }
0303 }
0304 }
0305
0306 function Lines_Marker_setting() { // 直線用マーカー設定
0307 Temp_LAT = Lines_LAT[ Temp ] * 1.0;
0308 Temp_LON = Lines_LON[ Temp ] * 1.0;
0309 Temp_NAM = Lines_NAM[ Temp ];
0310 Temp_LNK = Lines_LNK[ Temp ];
0311 Temp_ICN = Lines_ICN[ Temp ];
0312 Temp_ID = Lines_Marker_ID[ Temp ];
0313 Temp_Drag_flag = Lines_Drag_flag[ Temp ];
0314 Temp_Drag_info = Lines_Drag_info[ Temp ];
0315 Set_Link = " ";
0316 if(Temp_LNK != undefined ) {
0317 if( String( Temp_LNK ).length > 5 ) {
0318 Set_Link = "<a href= '" + Temp_LNK + "' target='_blank'> " + Temp_NAM + "情報にリンク</a>";
0319 }
0320 }
0321 }
0322
0323 function Polygons_Marker_setting() { // 多角形用マーカー設定
0324 Temp_LAT = Polygons_LAT[ Temp ] * 1.0;
0325 Temp_LON = Polygons_LON[ Temp ] * 1.0;
0326 Temp_NAM = Polygons_NAM[ Temp ];
0327 Temp_LNK = Polygons_LNK[ Temp ];
0328 Temp_ICN = Polygons_ICN[ Temp ];
0329 Temp_ID = Polygons_Marker_ID[ Temp ];
0330 Temp_Drag_flag = Polygons_Drag_flag[ Temp ];
0331 Temp_Drag_info = Polygons_Drag_info[ Temp ];
0332 Set_Link = " ";
0333 if(Temp_LNK != undefined ) {
0334 if( String( Temp_LNK ).length > 5 ) {
0335 Set_Link = "<a href= '" + Temp_LNK + "' target='_blank'> " + Temp_NAM + "情報にリンク</a>";
0336 }
0337 }
0338 }
0339
0340 function Marker_set() { // マーカー設置
0341 if( !isNaN( Temp_LAT ) && !isNaN( Temp_LON ) ) {
0342 if( (Temp_LAT !== undefined ) || (Temp_LAT != "") ) {
0343 if( ((Temp_LAT * 1.0) != 0) || ((Temp_LON * 1.0) != 0) ) {
0344 Temp_shape = L.marker([ Temp_LAT, Temp_LON ],
0345 {icon: Temp_ICN, id: Temp_ID, draggable: Temp_Drag_flag}).bindPopup( Temp_NAM + "<BR>" + Temp_Drag_info + "<BR>" +
0346 "<p> <input type='button' value='Change this Marker' class='marker-change-button'/></p>" +
0347 Set_Link + "<p> <input type='button' value='Delete this Marker' class='marker-delete-button'/></p>");
0348 Temp_shape.on('popupopen', onMarkerOpen ).on('dragend', Dragging);
0349 if(Temp_LON >= 0) {
0350 Temp_shape_clone = L.marker([ Temp_LAT, (Temp_LON - 360) ],
0351 {icon: Temp_ICN, id: Temp_ID, draggable: Temp_Drag_flag}).bindPopup( Temp_NAM + "<BR>" + Temp_Drag_info + "<BR>" +
0352 "<p> <input type='button' value='Change this Marker' class='marker-change-button'/></p>" +
0353 Set_Link + "<p> <input type='button' value='Delete this Marker' class='marker-delete-button'/></p>");
0354 Temp_shape_clone.on('popupopen', onMarkerOpen ).on('dragend', Dragging);
0355 } else {
0356 Temp_shape_clone = L.marker([ Temp_LAT, (Temp_LON + 360) ],
0357 {icon: Temp_ICN, id: Temp_ID, draggable: Temp_Drag_flag}).bindPopup( Temp_NAM + "<BR>" + Temp_Drag_info + "<BR>" +
0358 "<p> <input type='button' value='Change this Marker' class='marker-change-button'/></p>" +
0359 Set_Link + "<p> <input type='button' value='Delete this Marker' class='marker-delete-button'/></p>");
0360 Temp_shape_clone.on('popupopen', onMarkerOpen ).on('dragend', Dragging);
0361 }
0362 }
0363 }
0364 }
0365 }
0366
0367 function onMarkerOpen() { // マーカーをクリックした時に表示する削除ボタンと変更ボタン
0368 var tempMarker = this;
0369 SelectedID = tempMarker.options.id;
0370 $(".marker-delete-button:visible").click(function () {
0371 if(SelectedID.slice(0,4) =="Line") {
0372 Lines_Marker_DEL(tempMarker);
0373 } else if(SelectedID.slice(0,7) =="Polygon") {
0374 Polygons_Marker_DEL(tempMarker);
0375 } else {
0376 Marker_DEL(tempMarker);
0377 }
0378 });
0379 $(".marker-change-button:visible").click(function () {
0380 Dialog_flag_001 = 1;
0381 Dialog_001();
0382 Dialog_flag_001 = 0;
0383 });
0384 }
0385
0386 function Change_Marker() { // マーカー変更ボタン押下時の処理
0387 for(i = 0; i <= Marker_count; i++) {
0388 if(SelectedID == Marker_ID[ i ] ) {
0389 Marker_NAM[ i ] = Set_Text;
0390 Marker_ICN[ i ] = L.icon({
0391 iconUrl: Icon_Url,
0392 iconSize: [Icon_W, Icon_H],
0393 iconAnchor : [Icon_AW, Icon_AH],
0394 popupAnchor: [Icon_PW, Icon_PH]
0395 });
0396 }
0397 }
0398 for(i = 0; i <= Lines_Marker_count; i++) {
0399 if(SelectedID == Lines_Marker_ID[ i ] ) {
0400 Lines_NAM[ i ] = Set_Text;
0401 Lines_ICN[ i ] = L.icon({
0402 iconUrl: Icon_Url,
0403 iconSize: [Icon_W, Icon_H],
0404 iconAnchor : [Icon_AW, Icon_AH],
0405 popupAnchor: [Icon_PW, Icon_PH]
0406 });
0407 }
0408 }
0409 for(i = 0; i <= Polygons_Marker_count; i++) {
0410 if(SelectedID == Polygons_Marker_ID[ i ] ) {
0411 Polygons_NAM[ i ] = Set_Text;
0412 Polygons_ICN[ i ] = L.icon({
0413 iconUrl: Icon_Url,
0414 iconSize: [Icon_W, Icon_H],
0415 iconAnchor : [Icon_AW, Icon_AH],
0416 popupAnchor: [Icon_PW, Icon_PH]
0417 });
0418 }
0419 }
0420 Marker_Refresh();
0421 Lines_Marker_Refresh();
0422 Polygons_Marker_Refresh();
0423 }
0424
0425 function Marker_DEL(tempMarker) { // マーカー削除ボタン押下時の処理
0426 var k = 0;
0427 Marker_flag = 0;
0428 Marker_LAT[ Marker_count ] = "";
0429 Marker_LON[ Marker_count ] = "";
0430 Marker_NAM[ Marker_count ] = "";
0431 Marker_LNK[ Marker_count ] = "";
0432 Marker_ICN[ Marker_count ] = "";
0433 Marker_ID[ Marker_count ] = "";
0434 Marker_LAT[ Marker_count + 1 ] = "";
0435 Marker_LON[ Marker_count + 1 ] = "";
0436 Marker_NAM[ Marker_count + 1 ] = "";
0437 Marker_LNK[ Marker_count + 1 ] = "";
0438 Marker_ICN[ Marker_count + 1 ] = "";
0439 Marker_ID[ Marker_count + 1 ] = "";
0440 SelectedID = tempMarker.options.id;
0441 for(i = 0; i <= Marker_count; i++) {
0442 if(SelectedID == Marker_ID[ i ] ) {
0443 for(k = i; k <= Marker_count; k++) {
0444 Marker_LAT[ k ] = Marker_LAT[ k + 1 ];
0445 Marker_LON[ k ] = Marker_LON[ k + 1 ];
0446 Marker_NAM[ k ] = Marker_NAM[ k + 1 ];
0447 Marker_LNK[ k ] = Marker_LNK[ k + 1 ];
0448 Marker_ICN[ k ] = Marker_ICN[ k + 1 ];
0449 Marker_ID[ k ] = Marker_ID[ k + 1 ];
0450 Marker_Drag_flag[ k ] = Marker_Drag_flag[ k + 1 ];
0451 Marker_Drag_info[ k ] = Marker_Drag_info[ k + 1 ];
0452 }
0453 }
0454 }
0455 SelectedID = null;
0456 Marker_Refresh();
0457 Marker_count = Marker_count - 1;
0458 Marker_Refresh();
0459 }
0460
0461 function Lines_Marker_DEL(tempMarker) { // 直線用マーカーの削除ボタン押下時の処理
0462 var k = 0;
0463 Lines_LAT[ Lines_Marker_count ] = "";
0464 Lines_LON[ Lines_Marker_count ] = "";
0465 Lines_NAM[ Lines_Marker_count ] = "";
0466 Lines_LNK[ Lines_Marker_count ] = "";
0467 Lines_ICN[ Lines_Marker_count ] = "";
0468 Lines_ID[ Lines_Marker_count ] = "";
0469 Lines_LAT[ Lines_Marker_count + 1 ] = "";
0470 Lines_LON[ Lines_Marker_count + 1 ] = "";
0471 Lines_NAM[ Lines_Marker_count + 1 ] = "";
0472 Lines_LNK[ Lines_Marker_count + 1 ] = "";
0473 Lines_ICN[ Lines_Marker_count + 1 ] = "";
0474 Lines_ID[ Lines_Marker_count + 1 ] = "";
0475 SelectedID = tempMarker.options.id;
0476 for(i = 0; i <= Lines_Marker_count; i++) {
0477 if(SelectedID == Lines_Marker_ID[ i ] ) {
0478 for(k = i; k <= Lines_Marker_count; k++) {
0479 Lines_LAT[ k ] = Lines_LAT[ k + 1 ];
0480 Lines_LON[ k ] = Lines_LON[ k + 1 ];
0481 Lines_NAM[ k ] = Lines_NAM[ k + 1 ];
0482 Lines_LNK[ k ] = Lines_LNK[ k + 1 ];
0483 Lines_ICN[ k ] = Lines_ICN[ k + 1 ];
0484 Lines_Marker_ID[ k ] = Lines_Marker_ID[ k + 1 ];
0485 Lines_Drag_flag[ k ] = Lines_Drag_flag[ k + 1 ];
0486 Lines_Drag_info[ k ] = Lines_Drag_info[ k + 1 ];
0487 }
0488 }
0489 }
0490 SelectedID = null;
0491 Lines_Marker_Refresh();
0492 Lines_Marker_count = Lines_Marker_count - 1;
0493 Lines_Marker_Refresh();
0494 Leaflet_Lines_Draw();
0495 }
0496
0497 function Polygons_Marker_DEL(tempMarker) { // 多角形用マーカーの削除ボタン押下時の処理
0498 var k = 0;
0499 Polygons_LAT[ Polygons_Marker_count ] = "";
0500 Polygons_LON[ Polygons_Marker_count ] = "";
0501 Polygons_NAM[ Polygons_Marker_count ] = "";
0502 Polygons_LNK[ Polygons_Marker_count ] = "";
0503 Polygons_ICN[ Polygons_Marker_count ] = "";
0504 Polygons_ID[ Polygons_Marker_count ] = "";
0505 Polygons_LAT[ Polygons_Marker_count + 1 ] = "";
0506 Polygons_LON[ Polygons_Marker_count + 1 ] = "";
0507 Polygons_NAM[ Polygons_Marker_count + 1 ] = "";
0508 Polygons_LNK[ Polygons_Marker_count + 1 ] = "";
0509 Polygons_ICN[ Polygons_Marker_count + 1 ] = "";
0510 Polygons_ID[ Polygons_Marker_count + 1 ] = "";
0511 SelectedID = tempMarker.options.id;
0512 for(i = 0; i <= Polygons_Marker_count; i++) {
0513 if(SelectedID == Polygons_Marker_ID[ i ] ) {
0514 for(k = i; k <= Polygons_Marker_count; k++) {
0515 Polygons_LAT[ k ] = Polygons_LAT[ k + 1 ];
0516 Polygons_LON[ k ] = Polygons_LON[ k + 1 ];
0517 Polygons_NAM[ k ] = Polygons_NAM[ k + 1 ];
0518 Polygons_LNK[ k ] = Polygons_LNK[ k + 1 ];
0519 Polygons_ICN[ k ] = Polygons_ICN[ k + 1 ];
0520 Polygons_Marker_ID[ k ] = Polygons_Marker_ID[ k + 1 ];
0521 Polygons_Drag_flag[ k ] = Polygons_Drag_flag[ k + 1 ];
0522 Polygons_Drag_info[ k ] = Polygons_Drag_info[ k + 1 ];
0523 }
0524 }
0525 }
0526 SelectedID = null;
0527 Polygons_Marker_Refresh();
0528 Polygons_Marker_count = Polygons_Marker_count - 1;
0529 Polygons_Marker_Refresh();
0530 Leaflet_Polygons_Draw();
0531 }
0532
0533 function Marker_Refresh() { // マーカー再表示
0534 for(i = 0; i < Layer_404.length; i++) {
0535 if(Layer_404[ i ] != null) {
0536 map.removeLayer(Layer_404[ i ]);
0537 }
0538 }
0539 for(i = 0; i < Layer_404_clone.length; i++) {
0540 if(Layer_404_clone[ i ] != null) {
0541 map.removeLayer(Layer_404_clone[ i ]);
0542 }
0543 }
0544 for (i = 0; i <= (Marker_count - 1); i++)
0545 {
0546 Temp = i;
0547 Marker_setting();
0548 Marker_set();
0549 Layer_404[ Temp ] = Temp_shape;
0550 Layer_404[ Temp ].addTo(map);
0551 Layer_404_clone[ Temp ] = Temp_shape_clone;
0552 Layer_404_clone[ Temp ].addTo(map);
0553 }
0554 }
0555
0556 function Lines_Marker_Refresh() { // 直線用マーカー再表示
0557 for(i = 0; i < Layer_505_LM.length; i++) {
0558 if(Layer_505_LM[ i ] != null) {
0559 map.removeLayer(Layer_505_LM[ i ]);
0560 }
0561 }
0562 for(i = 0; i < Layer_505_LM_clone.length; i++) {
0563 if(Layer_505_LM_clone[ i ] != null) {
0564 map.removeLayer(Layer_505_LM_clone[ i ]);
0565 }
0566 }
0567 for (i = 0; i <= (Lines_Marker_count - 1); i++)
0568 {
0569 Temp = i;
0570 Lines_Marker_setting();
0571 Marker_set();
0572 Layer_505_LM[ Temp ] = Temp_shape;
0573 Layer_505_LM[ Temp ].addTo(map);
0574 Layer_505_LM_clone[ Temp ] = Temp_shape_clone;
0575 Layer_505_LM_clone[ Temp ].addTo(map);
0576 }
0577 }
0578
0579 function Polygons_Marker_Refresh() { // 多角形用マーカー再表示
0580 for(i = 0; i < Layer_505_PM.length; i++) {
0581 if(Layer_505_PM[ i ] != null) {
0582 map.removeLayer(Layer_505_PM[ i ]);
0583 }
0584 }
0585 for(i = 0; i < Layer_505_PM_clone.length; i++) {
0586 if(Layer_505_PM_clone[ i ] != null) {
0587 map.removeLayer(Layer_505_PM_clone[ i ]);
0588 }
0589 }
0590 for (i = 0; i <= (Polygons_Marker_count - 1); i++)
0591 {
0592 Temp = i;
0593 Polygons_Marker_setting();
0594 Marker_set();
0595 Layer_505_PM[ Temp ] = Temp_shape;
0596 Layer_505_PM[ Temp ].addTo(map);
0597 Layer_505_PM_clone[ Temp ] = Temp_shape_clone;
0598 Layer_505_PM_clone[ Temp ].addTo(map);
0599 }
0600 }
0601
0602 function Dragging() { // マーカーをドラッグ時の位置取得
0603 ClickLat = this._latlng.lat;
0604 ClickLon = this._latlng.lng;
0605 SelectedID = this.options.id;
0606 if(SelectedID.slice(0,4) == "Line") {
0607 for(i = 0; i <= Lines_Marker_count; i++) {
0608 if(SelectedID == Lines_Marker_ID[ i ] ) {
0609 Lines_LAT[ i ] = ClickLat;
0610 Lines_LON[ i ] = ClickLon;
0611 }
0612 }
0613 Lines_Marker_Refresh();
0614 Leaflet_Lines_Draw();
0615 } else if(SelectedID.slice(0,7) == "Polygon") {
0616 for(i = 0; i <= Polygons_Marker_count; i++) {
0617 if(SelectedID == Polygons_Marker_ID[ i ] ) {
0618 Polygons_LAT[ i ] = ClickLat;
0619 Polygons_LON[ i ] = ClickLon;
0620 }
0621 }
0622 Polygons_Marker_Refresh();
0623 Leaflet_Polygons_Draw();
0624 } else {
0625 for(i = 0; i <= Marker_count; i++) {
0626 if(SelectedID == Marker_ID[ i ] ) {
0627 Marker_LAT[ i ] = ClickLat;
0628 Marker_LON[ i ] = ClickLon;
0629 }
0630 }
0631 Marker_Refresh();
0632 }
0633 SelectedID = null;
0634 }
0635
0636 function Leaflet_Lines_500() { // 初期設定（直線の設置）
0637 ClickLat = null;
0638 ClickLon = null;
0639 Marker_flag = 0;
0640 Lines_flag = 1;
0641 Polygons_flag = 0;
0642 }
0643
0644 function Leaflet_Lines_501() { // 直線用マーカーの設置
0645 Lines_LAT[ Lines_Marker_count ] = ClickLat;
0646 Lines_LON[ Lines_Marker_count ] = ClickLon;
0647 Lines_NAM[ Lines_Marker_count ] = Set_Text;
0648 Lines_LNK[ Lines_Marker_count ] = Set_Link;
0649 Lines_ICN[ Lines_Marker_count ] = L.icon({
0650 iconUrl: Icon_Url,
0651 iconSize: [Icon_W, Icon_H],
0652 iconAnchor : [Icon_AW, Icon_AH],
0653 popupAnchor: [Icon_PW, Icon_PH]
0654 });
0655 Lines_Marker_ID[ Lines_Marker_count ] = "Line" + Lines_Marker_ID_count;
0656 Lines_Drag_flag[ Lines_Marker_count ] = true;
0657 Lines_Drag_info[ Lines_Marker_count ] = "マウスで移動出来ます。";
0658 Temp = Lines_Marker_count;
0659 Lines_Marker_setting();
0660 Marker_set();
0661 Layer_505_LM[ Temp ] = Temp_shape;
0662 Layer_505_LM[ Temp ].addTo(map);
0663 Layer_505_LM_clone[ Temp ] = Temp_shape_clone;
0664 Layer_505_LM_clone[ Temp ].addTo(map);
0665 Lines_Marker_count = Lines_Marker_count + 1;
0666 Lines_Marker_ID_count = Lines_Marker_ID_count + 1;
0667 Leaflet_Lines_Draw();
0668 }
0669
0670 function Leaflet_Lines_502() { // 直線マーカーの設置終了
0671 Lines_flag = 0;
0672 Lines_LAT[ Lines_Marker_count ] = "";
0673 Lines_LON[ Lines_Marker_count ] = "";
0674 Lines_NAM[ Lines_Marker_count ] = "";
0675 Lines_LNK[ Lines_Marker_count ] = "";
0676 Lines_ICN[ Lines_Marker_count ] = "";
0677 Lines_ID[ Lines_Marker_count ] = "";
0678 Lines_Marker_count = Lines_Marker_count + 1;
0679 }
0680
0681 function Leaflet_Lines_503() { // 直線と直線用マーカーの全消去
0682 for(i = 0; i < Layer_505_LM.length; i++) {
0683 if(Layer_505_LM[i] != null) {
0684 map.removeLayer(Layer_505_LM[i]);
0685 }
0686 }
0687 for(i = 0; i < Layer_505_LM_clone.length; i++) {
0688 if(Layer_505_LM_clone[i] != null) {
0689 map.removeLayer(Layer_505_LM_clone[i]);
0690 }
0691 }
0692 for(i = 0; i < Layer_505_L.length; i++) {
0693 if(Layer_505_L[i] != null) {
0694 map.removeLayer(Layer_505_L[i]);
0695 }
0696 }
0697 for(i = 0; i < Layer_505_L_clone_01.length; i++) {
0698 if(Layer_505_L_clone_01[i] != null) {
0699 map.removeLayer(Layer_505_L_clone_01[i]);
0700 }
0701 }
0702 for(i = 0; i < Layer_505_L_clone_02.length; i++) {
0703 if(Layer_505_L_clone_02[i] != null) {
0704 map.removeLayer(Layer_505_L_clone_02[i]);
0705 }
0706 }
0707 Lines_flag = 0;
0708 Lines_count = 0;
0709 Lines_Marker_count = 0;
0710 Lines_shape = new Array();
0711 Lines_shape_clone_01 = new Array();
0712 Lines_shape_clone_02 = new Array();
0713 Lines_LAT = new Array();
0714 Lines_LON = new Array();
0715 Lines_NAM = new Array();
0716 Lines_LNK = new Array();
0717 Lines_ICN = new Array();
0718 }
0719
0720 function Leaflet_Lines_504() { // 直線用マーカーの非表示
0721 for(i = 0; i < Layer_505_LM.length; i++) {
0722 if(Layer_505_LM[i] != null) {
0723 map.removeLayer(Layer_505_LM[i]);
0724 }
0725 }
0726 for(i = 0; i < Layer_505_LM_clone.length; i++) {
0727 if(Layer_505_LM_clone[i] != null) {
0728 map.removeLayer(Layer_505_LM_clone[i]);
0729 }
0730 }
0731 }
0732
0733 function Leaflet_Lines_505() { // 直線用マーカーの再表示
0734 Lines_Marker_Refresh();
0735 }
0736
0737 function Leaflet_Lines_Draw() { // 直線の描画
0738 for (i = 0; i < Layer_505_L.length; i++) {
0739 if(Layer_505_L[i] != null) {
0740 map.removeLayer(Layer_505_L[i]);
0741 }
0742 }
0743 for (i = 0; i < Layer_505_L_clone_01.length; i++) {
0744 if(Layer_505_L_clone_01[i] != null) {
0745 map.removeLayer(Layer_505_L_clone_01[i]);
0746 }
0747 }
0748 for (i = 0; i < Layer_505_L_clone_02.length; i++) {
0749 if(Layer_505_L_clone_02[i] != null) {
0750 map.removeLayer(Layer_505_L_clone_02[i]);
0751 }
0752 }
0753 var Temp_LON_01 = new Array();
0754 var Temp_LON_02 = new Array();
0755 for(i = 0; i <= (Lines_Marker_count - 1); i++) {
0756 Temp_LON_01[ i ] = Lines_LON[ i ] * 1.0;
0757 Temp_LON_02[ i ] = Lines_LON[ i ] * 1.0;
0758 if(Lines_LON[ i ] * 1.0 <= 0) {
0759 Temp_LON_01[ i ] = Lines_LON[ i ] * 1.0 + 360;
0760 } else {
0761 Temp_LON_02[ i ] = Lines_LON[ i ] * 1.0 - 360;
0762 }
0763 }
0764 for(i = 0; i <= (Lines_Marker_count - 1); i++) {
0765 if( !isNaN( Lines_LAT[ i ] ) && !isNaN( Lines_LAT[ i + 1 ] ) ) {
0766 if( Math.abs(Lines_LON[ i ] - Lines_LON[ i + 1 ]) <= 180 ) {
0767 if( (Lines_LAT[ i ] != 0) || (Lines_LON[ i ] != 0) ) {
0768 if( (Lines_LAT[ i + 1 ] != 0) || (Lines_LON[ i + 1 ] != 0) ) {
0769 Lines_shape[ Lines_count ] = L.polyline([[ Lines_LAT[ i ], Lines_LON[ i ] ], [ Lines_LAT[ i + 1 ], Lines_LON[ i + 1 ] ]],
0770 { color: "#"+Selected_Color,
0771 weight: Line_W,
0772 opacity: Selected_Opacity,
0773 dashArray: Line_Type
0774 });
0775 Layer_505_L[ Lines_count ] = Lines_shape[ Lines_count ];
0776 Layer_505_L[ Lines_count ].addTo(map);
0777 }
0778 }
0779 }
0780 if( Math.abs(Temp_LON_01[ i ] - Temp_LON_01[ i + 1 ]) <= 180 ) {
0781 if( (Lines_LAT[ i ] != 0) || (Temp_LON_01[ i ] != 0) ) {
0782 if( (Lines_LAT[ i + 1 ] != 0) || (Temp_LON_01[ i + 1 ] != 0) ) {
0783 Lines_shape_clone_01[ Lines_count ] = L.polyline([[ Lines_LAT[ i ], Temp_LON_01[ i ] ], [ Lines_LAT[ i + 1 ], Temp_LON_01[ i + 1 ] ]],
0784 { color: "#"+Selected_Color,
0785 weight: Line_W,
0786 opacity: Selected_Opacity,
0787 dashArray: Line_Type
0788 });
0789 Layer_505_L_clone_01[ Lines_count ] = Lines_shape_clone_01[ Lines_count ];
0790 Layer_505_L_clone_01[ Lines_count ].addTo(map);
0791 }
0792 }
0793 }
0794 if( Math.abs(Temp_LON_02[ i ] - Temp_LON_02[ i + 1 ]) <= 180 ) {
0795 if( (Lines_LAT[ i ] != 0) || (Temp_LON_02[ i ] != 0) ) {
0796 if( (Lines_LAT[ i + 1 ] != 0) || (Temp_LON_02[ i + 1 ] != 0) ) {
0797 Lines_shape_clone_02[ Lines_count ] = L.polyline([[ Lines_LAT[ i ], Temp_LON_02[ i ] ], [ Lines_LAT[ i + 1 ], Temp_LON_02[ i + 1 ] ]],
0798 { color: "#"+Selected_Color,
0799 weight: Line_W,
0800 opacity: Selected_Opacity,
0801 dashArray: Line_Type
0802 });
0803 Layer_505_L_clone_02[ Lines_count ] = Lines_shape_clone_02[ Lines_count ];
0804 Layer_505_L_clone_02[ Lines_count ].addTo(map);
0805 }
0806 }
0807 }
0808 Lines_count = Lines_count + 1;
0809 }
0810 }
0811 }
0812
0813 function Leaflet_Polygons_500() { // 初期設定（多角形の設置）
0814 ClickLat = null;
0815 ClickLon = null;
0816 Marker_flag = 0;
0817 Lines_flag = 0;
0818 Polygons_flag = 1;
0819 }
0820
0821 function Leaflet_Polygons_501() { // 多角形マーカーの設置
0822 Polygons_LAT[ Polygons_Marker_count ] = ClickLat;
0823 Polygons_LON[ Polygons_Marker_count ] = ClickLon;
0824 Polygons_NAM[ Polygons_Marker_count ] = Set_Text;
0825 Polygons_LNK[ Polygons_Marker_count ] = Set_Link;
0826 Polygons_ICN[ Polygons_Marker_count ] = L.icon({
0827 iconUrl: Icon_Url,
0828 iconSize: [Icon_W, Icon_H],
0829 iconAnchor : [Icon_AW, Icon_AH],
0830 popupAnchor: [Icon_PW, Icon_PH]
0831 });
0832 Polygons_Marker_ID[ Polygons_Marker_count ] = "Polygon" + Polygons_Marker_ID_count;
0833 Polygons_Drag_flag[ Polygons_Marker_count ] = true;
0834 Polygons_Drag_info[ Polygons_Marker_count ] = "マウスで移動出来ます。";
0835 Temp = Polygons_Marker_count;
0836 Polygons_Marker_setting();
0837 Marker_set();
0838 Layer_505_PM[ Temp ] = Temp_shape;
0839 Layer_505_PM[ Temp ].addTo(map);
0840 Layer_505_PM_clone[ Temp ] = Temp_shape_clone;
0841 Layer_505_PM_clone[ Temp ].addTo(map);
0842 Polygons_Marker_count = Polygons_Marker_count + 1;
0843 Polygons_Marker_ID_count = Polygons_Marker_ID_count + 1;
0844 }
0845
0846 function Leaflet_Polygons_502() { // 多角形マーカーの設置終了
0847 Polygons_flag = 0;
0848 Polygons_LAT[ Polygons_Marker_count ] = "";
0849 Polygons_LON[ Polygons_Marker_count ] = "";
0850 Polygons_NAM[ Polygons_Marker_count ] = "";
0851 Polygons_LNK[ Polygons_Marker_count ] = "";
0852 Polygons_ICN[ Polygons_Marker_count ] = "";
0853 Polygons_ID[ Polygons_Marker_count ] = "";
0854 Polygons_Marker_count = Polygons_Marker_count + 1;
0855 Leaflet_Polygons_Draw();
0856 }
0857
0858 function Leaflet_Polygons_503() { // 多角形と多角形用マーカーの全消去
0859 for(i = 0; i < Layer_505_PM.length; i++) {
0860 if(Layer_505_PM[i] != null) {
0861 map.removeLayer(Layer_505_PM[i]);
0862 }
0863 }
0864 for(i = 0; i < Layer_505_PM_clone.length; i++) {
0865 if(Layer_505_PM_clone[i] != null) {
0866 map.removeLayer(Layer_505_PM_clone[i]);
0867 }
0868 }
0869 for(i = 0; i < Layer_505_P.length; i++) {
0870 if(Layer_505_P[i] != null) {
0871 map.removeLayer(Layer_505_P[i]);
0872 }
0873 }
0874 for(i = 0; i < Layer_505_P_clone_01.length; i++) {
0875 if(Layer_505_P_clone_01[i] != null) {
0876 map.removeLayer(Layer_505_P_clone_01[i]);
0877 }
0878 }
0879 for(i = 0; i < Layer_505_P_clone_02.length; i++) {
0880 if(Layer_505_P_clone_02[i] != null) {
0881 map.removeLayer(Layer_505_P_clone_02[i]);
0882 }
0883 }
0884 Polygons_flag = 0;
0885 Polygons_count = 0;
0886 Polygons_Marker_count = 0;
0887 Polygons_shape = new Array();
0888 Polygons_LAT = new Array();
0889 Polygons_LON = new Array();
0890 Polygons_NAM = new Array();
0891 Polygons_LNK = new Array();
0892 Polygons_ICN = new Array();
0893 }
0894
0895 function Leaflet_Polygons_504() { // 多角形用マーカーの非表示
0896 for(i = 0; i < Layer_505_PM.length; i++) {
0897 if(Layer_505_PM[i] != null) {
0898 map.removeLayer(Layer_505_PM[i]);
0899 }
0900 }
0901 for(i = 0; i < Layer_505_PM_clone.length; i++) {
0902 if(Layer_505_PM_clone[i] != null) {
0903 map.removeLayer(Layer_505_PM_clone[i]);
0904 }
0905 }
0906 }
0907
0908 function Leaflet_Polygons_505() { // 多角形用マーカーの再表示
0909 Polygons_Marker_Refresh();
0910 }
0911
0912 function Leaflet_Polygons_Draw() { // 多角形の描画
0913 if(Polygons_count != 0) {
0914 for (i = 0; i < Layer_505_P.length; i++) {
0915 if(Layer_505_P[i] != null) {
0916 map.removeLayer(Layer_505_P[i]);
0917 }
0918 }
0919 for (i = 0; i < Layer_505_P_clone_01.length; i++) {
0920 if(Layer_505_P_clone_01[i] != null) {
0921 map.removeLayer(Layer_505_P_clone_01[i]);
0922 }
0923 }
0924 for (i = 0; i < Layer_505_P_clone_02.length; i++) {
0925 if(Layer_505_P_clone_02[i] != null) {
0926 map.removeLayer(Layer_505_P_clone_02[i]);
0927 }
0928 }
0929 }
0930 var Temp_LAT = new Array();
0931 var Temp_LON = new Array();
0932 var Temp_LON_clone_01 = new Array();
0933 var Temp_LON_clone_02 = new Array();
0934 var Temp_flag = new Array();
0935 var j = 0;
0936 Polygons_shape = new Array();
0937 Polygons_shape_clone_01 = new Array();
0938 Polygons_shape_clone_02 = new Array();
0939 Polygons_pos = new Array();
0940 Polygons_pos_clone_01 = new Array();
0941 Polygons_pos_clone_02 = new Array();
0942 Temp_flag[ 0 ] = 0;
0943 for(i = 0; i <= (Polygons_LAT.length - 1); i++) {
0944 if( isNaN( Polygons_LAT[ i ]) || isNaN( Polygons_LON[ i ] ) || ( (Polygons_LAT[ i ] * 1.0 == 0) && (Polygons_LON[ i ] * 1.0 == 0) ) ) {
0945 j = j + 1;
0946 Temp_flag[ j ] = 0;
0947 } else {
0948 if( Math.abs(Polygons_LON[ i ] * 1.0 - Polygons_LON[ i + 1 ] * 1.0 ) > 180) {
0949 Temp_flag[ j ] = Temp_flag[ j ] + 1;
0950 }
0951 }
0952 }
0953 j = 0;
0954 for(i = 0; i <= (Polygons_LAT.length - 1); i++) {
0955 Temp_LAT[ i ] = Polygons_LAT[ i ];
0956 Temp_LON[ i ] = Polygons_LON[ i ];
0957 Temp_LON_clone_01[ i ] = Polygons_LON[ i ];
0958 Temp_LON_clone_02[ i ] = Polygons_LON[ i ];
0959 if( isNaN( Polygons_LAT[ i ]) || isNaN( Polygons_LON[ i ] ) || ( (Polygons_LAT[ i ] * 1.0 == 0) && (Polygons_LON[ i ] * 1.0 == 0) ) ) {
0960 j = j + 1;
0961 } else {
0962 if(Temp_flag[ j ] != 0) {
0963 if(Polygons_LON[ i ] * 1.0 < 0) {
0964 Temp_LON[ i ] = Polygons_LON[ i ] * 1.0 + 360;
0965 }
0966 }
0967 }
0968 Temp_LON_clone_01[ i ] = Temp_LON[ i ] * 1.0 + 360;
0969 Temp_LON_clone_02[ i ] = Temp_LON[ i ] * 1.0 - 360;
0970 }
0971 Polygons_pos[ 0 ] = [];
0972 Polygons_pos_clone_01[ 0 ] = [];
0973 Polygons_pos_clone_02[ 0 ] = [];
0974 j = 0;
0975 for(i = 0; i <= (Temp_LAT.length - 1); i++) {
0976 if( isNaN( Polygons_LAT[ i ]) || isNaN( Polygons_LON[ i ] ) || ( (Polygons_LAT[ i ] * 1.0 == 0) && (Polygons_LON[ i ] * 1.0 == 0) ) ) {
0977 j = j + 1;
0978 Polygons_pos[ j ] = [];
0979 Polygons_pos_clone_01[ j ] = [];
0980 Polygons_pos_clone_02[ j ] = [];
0981 } else {
0982 Temp = Polygons_pos[ j ].push([ Temp_LAT[ i ], Temp_LON[ i ] ]);
0983 Temp = Polygons_pos_clone_01[ j ].push([ Temp_LAT[ i ], (Temp_LON_clone_01[ i ]) ]);
0984 Temp = Polygons_pos_clone_02[ j ].push([ Temp_LAT[ i ], (Temp_LON_clone_02[ i ]) ]);
0985 }
0986 }
0987 j = 0;
0988 for(i = 0; i <= (Polygons_pos.length - 1); i++) {
0989 if(Polygons_pos[ i ].length >= 3) {
0990 Polygons_shape[ j ] = L.polygon([ Polygons_pos[ i ] ],
0991 { color: "#"+Selected_Color,
0992 weight: Line_W,
0993 opacity: Selected_Opacity,
0994 dashArray: Line_Type,
0995 fillColor: "#" + Selected_Fill_Color,
0996 fillopacity: Selected_Fill_Opacity
0997 });
0998 j = j + 1;
0999 }
1000 }
1001 for(i = 0; i <= (Polygons_pos_clone_01.length - 1); i++) {
1002 if(Polygons_pos_clone_01[ i ].length >= 3) {
1003 Polygons_shape_clone_01[ i ] = L.polygon([ Polygons_pos_clone_01[ i ] ],
1004 { color: "#"+Selected_Color,
1005 weight: Line_W,
1006 opacity: Selected_Opacity,
1007 dashArray: Line_Type,
1008 fillColor: "#" + Selected_Fill_Color,
1009 fillopacity: Selected_Fill_Opacity
1010 });
1011 }
1012 }
1013 for(i = 0; i <= (Polygons_pos_clone_02.length - 1); i++) {
1014 if(Polygons_pos_clone_02[ i ].length >= 3) {
1015 Polygons_shape_clone_02[ i ] = L.polygon([ Polygons_pos_clone_02[ i ] ],
1016 { color: "#"+Selected_Color,
1017 weight: Line_W,
1018 opacity: Selected_Opacity,
1019 dashArray: Line_Type,
1020 fillColor: "#" + Selected_Fill_Color,
1021 fillopacity: Selected_Fill_Opacity
1022 });
1023 }
1024 }
1025 for(i = 0; i <= (Polygons_shape.length - 1); i++) {
1026 if(Polygons_shape[ i ] != null) {
1027 Layer_505_P[ i ] = Polygons_shape[ i ];
1028 Layer_505_P[ i ].addTo(map);
1029 }
1030 }
1031 for(i = 0; i <= (Polygons_shape_clone_01.length - 1); i++) {
1032 if(Polygons_shape_clone_01[ i ] != null) {
1033 Layer_505_P_clone_01[ i ] = Polygons_shape_clone_01[ i ];
1034 Layer_505_P_clone_01[ i ].addTo(map);
1035 }
1036 }
1037 for(i = 0; i <= (Polygons_shape_clone_02.length - 1); i++) {
1038 if(Polygons_shape_clone_02[ i ] != null) {
1039 Layer_505_P_clone_02[ i ] = Polygons_shape_clone_02[ i ];
1040 Layer_505_P_clone_02[ i ].addTo(map);
1041 }
1042 }
1043 Polygons_count = Polygons_count + 1;
1044 }
1045
1046 function Leaflet_Circles_500() { // 円の設置
1047 Dialog_004();
1048 }
1049
1050 function Leaflet_Circles_501() { // 円の全消去
1051 for(i = 0; i < Layer_505_C.length; i++) {
1052 if(Layer_505_C[i] != null) {
1053 map.removeLayer(Layer_505_C[i]);
1054 }
1055 }
1056 for(i = 0; i < Layer_505_C_clone.length; i++) {
1057 if(Layer_505_C_clone[i] != null) {
1058 map.removeLayer(Layer_505_C_clone[i]);
1059 }
1060 }
1061 Circles_count = 0;
1062 Circles_shape = new Array();
1063 Circles_shape_clone = new Array();
1064 Circles_LAT = new Array();
1065 Circles_LON = new Array();
1066 Circles_RAD = new Array();
1067 Circles_NAM = new Array();
1068 Circles_LNK = new Array();
1069 }
1070
1071 function Circles_Set(Temp) { // 円の表示
1072 if(( Circles_RAD[ Temp ] * 1.0 == 0) || isNaN(Circles_RAD[ Temp ]) ) {
1073 alert("データ名： " + Circles_NAM[ Temp ] + "\n" + "円の直径が指定されていません！");
1074 return;
1075 }
1076 Circles_shape[ Temp ] = L.circle([ Circles_LAT[ Temp ], Circles_LON[ Temp ] ], Circles_RAD[ Temp ],
1077 { color: "#" + Selected_Color,
1078 fillColor: "#" + Selected_Fill_Color,
1079 opacity: Selected_Opacity,
1080 weight: Line_W,
1081 fillopacity: Selected_Fill_Opacity,
1082 dashArray: Line_Type,
1083 id: Circles_ID[ Temp ]
1084 }).bindPopup(Circles_NAM[ Temp ] + "<BR> <input type='button' value='Delete this circle' class='circle-delete-button'/>");
1085 if(Circles_LON[ Temp ] < 0) {
1086 Circles_shape_clone[ Temp ] = L.circle([ Circles_LAT[ Temp ], (Circles_LON[ Temp ] + 360) ], Circles_RAD[ Temp ],
1087 { color: "#" + Selected_Color,
1088 fillColor: "#" + Selected_Fill_Color,
1089 opacity: Selected_Opacity,
1090 weight: Line_W,
1091 fillopacity: Selected_Fill_Opacity,
1092 dashArray: Line_Type,
1093 id: Circles_ID[ Temp ]
1094 }).bindPopup(Circles_NAM[ Temp ] + "<BR> <input type='button' value='Delete this circle' class='circle-delete-button'/>");
1095 } else {
1096 Circles_shape_clone[ Temp ] = L.circle([ Circles_LAT[ Temp ], (Circles_LON[ Temp ] - 360) ], Circles_RAD[ Temp ],
1097 { color: "#" + Selected_Color,
1098 fillColor: "#" + Selected_Fill_Color,
1099 opacity: Selected_Opacity,
1100 weight: Line_W,
1101 fillopacity: Selected_Fill_Opacity,
1102 dashArray: Line_Type,
1103 id: Circles_ID[ Temp ]
1104 }).bindPopup(Circles_NAM[ Temp ] + "<BR> <input type='button' value='Delete this circle' class='circle-delete-button'/>");
1105 }
1106 Layer_505_C[ Temp ] = Circles_shape[ Temp ].on('popupopen', onPopupCircle );
1107 Layer_505_C[ Temp ].addTo(map);
1108 Layer_505_C_clone[ Temp ] = Circles_shape_clone[ Temp ].on('popupopen', onPopupCircle );
1109 Layer_505_C_clone[ Temp ].addTo(map);
1110 }
1111
1112 function onPopupCircle() { // 円の選択削除
1113 var tempFigure = this;
1114 var k = 0;
1115 Circles_LAT[ Circles_count ] = "";
1116 Circles_LON[ Circles_count ] = "";
1117 Circles_RAD[ Circles_count ] = "";
1118 Circles_NAM[ Circles_count ] = "";
1119 Circles_LNK[ Circles_count ] = "";
1120 Circles_ID[ Circles_count ] = "";
1121 Circles_LAT[ Circles_count + 1 ] = "";
1122 Circles_LON[ Circles_count + 1 ] = "";
1123 Circles_RAD[ Circles_count + 1 ] = "";
1124 Circles_NAM[ Circles_count + 1 ] = "";
1125 Circles_LNK[ Circles_count + 1 ] = "";
1126 Circles_ID[ Circles_count + 1 ] = "";
1127 SelectedID = tempFigure.options.id;
1128 $(".circle-delete-button:visible").click(function () {
1129 for(i = 0; i <= Circles_count; i++) {
1130 if(SelectedID == Circles_ID[ i ] ) {
1131 for(k = i; k <= Circles_count; k++) {
1132 Circles_LAT[ k ] = Circles_LAT[ k + 1 ];
1133 Circles_LON[ k ] = Circles_LON[ k + 1 ];
1134 Circles_RAD[ k ] = Circles_RAD[ k + 1 ];
1135 Circles_NAM[ k ] = Circles_NAM[ k + 1 ];
1136 Circles_LNK[ k ] = Circles_LNK[ k + 1 ];
1137 Circles_ID[ k ] = Circles_ID[ k + 1 ];
1138 Circles_Drag_flag[ k ] = Circles_Drag_flag[ k + 1 ];
1139 Circles_Drag_info[ k ] = Circles_Drag_info[ k + 1 ];
1140 }
1141 }
1142 }
1143 SelectedID = null;
1144 Circles_count = Circles_count - 1;
1145 Circles_Refresh();
1146 });
1147 }
1148
1149 function Circles_Refresh() { // 円の再描画
1150 for(i = 0; i < Layer_505_C.length; i++) {
1151 if(Layer_505_C[ i ] != null) {
1152 map.removeLayer(Layer_505_C[ i ]);
1153 }
1154 }
1155 for(i = 0; i < Layer_505_C_clone.length; i++) {
1156 if(Layer_505_C_clone[ i ] != null) {
1157 map.removeLayer(Layer_505_C_clone[ i ]);
1158 }
1159 }
1160 for (i = 0; i <= (Circles_count - 1); i++)
1161 {
1162 Temp = i;
1163 Circles_Set(Temp);
1164 }
1165 }
1166
1167 function Leaflet_CSV_510() { // 直線データの保存（CSV形式）
1168 for (i = 0; i <= (Lines_LON.length - 1); i++) {
1169 if( !isNaN(Lines_LON[ i ]) ) {
1170 while( (Lines_LON[ i ] * 1.0) < -180) {
1171 Lines_LON[ i ] = (Lines_LON[ i ] * 1.0) + 360;
1172 }
1173 while( (Lines_LON[ i ] * 1.0) > 180) {
1174 Lines_LON[ i ] = (Lines_LON[ i ] * 1.0) - 360;
1175 }
1176 }
1177 }
1178 if(Lines_LAT[ 0 ] == "LAT(deg.)") {
1179 var CSV_content = [];
1180 } else {
1181 var CSV_content = "LAT(deg.),LONG(deg.),Name(by utf-8),Link,\r\n";
1182 }
1183 const aTag = document.createElement('a');
1184 aTag.download = "CSV_Line_Data.csv";
1185 var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
1186 Temp = Lines_LAT.length - 1;
1187 for ( i = 0; i < Temp; i++ ) {
1188 CSV_content = CSV_content + Lines_LAT[ i ] + "," + Lines_LON[ i ] + "," + Lines_NAM[ i ] + "," + Lines_LNK[ i ] + ",\r\n";
1189 }
1190 var blob = new Blob([ bom, CSV_content ], { "type": "text/csv"});
1191 if(window.navigator.msSaveBlob) {
1192 window.navigator.msSaveBlob(blob, aTag.download); // for IE
1193 } else if (window.URL && window.URL.createObjectURL) {
1194 aTag.href = window.URL.createObjectURL(blob); // for FireFox
1195 document.body.appendChild(aTag);
1196 aTag.click();
1197 document.body.removeChild(aTag);
1198 } else if (window.webkitURL && window.webkitURL.createObject) {
1199 aTag.href = (window.URL || window.webkitURL).createObjectURL(blob); // for Chrome
1200 aTag.click();
1201 } else {
1202 alert("保存に失敗しました！");
1203 }
1204 }
1205
1206 function Leaflet_CSV_511() { // 多角形データの保存（CSV形式）
1207 for (i = 0; i <= (Polygons_LON.length - 1); i++) {
1208 if( !isNaN(Polygons_LON[ i ]) ) {
1209 while( (Polygons_LON[ i ] * 1.0) < -180) {
1210 Polygons_LON[ i ] = (Polygons_LON[ i ] * 1.0) + 360;
1211 }
1212 while( (Polygons_LON[ i ] * 1.0) > 180) {
1213 Polygons_LON[ i ] = (Polygons_LON[ i ] * 1.0) - 360;
1214 }
1215 }
1216 }
1217 if(Polygons_LAT[ 0 ] == "LAT(deg.)") {
1218 var CSV_content = [];
1219 } else {
1220 var CSV_content = "LAT(deg.),LONG(deg.),Name(by utf-8),Link,\r\n";
1221 }
1222 const aTag = document.createElement('a');
1223 aTag.download = "CSV_Polygon_Data.csv";
1224 var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
1225 Temp = Polygons_LAT.length - 1;
1226 for ( i = 0; i < Temp; i++ ) {
1227 CSV_content = CSV_content + Polygons_LAT[ i ] + "," + Polygons_LON[ i ] + "," + Polygons_NAM[ i ] + "," + Polygons_LNK[ i ] + ",\r\n";
1228 }
1229 var blob = new Blob([ bom, CSV_content ], { "type": "text/csv"});
1230 if(window.navigator.msSaveBlob) {
1231 window.navigator.msSaveBlob(blob, aTag.download); // for IE
1232 } else if (window.URL && window.URL.createObjectURL) {
1233 aTag.href = window.URL.createObjectURL(blob); // for FireFox
1234 document.body.appendChild(aTag);
1235 aTag.click();
1236 document.body.removeChild(aTag);
1237 } else if (window.webkitURL && window.webkitURL.createObject) {
1238 aTag.href = (window.URL || window.webkitURL).createObjectURL(blob); // for Chrome
1239 aTag.click();
1240 } else {
1241 alert("保存に失敗しました！");
1242 }
1243 }
1244
1245 function Leaflet_CSV_512() { // 円データの保存（CSV形式）
1246 for (i = 0; i <= (Circles_LON.length -1); i++) {
1247 if( !isNaN(Circles_LON[ i ]) ) {
1248 while( (Circles_LON[ i ] * 1.0) < -180) {
1249 Circles_LON[ i ] = (Circles_LON[ i ] * 1.0) + 360;
1250 }
1251 while( (Circles_LON[ i ] * 1.0) > 180) {
1252 Circles_LON[ i ] = (Circles_LON[ i ] * 1.0) - 360;
1253 }
1254 }
1255 }
1256 if(Circles_LAT[ 0 ] == "LAT(deg.)") {
1257 var CSV_content = [];
1258 } else {
1259 var CSV_content = "LAT(deg.),LONG(deg.),Name(by utf-8),Link,Radius,\r\n";
1260 }
1261 const aTag = document.createElement('a');
1262 aTag.download = "CSV_Circle_Data.csv";
1263 var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
1264 Temp = Circles_LAT.length - 1;
1265 for ( i = 0; i <= Temp; i++ ) {
1266 CSV_content = CSV_content + Circles_LAT[ i ] + "," + Circles_LON[ i ] + "," + Circles_NAM[ i ] + "," + Circles_LNK[ i ] + "," + Circles_RAD[ i ] + ",\r\n";
1267 }
1268 var blob = new Blob([ bom, CSV_content ], { "type": "text/csv"});
1269 if(window.navigator.msSaveBlob) {
1270 window.navigator.msSaveBlob(blob, aTag.download); // for IE
1271 } else if (window.URL && window.URL.createObjectURL) {
1272 aTag.href = window.URL.createObjectURL(blob); // for FireFox
1273 document.body.appendChild(aTag);
1274 aTag.click();
1275 document.body.removeChild(aTag);
1276 } else if (window.webkitURL && window.webkitURL.createObject) {
1277 aTag.href = (window.URL || window.webkitURL).createObjectURL(blob); // for Chrome
1278 aTag.click();
1279 } else {
1280 alert("保存に失敗しました！");
1281 }
1282 }
1283
1284 function CSV_Markers() { // CSVデータのマーカー表示
1285 CSV_Check();
1286 for (i = 0; i <= (Data_CSV.length - 1); i++) {
1287 Marker_LAT[ Marker_count ] = Data_CSV[i][0];
1288 Marker_LON[ Marker_count ] = Data_CSV[i][1];
1289 Marker_NAM[ Marker_count ] = Data_CSV[i][2];
1290 Marker_LNK[ Marker_count ] = Data_CSV[i][3];
1291 Marker_ICN[ Marker_count ] = L.icon({
1292 iconUrl: Icon_Url,
1293 iconSize: [Icon_W, Icon_H],
1294 iconAnchor : [Icon_AW, Icon_AH],
1295 popupAnchor: [Icon_PW, Icon_PH]
1296 });
1297 Marker_ID[ Marker_count ] = "Marker" + Marker_ID_count;
1298 Marker_Drag_flag[ Marker_count ] = false;
1299 Marker_Drag_info[ Marker_count ] = "移動出来ません。";
1300 if( Data_CSV[i][0] != "" ) {
1301 if( !isNaN( Data_CSV[i][0] ) ) {
1302 Temp = Marker_count;
1303 Marker_setting();
1304 Marker_set();
1305 Layer_404[ Temp ] = Temp_shape;
1306 Layer_404[ Temp ].addTo(map);
1307 Layer_404_clone[ Temp ] = Temp_shape_clone;
1308 Layer_404_clone[ Temp ].addTo(map);
1309 }
1310 }
1311 Marker_count = Marker_count + 1;
1312 Marker_ID_count = Marker_ID_count + 1;
1313 }
1314 Marker_count = Marker_count - 1;
1315 }
1316
1317 function CSV_Lines() { // CSVデータの直線表示
1318 CSV_Check();
1319 for (i = 0; i <= (Data_CSV.length - 1); i++) {
1320 Lines_LAT[ Lines_Marker_count ] = Data_CSV[i][0];
1321 Lines_LON[ Lines_Marker_count ] = Data_CSV[i][1];
1322 Lines_NAM[ Lines_Marker_count ] = Data_CSV[i][2];
1323 Lines_LNK[ Lines_Marker_count ] = Data_CSV[i][3];
1324 Lines_ICN[ Lines_Marker_count ] = L.icon({
1325 iconUrl: Icon_Url,
1326 iconSize: [Icon_W, Icon_H],
1327 iconAnchor : [Icon_AW, Icon_AH],
1328 popupAnchor: [Icon_PW, Icon_PH]
1329 });
1330 Lines_Marker_ID[ Lines_Marker_count ] = "Lines" + Lines_Marker_ID_count;
1331 Lines_Drag_flag[ Lines_Marker_count ] = false;
1332 Lines_Drag_info[ Lines_Marker_count ] = "移動出来ません。";
1333 if( !isNaN( Lines_LAT[ Lines_Marker_count ] ) ) {
1334 Temp = Lines_Marker_count;
1335 Lines_Marker_setting();
3316 Marker_set();
1337 Layer_505_LM[ Temp ] = Temp_shape;
1338 Layer_505_LM[ Temp ].addTo(map);
1339 Layer_505_LM_clone[ Temp ] = Temp_shape_clone;
1340 Layer_505_LM_clone[ Temp ].addTo(map);
1341 Lines_Marker_count = Lines_Marker_count + 1;
1342 Lines_Marker_ID_count = Lines_Marker_ID_count + 1;
1343 } else {
1344 Lines_Marker_count = Lines_Marker_count + 1;
1345 Lines_Marker_ID_count = Lines_Marker_ID_count + 1;
1346 }
1347 }
1348 Leaflet_Lines_Draw();
1349 }
1350
1351 function CSV_Polygons() { // CSVデータの多角形表示
1352 CSV_Check();
1353 for (i = 0; i <= (Data_CSV.length - 1); i++) {
1354 Polygons_LAT[ Polygons_Marker_count ] = Data_CSV[i][0];
1355 Polygons_LON[ Polygons_Marker_count ] = Data_CSV[i][1];
1356 Polygons_NAM[ Polygons_Marker_count ] = Data_CSV[i][2];
1357 Polygons_LNK[ Polygons_Marker_count ] = Data_CSV[i][3];
1358 Polygons_ICN[ Polygons_Marker_count ] = L.icon({
1359 iconUrl: Icon_Url,
1360 iconSize: [Icon_W, Icon_H],
1361 iconAnchor : [Icon_AW, Icon_AH],
1362 popupAnchor: [Icon_PW, Icon_PH]
1363 });
1364 Polygons_Marker_ID[ Polygons_Marker_count ] = "Polygon" + Polygons_Marker_ID_count;
1365 Polygons_Drag_flag[ Polygons_Marker_count ] = false;
1366 Polygons_Drag_info[ Polygons_Marker_count ] = "移動出来ません。";
1367 if( !isNaN( Polygons_LAT[ Polygons_Marker_count ] ) ) {
1368 Temp = Polygons_Marker_count;
1369 Polygons_Marker_setting();
1370 Marker_set();
1371 Layer_505_PM[ Temp ] = Temp_shape;
1372 Layer_505_PM[ Temp ].addTo(map);
1373 Layer_505_PM_clone[ Temp ] = Temp_shape_clone;
1374 Layer_505_PM_clone[ Temp ].addTo(map);
1375 Polygons_Marker_count = Polygons_Marker_count + 1;
1376 Polygons_Marker_ID_count = Polygons_Marker_ID_count + 1;
1377 } else {
1378 Polygons_Marker_count = Polygons_Marker_count + 1;
1379 Polygons_Marker_ID_count = Polygons_Marker_ID_count + 1;
1380 }
1381 }
1382 Leaflet_Polygons_Draw();
1383 }
1384
1385 function CSV_Circles() { // CSVデータの円表示
1386 CSV_Check();
1387 for (i = 0; i <= (Data_CSV.length - 1); i++) {
1388 Circles_LAT[ Circles_count ] = Data_CSV[i][0] * 1.0;
1389 Circles_LON[ Circles_count ] = Data_CSV[i][1] * 1.0;
1390 Circles_NAM[ Circles_count ] = Data_CSV[i][2];
1391 Circles_LNK[ Circles_count ] = Data_CSV[i][3];
1392 Circles_RAD[ Circles_count ] = Data_CSV[i][4] * 1.0;
1393 Circles_ID[ Circles_count ] = "Circle" + Circles_ID_count;
1394 Circles_Drag_flag[ Circles_count ] = false;
1395 Circles_Drag_info[ Circles_count ] = "移動出来ません。";
1396 if ( !isNaN( Circles_LAT[ Circles_count ] ) ) {
1397 if ( (Circles_LAT[ Circles_count ] != 0) && (Circles_LON[ Circles_count ] != 0)) {
1398 Circles_Set( Circles_count );
1399 Circles_count = Circles_count + 1;
1400 Circles_ID_count = Circles_ID_count + 1;
1401 }
1402 }
1403 }
1404 }
1405
1406 function CSV_Check() { // CSVデータの範囲制限
1407 for (i = 0; i <= (Data_CSV.length - 1); i++) {
1408 if((Data_CSV[i][0] * 1.0) > 90) {
1409 Data_CSV[i][0] = 90;
1410 }
1411 if((Data_CSV[i][0] * 1.0) < -90) {
1412 Data_CSV[i][0] = -90;
1413 }
1414 while( (Data_CSV[i][1] * 1.0) < -180) {
1415 Data_CSV[i][1] = Data_CSV[i][1] * 1.0 + 360;
1416 }
1417 while( (Data_CSV[i][1] * 1.0) > 180) {
1418 Data_CSV[i][1] = Data_CSV[i][1] * 1.0 - 360;
1419 }
1420 }
1421 }
1422
1423 function Leaflet_Mouse_ON() { // マウス位置表示
1424 Mouse_Position.addTo(map);
1425 }
1426 function Leaflet_Mouse_OFF() { // マウス位置非表示
1427 map.removeControl(Mouse_Position);
1428 }
1429
1430 function Leaflet_Search_ON() { // 検索窓表示
1431 osmGeocoder = new L.Control.OSMGeocoder();
1432 map.addControl(osmGeocoder);
1433 }
1434 function Leaflet_Search_OFF() { // 検索窓非表示
1435 map.removeControl(osmGeocoder);
1436 }
1437
1438 </script>
1439 </head>
1440 <body onload="init()">
1441 <nav id="menu-wrap" style=" z-index: 1000;">
1442 <ul id="menu" style="width: 98%;">
1443 <li><a href="#">地図の選択</a>
1444 <ul id="scroll">
1445 <li><a><input type = "radio" name = "Basic_Layer" value = "0" checked onclick = "javascript: Sel_Basic_Layer();">Open Street Map</a></li>
1446 <li><a><input type = "radio" name = "Basic_Layer" value = "1" onclick = "javascript: Sel_Basic_Layer();">国土地理院 標準地図</a></li>
1447 <li><a><input type = "radio" name = "Basic_Layer" value = "2" onclick = "javascript: Sel_Basic_Layer();">国土地理院 淡色地図</a></li>
1448 <li><a><input type = "radio" name = "Basic_Layer" value = "3" onclick = "javascript: Sel_Basic_Layer();">国土地理院 写真</a></li>
1449 <li><a><input type = "radio" name = "Basic_Layer" value = "4" onclick = "javascript: Sel_Basic_Layer();">国土地理院 白地図</a></li>
1450 <li><a><input type = "radio" name = "Basic_Layer" value = "5" onclick = "javascript: Sel_Basic_Layer();">Stamen Toner-Background</a></li>
1451 <li><a><input type = "radio" name = "Basic_Layer" value = "6" onclick = "javascript: Sel_Basic_Layer();">Stamen Toner-Lite</a></li>
1452 <li><a><input type = "radio" name = "Basic_Layer" value = "7" onclick = "javascript: Sel_Basic_Layer();">Stamen Watercolor</a></li>
1453 <li><a><input type = "radio" name = "Basic_Layer" value = "8" onclick = "javascript: Sel_Basic_Layer();">Esri World Topo Map</a></li>
1454 <li><a><input type = "radio" name = "Basic_Layer" value = "9" onclick = "javascript: Sel_Basic_Layer();">Esri Ocean Base Map</a></li>
1455 <li><a><input type = "radio" name = "Basic_Layer" value = "10" onclick = "javascript: Sel_Basic_Layer();">NASA EOSDIS GIBS/Coast Lines</a></li>
1456 </ul>
1457 </li>
1458 <li><a href="#">オーバーレイ選択</a>
1459 <ul id="scroll">
1460 <div id="Over_Layer" >
1461 <li><a><input type = "checkbox" id="ckbox0" value = "0" >Stamen toner-hybrid</a></li>
1462 <li><a><input type = "checkbox" id="ckbox1" value = "1" >Stamen toner-lines</a></li>
1463 <li><a><input type = "checkbox" id="ckbox2" value = "2" >Stamen toner-labels</a></li>
1464 <li><a><input type = "checkbox" id="ckbox3" value = "3" >Open Sea Map SeaMark</a></li>
1465 <li><a><input type = "checkbox" id="ckbox4" value = "4" >Water Mask</a></li>
1466 <li><a><input type = "checkbox" id="ckbox5" value = "5" >1W Earthquake-Geojson</a></li>
1467 </div>
1468 </ul>
1469 </li>
1470 <li><a href="#">図形の設置</a>
1471 <ul>
1472 <li><a href="#" onclick = "Dialog_001()">マーカーのスタイル設定</a></li>
1473 <li><a href="#" onclick = "Dialog_003()">線のスタイル設定</a></li>
1474 <li><a href="#">---------------------------------------------</a></li>
1475 <li><a href="#">マーカー設置・消去 ≫</a>
1476 <ul>
1477 <li><a href="#" onclick = "Leaflet_Marker_400()">マーカー単独設置 </a></li>
1478 <li><a href="#" onclick = "Leaflet_Marker_402()">マーカー連続設置 </a></li>
1479 <li><a href="#" onclick = "Leaflet_Marker_404()">マーカー連続設置終了 </a></li>
1480 <li><a href="#" onclick = "Leaflet_Marker_405()">マーカー全消去 </a></li>
1481 <li><a href="#" onclick = "Leaflet_Marker_406()">マーカー保存（CSV形式） </a></li>
1482 <li><a href="#" onclick = "Leaflet_Marker_407()">データの読込（CSV形式） </a></li>
1483 </ul>
1484 </li>
1485 <li><a href="#">直線の設置・消去 ≫</a>
1486 <ul>
1487 <li><a href="#" onclick = "Leaflet_Lines_500()">直線の設置 </a></li>
1488 <li><a href="#" onclick = "Leaflet_Lines_502()">直線の設置終了 </a></li>
1489 <li><a href="#" onclick = "Leaflet_Lines_503()">直線の全消去 </a></li>
1490 <li><a href="#" onclick = "Leaflet_Lines_504()">直線用マーカー非表示 </a></li>
1491 <li><a href="#" onclick = "Leaflet_Lines_505()">直線用マーカー再表示 </a></li>
1492 <li><a href="#" onclick = "Leaflet_CSV_510()">直線データの保存（CSV形式） </a></li>
1493 <li><a href="#" onclick = "Leaflet_Marker_407()">データの読込（CSV形式） </a></li>
1494 </ul>
1495 </li>
1496 <li><a href="#">多角形の設置・消去 ≫</a>
1497 <ul>
1498 <li><a href="#" onclick = "Leaflet_Polygons_500()">多角形の設置 </a></li>
1499 <li><a href="#" onclick = "Leaflet_Polygons_502()">多角形の設置終了 </a></li>
1500 <li><a href="#" onclick = "Leaflet_Polygons_503()">多角形の全消去 </a></li>
1501 <li><a href="#" onclick = "Leaflet_Polygons_504()">多角形用マーカー非表示 </a></li>
1502 <li><a href="#" onclick = "Leaflet_Polygons_505()">多角形用マーカー再表示 </a></li>
1503 <li><a href="#" onclick = "Leaflet_CSV_511()">多角形データの保存（CSV形式） </a></li>
1504 <li><a href="#" onclick = "Leaflet_Marker_407()">データの読込（CSV形式） </a></li>
1505 </ul>
1506 </li>
1507 <li><a href="#">円の設置・消去 ≫</a>
1508 <ul>
1509 <li><a href="#" onclick = "Leaflet_Circles_500()">円の設置 </a></li>
1510 <li><a href="#" onclick = "Leaflet_Circles_501()">円の全消去 </a></li>
1511 <li><a href="#" onclick = "Leaflet_CSV_512()">円データの保存（CSV形式） </a></li>
1512 <li><a href="#" onclick = "Leaflet_Marker_407()">データの読込（CSV形式） </a></li>
1513 </ul>
1514 </li>
1515 </ul>
1516 </li>
1517 <li><a href="#">ユーティリティ</a>
1518 <ul>
1519 <li><a href="#" onclick = "Dialog_001()">マーカーのスタイル設定</a></li>
1520 <li><a href="#" onclick = "Dialog_003()">線のスタイル設定</a></li>
1521 <li><a href="#">グリッド線表示・非表示 ≫</a>
1522 <ul>
1523 <li><a href="#" onclick = "Grid_on_W();">白のグリッド線表示・更新 </a></li>
1524 <li><a href="#" onclick = "Grid_on_B();">黒のグリッド線表示・更新 </a></li>
1525 <li><a href="#" onclick = "Grid_off();">グリッド線非表示 </a></li>
1526 </ul>
1527 </li>
1528 <li><a href="#">マウス位置表示・非表示 ≫</a>
1529 <ul>
1530 <li><a href="#" onclick = "Leaflet_Mouse_ON();">マウス位置表示 </a></li>
1531 <li><a href="#" onclick = "Leaflet_Mouse_OFF();">マウス位置非表示 </a></li>
1532 </ul>
1533 </li>
1534 <li><a href="#">検索窓の表示・非表示 ≫</a>
1535 <ul>
1536 <li><a href="#" onclick = "Leaflet_Search_ON();">検索窓の表示 </a></li>
1537 <li><a href="#" onclick = "Leaflet_Search_OFF();">検索窓の非表示 </a></li>
1538 </ul>
1539 </li>
1540 </ul>
1541 </li>
1542 </ul>
1543 </nav>
1544
1545 <div id="map_Layer">
1546 <div id="map" style="width: 100%; height: 95%; border: solid 1px; top: 1px;"></div>
1547 ここで使用しているアイコン素材は、<A HREF = "http://flat-icon-design.com/" target="_blank"> FLAT ICON DESIGN </A>および
1548 <A HREF = "http://icooon-mono.com/" target="_blank"> ICOON MONO </A>から取得しており、これらアイコン素材データの著作権は TopeconHeroes が保持しています。
1549 </div>
1550 </body>
1551 </html>
地図表示とオーバーレイ表示の選択については、『 Leaflet_Tutrial_301.html 』と異なり、上部メニューから選択するように変更しました。
次の『 Map_Data_601.js 』のソースファイル内容では、地図表示の選択箇所を赤字で、オーバーレイ表示の選択箇所をオレンジ色で表示しています。
001 // Map_Data_601.js
002
003 var Basic_Map = new Array();
004 Basic_Map[ 0 ] = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
005 attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
006 continuousWorld: false
007 });
008 Basic_Map[ 1 ] = L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/std/{z}/{x}/{y}.png', {
009 attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>"
010 });
011 Basic_Map[ 2 ] = L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/pale/{z}/{x}/{y}.png', {
012 attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>"
013 });
014 Basic_Map[ 3 ] = L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/seamlessphoto/{z}/{x}/{y}.jpg', {
015 attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>"
016 });
017 Basic_Map[ 4 ] = L.tileLayer('https://cyberjapandata.gsi.go.jp/xyz/blank/{z}/{x}/{y}.png', {
018 attribution: "<a href='https://maps.gsi.go.jp/development/ichiran.html' target='_blank'>地理院タイル</a>"
019 });
020 Basic_Map[ 5 ] = L.tileLayer('http://{s}.tile.stamen.com/{variant}/{z}/{x}/{y}.png', {
021 attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ',
022 variant: 'toner-background'
023 });
024 Basic_Map[ 6 ] = L.tileLayer('http://{s}.tile.stamen.com/{variant}/{z}/{x}/{y}.png', {
025 attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ',
026 variant: 'toner-lite'
027 });
028 Basic_Map[ 7 ] = L.tileLayer('http://{s}.tile.stamen.com/{variant}/{z}/{x}/{y}.png', {
029 minZoom: 1,
030 maxZoom: 16,
031 attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ',
032 variant: 'watercolor'
033 });
034 Basic_Map[ 8 ] = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/World_Topo_Map/MapServer/tile/{z}/{y}/{x}', {
035 attribution: 'Tiles © <a href="http://www.esrij.com/"> Esri Japan </a>'
036 });
037 Basic_Map[ 9 ] = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer/tile/{z}/{y}/{x}', {
038 maxZoom: 13,
039 attribution: 'Tiles by <a href="http://www.esrij.com/"> Esri Japan </a>'
040 });
041 Basic_Map[ 10 ] = new L.GIBSLayer('Coastlines', {
042 date: new Date('2015/04/01'),
043 transparent: true
044 });
045
046 var Over_Layer = new Array();
047 Over_Layer[ 0 ] = L.tileLayer('http://{s}.tile.stamen.com/{variant}/{z}/{x}/{y}.png', {
048 attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ' +
049 '<a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — ' +
050 'Map data {attribution.OpenStreetMap}',
051 variant: 'toner-hybrid'
052 });
053 Over_Layer[ 1 ] = L.tileLayer('http://{s}.tile.stamen.com/{variant}/{z}/{x}/{y}.png', {
054 attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ' +
055 '<a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — ' +
056 'Map data {attribution.OpenStreetMap}',
057 variant: 'toner-lines'
058 });
059 Over_Layer[ 2 ] = L.tileLayer('http://{s}.tile.stamen.com/{variant}/{z}/{x}/{y}.png', {
060 attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, ' +
061 '<a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> — ' +
062 'Map data {attribution.OpenStreetMap}',
063 variant: 'toner-labels'
064 });
065 Over_Layer[ 3 ] = L.tileLayer('http://tiles.openseamap.org/seamark/{z}/{x}/{y}.png', {
066 attribution: "<a href='http://www.openseamap.org' target='_blank'>OpenSeaMap</a> contributors"
067 });
068 Over_Layer[ 4 ] = new L.GIBSLayer('MODIS_Water_Mask', {
069 date: new Date('2018/11/15'),
070 transparent: true
071 });
072 Over_Layer[ 5 ] = new L.GeoJSON.AJAX(
073 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_day.geojson",
074 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/4.5_week.geojson",
075 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_week.geojson",
076 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/1.0_week.geojson",
077 "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_week.geojson",
078 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/4.5_month.geojson",
079 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_month.geojson",
080 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/1.0_month.geojson",
081 // "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.geojson",
082 {pointToLayer: function (feature, latlng) {
083 return L.circleMarker(latlng, {
084 radius: feature.properties.mag * feature.properties.mag / 3,
085 fillcolor: "#FF7800",
086 color: "#FF7800",
087 weight: 1,
088 opacity: 0.5,
089 fillOpacity: 0.5
090 }); },
091 onEachFeature: function (feature, layer) {
092 layer.bindPopup(new Date(feature.properties.time).toUTCString() + " / " + feature.properties.title);
093 }
094 });
095
096 var OverLayerFlag = new Array();
097
098 function Sel_Basic_Layer() {
099 Temp = null;
100 Temp = document.getElementsByName("Basic_Layer");
101 for (i=0; i<Temp.length; i++) {
102 if(Temp[i].checked) {
103 map.removeLayer(Layer_00);
104 Layer_00 = Basic_Map[ i ];
105 map.addLayer(Layer_00);
106 }
107 }
108 }
109
110 $(function() {
111 $("#Over_Layer :checkbox").change(function() {
112 var cb_count = Over_Layer.length;
113 for (i = 0; i < cb_count; i++) {
114 Temp = $("#ckbox" + String(i) + ":checked").val();
115 if( Temp == i ) {
116 map.addLayer(Over_Layer[ i ]);
117 OverLayerFlag[ i ] = 1;
118 } else {
119 if (OverLayerFlag[ i ] == 1) {
120 map.removeLayer(Over_Layer[ i ]);
121 OverLayerFlag[ i ] = 0;
122 }
123 }
124 }
125 });
126 });
127
128 function dummy() {
129 alert("Under Construction!");
130 }