防災　横須賀

fullscreen

pingineer

横須賀市のハザードマップ AED設置箇所及び広域避難地、津波想定区域を表示 chromeで動かない

Rating

useful

Application

Play
JavaScript
CSS
HTML
ReadMe
Snapshots

防災　横須賀
jquery-1.7.1.min.js
gmap.js
hazard_map.js
http://maps.googleapis.com/maps/api/js?v3.exp&sensor=false&hl=ja
aed.js
ui.js
safety_evacuation_area.js
tsunami_area1_rank1.js
tsunami_area1_rank2.js
tsunami_area1_rank3.js
tsunami_area2_rank1.js
tsunami_area2_rank2.js
tsunami_area2_rank3.js
tsunami_area3_rank1.js
tsunami_area3_rank2.js
tsunami_area3_rank3.js

/*
This is a Example program to retrieve and display the data. 
Press the Run button on the right of the screen (described the behavior of the Example program below). 
Please create a new application rewrite this program work. 
*/

if(typeof Example==="undefined"||!Example){var Example = {};}

var data = {};
data.limit = 1;
data.count = 0;
data.workIds = [];
data.fileNames = [];
data.subjects = [];
data.properties = [];

Example.getWorks = function() {
	var callback = function(res) {
	console.log("ugoiteru?");
		$.each(res, function(key, workId) {
			data.workIds.push(workId);
		});
		
		$.each(data.workIds, function(key, workId) {
			console.log(workId);
			Example.getFiles(workId);
		});
	}
	LinkData.getWorks(callback);
};

Example.getFiles = function(workId) {
	var callback = function(res) {
		$.each(res, function(fileKey, fileName) {
			console.log(workId + "," + fileName);
			Example.getSubjects(workId, fileName);
		});
	}
	LinkData.getFiles(workId, callback);
};

Example.getSubjects = function(workId, fileName) {
	var callback = function(res) {
		$.each(res, function(subjectKey, subjectValue) {
			data.subjects.push(subjectValue);
		});
		
		Example.getProperties(workId, fileName);
	}
	
	LinkData.getSubjects(workId, fileName, callback);
};

Example.getProperties = function(workId, fileName) {
	var callback = function(res) {
		$.each(res, function(propertyKey, propertyValue) {
			data.properties.push(propertyValue);
		});
		
		Example.getObjectList(workId, fileName);
	}
	LinkData.getProperties(workId, fileName, callback);
};

Example.getObjectList = function(workId, fileName) {
	$.each(data.subjects, function(sKey, sValue) {
		data.count = 0;
		$.each(data.properties, function(pKey, pValue) {
			if(data.count++ > data.limit) {
				return false;
			}
			Example.getObjects(workId, fileName, sValue, pValue);
		});
	});
}

Example.getObjects = function(workId, fileName, subject, property) {
	var callback = function(res) {
		$("#result").append("<div style='padding-top:10px;'>Subject : " + subject + "</div>");
		$("#result").append("<div style='padding-left:10px;'>Property : " + property + "</div>");
		$("#result").append("<div style='padding-left:20px;'>Objects</div>");
		console.log("test1" + res);
		$.each(res, function(objectKey, objectValue) {
			console.log("test2" + objectKey + "," + objectValue);
			$("#result").append("<div style='padding-left:30px;'>" + objectValue + "</div>");
		});
	}
	LinkData.getObjects(workId, fileName, subject, property, callback);
};

window.onload = function() {
	initialize();
	//Example.getWorks();
	
}

html, body {
        height: 100%;
        margin: 0;
        padding: 0;
}

#shelter_infowindow_class {
   width: 400px;
   height: 350px;
        font-size:10pt;
        overflow: hidden;
}

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

#user-window {
        position: absolute;
        color: #ffffff;
        top: 0px;
        right: 50px;
        width: 220px;
        border-radius: 3px;
        font: 12px sans-serif;
        font-weight: bold;
        padding: 0px;
        text-align: right;
}

#current {
        height: 20px;
        width: 140px;
        font-size: 10px;
        resize: none;
        overflow: hidden;
}

#shelter {
        height: 20px;
        width: 140px;
        font-size: 10px;
        resize: none;
        overflow: hidden;
}

#water-level-windowclass {
        width: 370px;
        height: 250px;
        font-size:8pt;
        overflow: hidden;
}

#water-level-area-windowclass {
        width: 480px;
        height: 500px;
        font-size:8pt;
        overflow: hidden;
}

#livecam-windowclass {
        width: 200px;
        height: 60px;
        font-size:8pt;
        overflow: hidden;
}

#rainfall-windowclass {
        width: 370px;
        height: 400px;
        font-size:8pt;
        overflow: hidden;
}

#rainfall-area-windowclass {
        width: 480px;
        height: 500px;
        font-size:8pt;
        overflow: hidden;
}

.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: right;
        width: 215px;
        background-color: rgba(0,0,0,0.6);
        padding: 10px;
        border: 1px #ccc solid;
        display:none;
}

