京都観光スポットリスト_2

fullscreen

kyolib2013

このアプリにて使用した京都観光スポットの英語名称につきまして、独自のルールを設けて行って、翻訳および表記を行っています。データをご利用する際、ご了承ください。また、修正やご意見をどうぞお気軽に！

評価指数

アプリケーション

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) {
		//$("#result").append("<h3>Work: " + workValue + "</h3>");
		$.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
			//$("#result").append("<h4>File: " + fileValue + "</h4>");
			$.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {
            var tmp_data = {}
				tmp_data["id"] = subjValue;
				$.each(LinkData.getProperties(workValue, fileValue), function(propKey, propValue) {
					//$("#result").append("<div style='padding-top:10px;'>Subject : " + subjValue + "</div>");
					//$("#result").append("<div style='padding-left:10px;'>Property : " + propValue + "</div>");
					//$("#result").append("<div style='padding-left:20px;'>Objects</div>");
					$.each(LinkData.getObjects(workValue, fileValue, subjValue, propValue), function(objKey, objValue) {
						//$("#result").append("<div style='padding-left:30px;'>" + objValue + "</div>");
                                                if(propValue == "http://www.w3.org/2000/01/rdf-schema#label"){
							tmp_data["label"] = 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/rdf1s804i#spot_type"){
							tmp_data["spot_type"] = objValue;
						}else if(propValue == "http://linkdata.org/property/rdf1s804i#KanjiName"){
							tmp_data["KanjiName"] = objValue;
						}else if(propValue == "http://linkdata.org/property/rdf1s804i#KanaName"){
							tmp_data["KanaName"] = objValue;
						}else if(propValue == "http://linkdata.org/property/rdf1s804i#KanjiAliasName"){
							tmp_data["KanjiAliasName"] = objValue;
						}
						else if(propValue == "http://linkdata.org/property/rdf1s804i#KanaAliasName"){
							tmp_data["KanaAliasName"] = objValue;
						}
					});
					
				});
                                tmp_a_data.push(tmp_data);
			});
		});
	});
	//全データ
	all_data = tmp_a_data;

//地図の中心点
var myLatLng = new google.maps.LatLng(35.011633,135.768034); //京都駅付近
var myMap = new google.maps.Map(document.getElementById('result'), {
  zoom: 13,
  center: myLatLng,
  mapTypeId: google.maps.MapTypeId.ROADMAP,
  scaleControl: true,
  scrollwheel: true
 });
 
	
//サークルの設定
var cityCircle;
var circleCenter;

var data = new Array();

for (var i in all_data) {
	//観光スポットのタイプで区分する
	circleCenter = new google.maps.LatLng(all_data[i].lat,all_data[i].lng);// 緯度経度から中心点をつくる
   
	if ((all_data[i].spot_type == "Buddhist Temple")){
	var spot_Options = {
  		fillColor: '#ddee00',   // 塗りつぶし色
  		fillOpacity: 0.5,       // 塗りつぶし透過度（0: 透明 ⇔ 1:不透明）
  		map: myMap,             // 表示させる地図（google.maps.Map）
  		strokeColor: '#ff0000', // 外周色 
  		strokeOpacity: 1,       // 外周透過度（0: 透明 ⇔ 1:不透明）
  		strokeWeight: 2 ,        // 外周太さ（ピクセル）
		center: circleCenter,    // 中心点
        radius:  10 // 半径（ｍ)
	};
		//marker test start
	var gmarker = new google.maps.Marker({  
        position: circleCenter,       // 緯度・経度は地図の中心  
        title: all_data[i].KanjiName,// ツールチップ 
		openInfo:true,
		icon: "http://labs.google.com/ridefinder/images/mm_20_red.png",
		map: myMap  
    }); 
	
	
	} else if ((all_data[i].spot_type =="Shindo Shrine")){

var spot_Options = {
  		fillColor: '#0000FF',   // 塗りつぶし色
  		fillOpacity: 0.5,       // 塗りつぶし透過度（0: 透明 ⇔ 1:不透明）
  		map: myMap,             // 表示させる地図（google.maps.Map）
 		strokeColor: '#0000FF', // 外周色 
  		strokeOpacity: 1,       // 外周透過度（0: 透明 ⇔ 1:不透明）
  		strokeWeight: 2 ,        // 外周太さ（ピクセル）
		center: circleCenter,    // 中心点
        //radius:  all_data[i].numOfPassenger/1000 // 半径（ｍ）
		 radius:  10 // 半径（ｍ）
	};
		//test start
	var gmarker = new google.maps.Marker({  
        position: circleCenter,       // 緯度・経度は地図の中心  
        title: all_data[i].KanjiName ,// ツールチップ 
		icon: "http://labs.google.com/ridefinder/images/mm_20_blue.png",
		map: myMap  
    });  
	
	}//if toji
	cityCircle = new google.maps.Circle(spot_Options );
	// ウィンドウに表示するデータをつくる

var spot_name = all_data [i].label;
		data.push({position: new google.maps.LatLng(all_data[i].lat, all_data[i].lng), 
			content: spot_name + '<br>' + all_data[i].KanjiName });
			 // 地図上にウィンドウで表示

attachMessage(gmarker, data[i].content);
	}; //for toji 
};//initialize toji

// 地図のマーカーをクリックするとウィンドウを表示する処理
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();        
    });	
};

Initial content

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

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

作者メッセージ送信	kyolib2013
Fork元のアプリ	松本豊 's 横浜ランドマークタワーをのぞむMAP
実行回数	749
ウェブサイト
ライセンス
Fork count	0
作成日	2013年5月14日
最終更新日	2013年5月22日