防災　福井

fullscreen

pingineer

2013年度に実施された「福井県Ｗｅｂアプリコンテスト」の優秀賞を受賞した「防災福井」の移植

Rating

useful

Application

Play
JavaScript
CSS
HTML
ReadMe
Snapshots

var map;
var rain_gauge_markers = new Array();
var water_gauge_markers = new Array();
var live_cam_markers = new Array();
var fileArray = new Array();
fileArray = [
	{"workValue":"rdf1s1832i",
	 "fileValue":"rain_gauge_station",
	 "icon":"http://maps.google.com/mapfiles/ms/micons/rainy.png",
	 "array":rain_gauge_markers
	},
	{"workValue":"rdf1s1833i",
	 "fileValue":"water_gauge_station",
	 "icon":"http://maps.google.co.jp/mapfiles/ms/icons/water.png",
	 "array":water_gauge_markers
	},
	{"workValue":"rdf1s1834i",
	 "fileValue":"river_monitoring_camera",
	 "icon":"http://maps.google.com/mapfiles/kml/pal4/icon46.png",
	 "array":live_cam_markers
	}
];

window.onload = function() {
	// google mapの準備	
	Gmap_init();
	
	// Menuを作成
	Make_menu();
	
	// 雨量観測所のマーカーを追加
	for(var i=0; i<fileArray.length;i++){
		Get_markers_data(fileArray[i]["workValue"],fileArray[i]["fileValue"],fileArray[i]["icon"],fileArray[i]["array"]);
	}

};

// markerを消す
function Delete_markers(array) {
	for(var i=0; i<array.length; i++){
		// keep_flgが0ならpolygonの配列等を削除
		delete array[i].ext;
		array[i].setMap(null);
		array.splice(i,1);
		i--;
	}
}

#map_canvas {
	width: 100%;
	height: 100%;
}

#user-window {
	position: absolute;
	color: #ffffff;
	top: 0px;
	right: 50px;
	//height: 50px;
	width: 220px;
	//background-color: rgba(0,0,0,0.6);
	border-radius: 3px;
	font: 12px sans-serif;
	font-weight: bold;
	padding: 0px;
	text-align: right;
}

.open_menu{
	background-color: rgba(0,0,0,0.6);
	color: #fff;
	font: 10px sans-serif;
	cursor: pointer;
	width:50px;
	padding: 2px;
	text-align: center;
}

#slideBox_menu{
	text-align: left;
	width: 230px;
	padding: 10px;
	border: 1px #ccc solid;
	display:none;
}

.open1{
	background-color: rgba(0,0,0,0.6);
	color: #fff;
	font: 10px sans-serif;
	cursor: pointer;
	width:100px;
	padding: 2px;
	text-align: center;
}
#slideBox1{
	text-align: left;
	width: 200px;
	background-color: rgba(0,0,0,0.6);
	padding: 2px;
	border: 1px #ccc solid;
	display:none;
}

.open2{
	background-color: rgba(0,0,0,0.6);
	color: #fff;
	font: 10px sans-serif;
	cursor: pointer;
	width:100px;
	padding: 2px;
	text-align: center;
}
#slideBox2{
	text-align: left;
	width: 200px;
	background-color: rgba(0,0,0,0.6);
	padding: 2px;
	border: 1px #ccc solid;
	display:none;
}

.open3{
	background-color: rgba(0,0,0,0.6);
	color: #fff;
	font: 10px sans-serif;
	cursor: pointer;
	width:100px;
	padding: 2px;
	text-align: center;
}
#slideBox3{
	text-align: left;
	width: 200px;
	background-color: rgba(0,0,0,0.6);
	padding: 2px;
	border: 1px #ccc solid;
	display:none;
}
.open4{
	background-color: rgba(0,0,0,0.6);
	color: #fff;
	font: 10px sans-serif;
	cursor: pointer;
	width:100px;
	padding: 2px;
	text-align: center;
}
#slideBox4{
	text-align: right;
	width: 215px;
	background-color: rgba(0,0,0,0.6);
	padding: 10px;
	border: 1px #ccc solid;
	display:none;
}

#infowindow_class {
	width: 800px;
	height: 600px;
	font-size:8pt;
	overflow: hidden;
}
#current_position {
  height: 20px;
  //width: 80px;
  width: 140px;
  font-size: 10px;
  resize: none;
  overflow: hidden;
}