.open12{
        background-color: rgba(0,0,0,0.6);
        color: #fff;
        font: 10px sans-serif;
        cursor: pointer;
        width:100px;
        padding: 2px;
        text-align: center;
}
#slideBox12{
        text-align: left;
        width: 200px;
        background-color: rgba(0,0,0,0.6);
        padding: 10px;
        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: 10px;
        border: 1px #ccc solid;
        display:none;
}

.open11{
        background-color: rgba(0,0,0,0.6);
        color: #fff;
        font: 10px sans-serif;
        cursor: pointer;
        width:100px;
        padding: 2px;
        text-align: center;
}
#slideBox11{
        text-align: left;
        width: 200px;
        background-color: rgba(0,0,0,0.6);
        padding: 10px;
        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: 10px;
        border: 1px #ccc solid;
        display:none;
}

.open10{
        background-color: rgba(0,0,0,0.6);
        color: #fff;
        font: 10px sans-serif;
        cursor: pointer;
        width:100px;
        padding: 2px;
        text-align: center;
}
#slideBox10{
        text-align: left;
        width: 200px;
        background-color: rgba(0,0,0,0.6);
        padding: 10px;
        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: left;
        width: 200px;
        background-color: rgba(0,0,0,0.6);
        padding: 2px;
        border: 1px #ccc solid;
        display:none;
}

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

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

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

.open8{
        background-color: rgba(0,0,0,0.6);
        color: #fff;
        font: 10px sans-serif;
        cursor: pointer;
         width:100px;
        padding: 2px;
        text-align: center;
}
#slideBox8{
        text-align: right;
        width: 215px;
        background-color: rgba(0,0,0,0.6);
        padding: 10px;
        border: 1px #ccc solid;
        display:none;
}
#genzai {
        height: 20px;
        width: 140px;
        font-size: 10px;
        resize: none;
        overflow: hidden;
}

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

#help_open{
        background-color: rgba(0,0,0,0.6);
  color: #ffffff;
        position: absolute;
        top: 10px;
        right: 150px;
        display:block;
        width: 30px;
        text-align: center;
        font-size: 10px;
        padding:2px;
        cursor: pointer;
}

#overlay_help{
        display: none;
        width: 90%;
        height:90%;
        text-align: center;
        position: fixed;
        top: 0;
        z-index: 100;
        background: rgba(0,0,0,0.7);
}

#help_close{
        background: #eeeeee;
        color: #717171;
        width: 70px;
        margin: auto;
        text-align: center;
        font-size: 15px;
        padding:5px 0 5px 10px;
        border-radius: 3px;
        cursor: pointer;
}

#aed_infowindow_class {
        width: 200px;
        font-size:8pt;
        overflow: hidden;
}

<div id="map_canvas"></div>
<div id="user-window">
	<p class="open_menu">menu</p>
	<div id="slideBox_menu">
		
		<p class="open12">AED</p>
		<div id="slideBox12"><form>
			<input type="checkbox" name="aed" value="1" onchange='Aed_change(value);' checked>表示する<br>
		</form></div>
		
		<p class="open11">広域避難地</p>
		<div id="slideBox11"><form>
			<input type="checkbox" name="wide_area" value="1" onchange='Wide_area_change(value);' checked>表示する<br>
		</form></div>
		
		<p class="open10">津波</p>
		<div id="slideBox10"><form>
			<input type="checkbox" name="tsunami_rank" value="1" onchange='Tsunami_rank_change(value);' checked>表示する<br>
			<select name="tsunami_rank" onchange='Tsunami_rank_change(value);'>
				<option value="1">ランク1</option>
				<option value="2">ランク2</option>
				<option value="3" selected>ランク3</option>
			</select>
		</form></div>
		
		<p class="open8">位置変更</p>
		<div id="slideBox8"><form id="genzai_form">
			<div>位置:<textarea id="genzai" wrap="off"></textarea>
				<input type="button" value="移動" onclick='Genzai_change(value);'>
			</div>
		</form></div>
		
	</div>
</div>

jquery-1.7.1.min.js

gmap.js

hazard_map.js

http://maps.googleapis.com/maps/api/js?v3.exp&sensor=false&hl=ja

aed.js

ui.js

safety_evacuation_area.js

tsunami_area1_rank1.js

tsunami_area1_rank2.js

tsunami_area1_rank3.js

tsunami_area2_rank1.js

tsunami_area2_rank2.js

tsunami_area2_rank3.js

tsunami_area3_rank1.js

tsunami_area3_rank2.js

tsunami_area3_rank3.js

Fork this app as your new one download

Web Search

Contributor Send Message	pingineer
Run count	284
Website
License
Fork count	1
Created date	Mar 11, 2014
Last update date	Mar 12, 2014

Forked (Child App)

【駒ヶ根市】土石流特別警戒区域 Contributor: 長野県駒ヶ根市 Update: Mar 12, 2015 473 runs

Input Data
Related Ideas

This application does not using any data or contains private/limited data.

News Feed

linkdata.org に関するツイート

Publish your application as JavaScript

that mashes up the Linked Open Data

Application Information

防災　横須賀

Application

Forked (Child App)

News Feed

Publish your application as JavaScript

that mashes up the Linked Open Data

Application Information

防災 横須賀

Application

Forked (Child App)

News Feed

防災　横須賀