リンクを知っている人にのみ公開

渋谷区の寺院リスト

fullscreen

T.Waka

渋谷区の寺院のリストです。

Rating

useful

Application

Play
JavaScript
CSS
HTML
ReadMe
Snapshots

var LV = LV || {};

// ※表示タイトル
LV.title = "渋谷区の寺院リスト";

// ※テーブルの項目名とプロパティの対応の設定
LV.property = [
	["ID", "0"],	/* 必須 */
	["寺院名", "Name"],
	["宗派", "Note"],
	["住所", "Address"],
	["経度", "http://www.w3.org/2003/01/geo/wgs84_pos#long"],
	["緯度", "http://www.w3.org/2003/01/geo/wgs84_pos#lat"],
	["電話番号", "電話"],
	["郵便番号", "Post"]
]
	
window.onload = function() {
	$("#result").append("<h1>" + LV.title + "</h1>");
	$("#result").append("<table class='display' id='data_list'></table>" );
	var colList=[];
	$('#data_list').dataTable({
		"aoColumns": setColName(colList),
		"asSorting": [[0,"desc"]],
		"bJQueryUI": true,
		"bAutoWidth": false,
		"bJQueryUI": true,
		
		/* 空の値が来たらハイフン表示（alert対策） */
		"columnDefs": [{
   			 "defaultContent": "-",
			"targets": "_all"
		}],
		/* 日本語化 */
		"language": {
  			"emptyTable" : "データが登録されていません。",
  			"info" : "_TOTAL_ 件中 _START_ 件から _END_ 件までを表示",
			"infoEmpty" : "",
			"infoFiltered" : "(_MAX_ 件からの絞り込み表示)",
			"infoPostFix" : "",
			"thousands" : ",",
			"lengthMenu" : "1ページあたりの表示件数: _MENU_",
			"loadingRecords" : "ロード中",
			"processing" : "処理中...",
			"search" : "検索：",
			"zeroRecords" : "該当するデータが見つかりませんでした。",
			"paginate" : {
				"first" : "先頭",
				"previous" : "前へ",
				"next" : "次へ",
				"last" : "末尾"
			}
		}

});
	
	/* LinkDataからデータを取得 */
	$.each(LinkData.getWorks(), function(workKey, workValue) {
		var propList = stringToUri(LV.property, workValue);
		$.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
			$.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {
				var dataList = [];
				
				/* ID列のデータ取得 */
				var sharp = decodeURIComponent(subjValue).split("#");
				var slash = sharp[sharp.length-1].split("/");
				var id = slash[slash.length-1];
				dataList[0] = id;
				
				/* その他の列のデータを取得 */
				$.each( LinkData.getProperties(workValue, fileValue), function(propKey, propValue) {
					$.each (propList, function(i, propUri){
						if (propUri == propValue) {
							var objList = [];
							$.each( LinkData.getObjects(workValue, fileValue, subjValue, propValue), function(objkey, objValue) {
								objList.push(objValue);
							});
							dataList[i+1] = addHtml(objList.toString());
						}
					});
				});
				/* テーブルにデータを追加 */
				$('#data_list').dataTable().fnAddData(dataList);
			});
		});
	});
}

/* プロパティがリテラルで指定された場合にURIに変換 */
function stringToUri (p, workId) {
	var arr = [];
	$.each (p, function(){
		if(this[1] != 0) {
			if(this[1].indexOf("http") != 0){
				arr.push("http://linkdata.org/property/" + workId + "#" + encodeURIComponent(this[1]));
			} else {
				arr.push(this[1]);
			}
		}
	})
	return arr;
}

/* カラム名を設定 */
function setColName(arr) {
	$.each(LV.property, function(){
		var col = {};
		col.sTitle = this[0];
		arr.push(col);
	})
	return arr;
}

/* データの値がURLの場合の処理 */
function addHtml(str) {
	if (str.indexOf("http") == 0) {
		if ((str.indexOf(".jpg" )>0 || str.indexOf(".gif" )>0 || str.indexOf(".png" )>0) || (str.indexOf(".JPG" )>0 || str.indexOf(".GIF" )>0 || str.indexOf(".PNG" )>0)) {
		str = '<img src="' + str + '" />';
		} else {
			str = '<a href="' + str + '" target="_blank">' + str + '</a>';
		}
	}
	return str;
}

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		
		<title>渋谷区の寺院リスト</title>
		
									<link rel="stylesheet" type="text/css" media="screen,print" href="https://cdn.datatables.net/s/zf-5.5.2/jqc-1.11.3,dt-1.10.10/datatables.min.css" />				
		
		<link rel="stylesheet" type="text/css" media="screen,print" href="user.css" />
		
		<script type="text/javascript">
			(function(){
				try {
					var e = function(){return ""};
				 	var f = function(){return false};
				 	Object.defineProperty(document, "cookie", { get: e, set: e, configurable:false });
				 	Object.defineProperty(navigator, "cookieEnabled", { get: f, set: f, configurable:false });
				} catch(e) { 
					/* not supported */
				}
			})();		
		</script>
	</head>
	<body>
		
		
		
		
		<div id="applicationWorkFileListContainer">
											<div class="applicationWorkFile">
					<input type="hidden" class="applicationWorkFileWorkId" value="rdf1s7744i"/>
					<input type="hidden" class="applicationWorkFileName" value="Shibuya_Temple_data"/>
					<input type="hidden" class="applicationWorkFileWorkName" value="Shibuya_Temple_data"/>
					<input type="hidden" class="applicationWorkTag" value="${workFile.tag}"/>
				</div>
									</div>
		
		
		<style type="text/css">	html { height: 100% }	body { height: 100%; margin: 0; padding: 0 }	#map_canvas { height: 100% }	h4{ text-align: center; color: #ffffff; background-color: #1787c8; border-top: 8px solid #005390;border-bottom: 8px solid #005390;}	#menu{}	#menu img{ display: block; margin: 0 auto;}	#menu .shopname{ display: block; margin: 0 auto; text-align: center; font-size: 14px;}</style><div id="result" style="width:100%; height:100%"></div>
		
									<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
												<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
							
		
				
			<script type="text/javascript" src="http://app.linkdata.org/js/script.js"></script>
			<script type="text/javascript">
				var workFileObj = new Object();
									workFileObj['rdf1s7744i|Shibuya_Temple_data'] = 'Shibuya_Temple_data';
								LinkData.databases = workFileObj;
				LinkData.userdata = new Array(1);
				
													LinkData.userdata['rdf1s7744i'] = new Array(1);
											LinkData.__fnrdf1s7744i = function(data) {
							LinkData.userdata['rdf1s7744i']['Shibuya_Temple_data'] = data;
						}
																			
			</script>
			
							<script src='http://linkdata.org/api/1/rdf1s7744i/Shibuya_Temple_data_rdf.json?callback=LinkData.__fnrdf1s7744i' type='text/javascript'></script>
						
				
		
		<script type="text/javascript" src="user.js"></script>
	</body>
</html>

Initial content