クマ目撃情報

須坂市内のツキノワグマ出没情報（平成24年~平成27年）を地図上に表示します。【ご利用にあたって】アイコンが表示される位置は目安です。正確な位置ではありません。【更新履歴】 2016.09.13　目撃された年ごとに表示する機能を追加しました。

評価指数

アプリケーション

Play
JavaScript
CSS
HTML
概要
保存した実行結果

/*
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. 
*/

//目撃情報を取得
var all_data;        
function initialize(){
	all_data = new Array();
	// データをLinkDataから取得 
	tmp_a_data = new Array();
	$.each(LinkData.getWorks(), function(workKey, workValue) {
		$.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
		  $.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {
            var tmp_data = {}
			tmp_data["id"] = subjValue;
			$.each(LinkData.getProperties(workValue, fileValue), function(propKey, propValue) {
				$.each(LinkData.getObjects(workValue, fileValue, subjValue, propValue), function(objKey, objValue) {
						if(propValue == "http://linkdata.org/property/rdf1s2595i#" + encodeURIComponent("日付")){
							tmp_data["date"] = objValue;
						}else if(propValue == "http://www.w3.org/2003/01/geo/wgs84_pos#lat"){
							tmp_data["lat"] = objValue;
						}else if(propValue == "http://www.w3.org/2003/01/geo/wgs84_pos#long"){
							tmp_data["lng"] = objValue;
						}else if(propValue == "http://linkdata.org/property/rdf1s2595i#" + encodeURIComponent("状況")){
							tmp_data["situation"] = objValue;
						}else if(propValue == "http://linkdata.org/property/rdf1s2595i#" + encodeURIComponent("備考")){
							tmp_data["foods"] = objValue;
						}else if(propValue == "http://linkdata.org/property/rdf1s2595i#" + encodeURIComponent("場所")){
						    tmp_data["area"] = objValue;
						
						}
					});
					
				});
                                tmp_a_data.push(tmp_data);
			});
		});
	});
	//全データ
	all_data = tmp_a_data;

//ポイントの設定
	var latlng, y;
	var data = new Array();
	var year = new Array();
	var gmarker_data = new Array();
	var myMap = makeGmap();
	
	for (var i in all_data) {
		//＊＊＊の種類で区分する
		
		// 緯度経度から中心点をつくる
		latlng = new google.maps.LatLng(all_data[i].lat,all_data[i].lng);
		if ((all_data[i].situation == "目撃")){
			gmarker_data.push({
				pos: latlng, 
				ti: all_data[i].situation,
				ic: "http://app.linkdata.org/asset/c7735142.png",
				dt: all_data[i].date,
				food: all_data[i].foods
			});
		} else if(all_data[i].situation == "農作物被害"){
			gmarker_data.push({
				pos: latlng, 
				ti: all_data[i].situation,
				ic: "http://app.linkdata.org/asset/5cd0bb65.png",
				dt: all_data[i].date,
				food: all_data[i].foods
			});
		} else if(all_data[i].situation == "捕獲"){
			gmarker_data.push({
				pos: latlng, 
				ti: all_data[i].situation,
				ic: "http://app.linkdata.org/asset/9a2887f0.png",
				dt: all_data[i].date,
				food: all_data[i].foods
			});
		} else{
			gmarker_data.push({
				pos: latlng, 
				ti: all_data[i].situation,
				ic: "http://app.linkdata.org/asset/1f7ef153.png",
				dt: all_data[i].date,
				food: all_data[i].foods
			});
		}
		
		makeGmarker(gmarker_data[i], myMap);
		
		y = all_data[i].date.substr(0,4);
		if($.inArray(y, year) < 0)	year.push(y);
		gmarker_data[i].year = y;
		
	}; //for toji
	
	// 年のselectを生成
	year.sort();
	for (var i in year) {
		$("#year").append($("<option>").val(year[i]).text(year[i]));
	}

// 年を選択されたときに、その年の情報だけを表示する
	$('#year').change(function(){
		var myMap = makeGmap()
		for (var i in gmarker_data) {
			if($(this).val() == "all" || gmarker_data[i].year == $(this).val()) {
				makeGmarker(gmarker_data[i], myMap);
			}
		}
	});
	
};//initialize toji

// Mapの生成
function makeGmap() {
	//地図センター緯度経度の初期値は「須坂市役所」
	var myLatLng = new google.maps.LatLng(36.651080,138.307227);
	return new google.maps.Map(document.getElementById('result'), {
		zoom: 12,
		center: myLatLng,
		mapTypeId: google.maps.MapTypeId.ROADMAP,
		scaleControl: true,
		scrollwheel: true,
		draggable: true
	});
}

// Map上に表示するマーカーの生成
function makeGmarker(data, gmap) {
	var marker = new google.maps.Marker({  
		position: data.pos,	// 緯度・経度は地図の中心  
		title: data.ti,		// ツールチップ 
		openInfo:true,
		icon: data.ic,
		map: gmap
	});
	
	// ウィンドウに表示するデータをつくる
	var content = data.dt + '<br>' + data.ti;
	if(data.food != undefined){
		content = content + '<br>' + data.food;
	}
	// 地図上にウィンドウで表示
	attachMessage(marker, content);
}

// 地図のマーカーをクリックするとウィンドウを表示する処理
function attachMessage(marker, msg) {
	google.maps.event.addListener(marker, 'click', function(event) {
    	new google.maps.InfoWindow({
			content: msg
        }).open(marker.getMap(), marker);
    });
};

window.onload = function() {
    $(function(){
    	initialize();        
    });	
};

このアプリをForkして新しいアプリを作るダウンロード

このアプリ作品をwebから探す

作者メッセージ送信	長野県須坂市
Fork元のアプリ	長野県須坂市 's 須坂市の避難場所
実行回数	2965
ウェブサイト
ライセンス
Fork count	1
作成日	2015年1月28日
最終更新日	2018年6月26日