Publish your application as JavaScript

that mashes up the Linked Open Data

Application Information

人口ピラミッド_H19より

fullscreen

石巻市, ＩＣＴ総合推進課

0

Rating

useful

0

Application

Play
JavaScript
CSS
HTML
ReadMe
Snapshots

var nengetu_p = "";
var nengetu_k = "";
var all_p = 0;
var k = 0;
var kk = 0;
var w = 0;
var nengetu_tbl = [
"平成19年4月",
"平成19年6月",
"平成19年7月",
"平成19年8月",
"平成19年9月",
"平成19年10月",
"平成19年11月",
"平成19年12月",
"平成20年1月",
"平成20年2月",
"平成20年3月",
"平成20年4月",
"平成20年5月",
"平成20年6月",
"平成20年7月",
"平成20年8月",
"平成20年9月",
"平成20年10月",
"平成20年11月",
"平成20年12月",
"平成21年1月",
"平成21年2月",
"平成21年3月",
"平成21年4月",
"平成21年5月",
"平成21年6月",
"平成21年7月",
"平成21年8月",
"平成21年9月",
"平成21年10月",
"平成21年11月",
"平成21年12月",
"平成22年1月",
"平成22年2月",
"平成22年3月",
"平成22年4月",
"平成22年5月",
"平成22年6月",
"平成22年7月",
"平成22年8月",
"平成22年9月",
"平成22年10月",
"平成22年11月",
"平成22年12月",
"平成23年1月",
"平成23年2月",
"平成23年3月",
"平成23年4月",
"平成23年5月",
"平成23年6月",
"平成23年7月",
"平成23年8月",
"平成23年9月",
"平成23年10月",
"平成23年11月",
"平成23年12月",
"平成24年1月",
"平成24年2月",
"平成24年3月",
"平成24年4月",
"平成24年5月",
"平成24年6月",
"平成24年7月",
"平成24年8月",
"平成24年9月",
"平成24年10月",
"平成24年11月",
"平成24年12月",
"平成25年1月",
"平成25年2月",
"平成25年3月",
"平成25年4月",
"平成25年5月",
"平成25年6月",
"平成25年7月",
"平成25年8月",
"平成25年9月",
"平成25年10月",
"平成25年11月",
"平成25年12月",
"平成26年1月",
"平成26年2月",
"平成26年3月",
"平成26年4月",
"平成26年5月",
"平成26年6月",
"平成26年7月",
"平成26年8月",
"平成26年9月",
"平成26年10月",
"平成26年11月",
"平成26年12月",
"平成27年1月",
"平成27年2月",
"平成27年3月",
"平成27年4月",
"平成27年5月",
"平成27年6月",
"平成27年7月",
"平成27年8月",
"平成27年9月",
"平成27年10月",
"平成27年11月",
"平成27年12月",
"平成28年1月",
"平成28年2月",
"平成28年3月",
"平成28年4月",
"平成28年5月",
"平成28年6月",
"平成28年7月",
"平成28年8月"
];
function kkk() {
var eee;
k = 0;
nengetu_k = document.js.nen.value;
	if (nengetu_k == "") {
		k = 0;
	}
	else{
		for ( eee = 0; eee < 112; eee++ ){
			if (nengetu_tbl[eee] == nengetu_k) {
				break;
			}
		}
		k = eee;
	}
	//alert(k);
	bbb();
}
function bbb() {
	if (k <= 111) {
		zzz();
	}
	else{
		k = 0;
	}
}
function zzz(){
	all_p = 1;
	nengetu_p = nengetu_tbl[k];
	aaa(all_p,nengetu_p);
	all_p = 0;
	k++;
	if (k <= 111) {
		setTimeout('bbb();',1500);
	}
	else{
		k = 0;
	}
}
function ccc() {
	if ( k <= 111){
		if ( k > 0){
			//alert("k="+k);
			k = 112;
			//alert("k="+k);
		}
	}
	else {
		//alert("k="+k);
		k = 0;
		//alert("k="+k);
	}
}
function aaa() {
	var nengetu;
	//alert(all_p);
	//alert(nengetu_p);
	var keyword = getParameterFromURL("subject"); // obtain keyword from the URL "?subject="
	var list = ""; // list to be displayed
	if (all_p == 0){
		nengetu = document.js.nen.value;
	}
	else{
		nengetu = nengetu_p;
	}
	var param = [
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0],
	[0,0]
	];
		$.each(LinkData.getWorks(), function(workKey, workValue) {
		// File loop
		$.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
			//alert(nen);
			//alert(fileKey);
			//alert(fileValue);
			var c_cnt = 0;
			var d_cnt = 0;
			var e_cnt = 0;
			var f_cnt = 0;
			var hit = ""; // list of subjects whose URI matches keyword
			var dhit = ""; // list of subjects whose URI matches keyword
			var ehit = ""; // list of subjects whose URI matches keyword
			var fhit = ""; // list of subjects whose URI matches keyword
			var nHit = 0; // number of subjects whose URI matches keyword
			// Subject loop
			$.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {
				$.each( LinkData.getTriplesBySubject(workValue, fileValue, subjValue), function( tripleKey, tripleValue ) {
					if(fileValue=="nenreibetsu_jinkou_tokei"){
						var prop = tripleValue.property;
						//alert(prop);
						var Nam = getLastName(prop);
						//alert(Nam);
						var obj = tripleValue.object;
						//alert(obj);
						var lab = tripleValue.label;
						//alert(lab);
						if(Nam=="年月"){
							if(obj==nengetu){
								hit = "OK";
							}
						}
						if(hit=="OK"){
							var elm = document.getElementById( 'event-num' ) ;
							elm.innerHTML = nengetu;
							if(Nam=="0～4歳男"){
								param[0][0] = obj;
								c_cnt++;
							}
							if(Nam=="5～9歳男"){
								param[1][0] = obj;
								c_cnt++;
							}
							if(Nam=="10～14歳男"){
								param[2][0] = obj;
								c_cnt++;
							}
							if(Nam=="15～19歳男"){
								param[3][0] = obj;
								c_cnt++;
							}
							if(Nam=="20～24歳男"){
								param[4][0] = obj;
								c_cnt++;
							}
							if(Nam=="25～29歳男"){
								param[5][0] = obj;
								c_cnt++;
							}
							if(Nam=="30～34歳男"){
								param[6][0] = obj;
								c_cnt++;
							}
							if(Nam=="35～39歳男"){
								param[7][0] = obj;
								c_cnt++;
							}
							if(Nam=="40～44歳男"){
								param[8][0] = obj;
								c_cnt++;
							}
							if(Nam=="45～49歳男"){
								param[9][0] = obj;
								c_cnt++;
							}
							if(Nam=="50～54歳男"){
								param[10][0] = obj;
								c_cnt++;
							}
							if(Nam=="55～59歳男"){
								param[11][0] = obj;
								c_cnt++;
							}
							if(Nam=="60～64歳男"){
								param[12][0] = obj;
								c_cnt++;
							}
							if(Nam=="65～69歳男"){
								param[13][0] = obj;
								c_cnt++;
							}
							if(Nam=="70～74歳男"){
								param[14][0] = obj;
								c_cnt++;
							}
							if(Nam=="75～79歳男"){
								param[15][0] = obj;
								c_cnt++;
							}
							if(Nam=="80～84歳男"){
								param[16][0] = obj;
								c_cnt++;
							}
							if(Nam=="85～89歳男"){
								param[17][0] = obj;
								c_cnt++;
							}
							if(Nam=="90～94歳男"){
								param[18][0] = obj;
								c_cnt++;
							}
							if(Nam=="95～99歳男"){
								param[19][0] = obj;
								c_cnt++;
							}
							if(Nam=="100～104歳男"){
								param[20][0] = obj;
								c_cnt++;
							}
							if(Nam=="105～109歳男"){
								param[21][0] = obj;
								c_cnt++;
							}
							if(Nam=="110歳～男"){
								param[22][0] = obj;
								c_cnt++;
							}
							if(Nam=="0～4歳女"){
								param[0][1] = obj;
								c_cnt++;
							}
							if(Nam=="5～9歳女"){
								param[1][1] = obj;
								c_cnt++;
							}
							if(Nam=="10～14歳女"){
								param[2][1] = obj;
								c_cnt++;
							}
							if(Nam=="15～19歳女"){
								param[3][1] = obj;
								c_cnt++;
							}
							if(Nam=="20～24歳女"){
								param[4][1] = obj;
								c_cnt++;
							}
							if(Nam=="25～29歳女"){
								param[5][1] = obj;
								c_cnt++;
							}
							if(Nam=="30～34歳女"){
								param[6][1] = obj;
								c_cnt++;
							}
							if(Nam=="35～39歳女"){
								param[7][1] = obj;
								c_cnt++;
							}
							if(Nam=="40～44歳女"){
								param[8][1] = obj;
								c_cnt++;
							}
							if(Nam=="45～49歳女"){
								param[9][1] = obj;
								c_cnt++;
							}
							if(Nam=="50～54歳女"){
								param[10][1] = obj;
								c_cnt++;
							}
							if(Nam=="55～59歳女"){
								param[11][1] = obj;
								c_cnt++;
							}
							if(Nam=="60～64歳女"){
								param[12][1] = obj;
								c_cnt++;
							}
							if(Nam=="65～69歳女"){
								param[13][1] = obj;
								c_cnt++;
							}
							if(Nam=="70～74歳女"){
								param[14][1] = obj;
								c_cnt++;
							}
							if(Nam=="75～79歳女"){
								param[15][1] = obj;
								c_cnt++;
							}
							if(Nam=="80～84歳女"){
								param[16][1] = obj;
								c_cnt++;
							}
							if(Nam=="85～89歳女"){
								param[17][1] = obj;
								c_cnt++;
							}
							if(Nam=="90～94歳女"){
								param[18][1] = obj;
								c_cnt++;
							}
							if(Nam=="95～99歳女"){
								param[19][1] = obj;
								c_cnt++;
							}
							if(Nam=="100～104歳女"){
								param[20][1] = obj;
								c_cnt++;
							}
							if(Nam=="105～109歳女"){
								param[21][1] = obj;
								c_cnt++;
							}
							if(Nam=="110歳～女"){
								param[22][1] = obj;
								c_cnt++;
								hit = "";
							}
						}
					}

});
			});
		});
	});

var a0 = Number(param[0][0]);
	var a1 = Number(param[1][0]);
	var a2 = Number(param[2][0]);
	var a3 = Number(param[3][0]);
	var a4 = Number(param[4][0]);
	var a5 = Number(param[5][0]);
	var a6 = Number(param[6][0]);
	var a7 = Number(param[7][0]);
	var a8 = Number(param[8][0]);
	var a9 = Number(param[9][0]);
	var a10 = Number(param[10][0]);
	var a11 = Number(param[11][0]);
	var a12 = Number(param[12][0]);
	var a13 = Number(param[13][0]);
	var a14 = Number(param[14][0]);
	var a15 = Number(param[15][0]);
	var a16 = Number(param[16][0]);
	var a17 = Number(param[17][0]);
	var a18 = Number(param[18][0]);
	var a19 = Number(param[19][0]);
	var a20 = Number(param[20][0]);
	var a21 = Number(param[21][0]);
	var a22 = Number(param[22][0]);
	var c0 = -a0;
	var c1 = -a1;
	var c2 = -a2;
	var c3 = -a3;
	var c4 = -a4;
	var c5 = -a5;
	var c6 = -a6;
	var c7 = -a7;
	var c8 = -a8;
	var c9 = -a9;
	var c10 = -a10;
	var c11 = -a11;
	var c12 = -a12;
	var c13 = -a13;
	var c14 = -a14;
	var c15 = -a15;
	var c16 = -a16;
	var c17 = -a17;
	var c18 = -a18;
	var c19 = -a19;
	var c20 = -a20;
	var c21 = -a21;
	var c22 = -a22;
	var b0 = Number(param[0][1]);
	var b1 = Number(param[1][1]);
	var b2 = Number(param[2][1]);
	var b3 = Number(param[3][1]);
	var b4 = Number(param[4][1]);
	var b5 = Number(param[5][1]);
	var b6 = Number(param[6][1]);
	var b7 = Number(param[7][1]);
	var b8 = Number(param[8][1]);
	var b9 = Number(param[9][1]);
	var b10 = Number(param[10][1]);
	var b11 = Number(param[11][1]);
	var b12 = Number(param[12][1]);
	var b13 = Number(param[13][1]);
	var b14 = Number(param[14][1]);
	var b15 = Number(param[15][1]);
	var b16 = Number(param[16][1]);
	var b17 = Number(param[17][1]);
	var b18 = Number(param[18][1]);
	var b19 = Number(param[19][1]);
	var b20 = Number(param[20][1]);
	var b21 = Number(param[21][1]);
	var b22 = Number(param[22][1]);
      var gdata = google.visualization.arrayToDataTable([
        ["年齢", "男", "女" ],
        ["0～4歳", c0, b0],
        ["5～9歳", c1, b1],
        ["10～14歳", c2, b2],
        ["15～19歳", c3, b3],
        ["20～24歳", c4, b4],
        ["25～29歳", c5, b5],
        ["30～34歳", c6, b6],
        ["35～39歳", c7, b7],
        ["40～44歳", c8, b8],
        ["45～49歳", c9, b9],
        ["50～54歳", c10, b10],
        ["55～59歳", c11, b11],
        ["60～64歳", c12, b12],
        ["65～69歳", c13, b13],
        ["70～74歳", c14, b14],
        ["75～79歳", c15, b15],
        ["80～84歳", c16, b16],
        ["85～89歳", c17, b17],
        ["90～94歳", c18,  b18],
        ["95～99歳", c19, b19],
        ["100～104歳", c20, b20],
        ["105～109歳", c21, b21],
        ["110歳～", c22, b22]
      ]);
      var data = google.visualization.arrayToDataTable([
        ["年齢層", "男", "女" ],
        ["110歳～",a22,b22],
        ["105～109歳",a21,b21],
        ["100～104歳",a20,b20],
        ["95～99歳",a19,b19],
        ["90～94歳",a18,b18],
        ["85～89歳",a17,b17],
        ["80～84歳",a16,b16],
        ["75～79歳",a15,b15],
        ["70～74歳",a14,b14],
        ["65～69歳",a13,b13],
        ["60～64歳",a12,b12],
        ["55～59歳",a11,b11],
        ["50～54歳",a10,b10],
        ["45～49歳",a9,b9],
        ["40～44歳",a8,b8],
        ["35～39歳",a7,b7],
        ["30～34歳",a6,b6],
        ["25～29歳",a5,b5],
        ["20～24歳",a4,b4],
        ["15～19歳",a3,b3],
        ["10～14歳",a2,b2],
        ["5～9歳",a1,b1],
        ["0～4歳",a0,b0]
      ]);
    
      //グラフオプションの指定
      var options = {
         isStacked: true,
         chartArea: {left:200,top:-70,width:"80%",height:"90%"},
         title: '平成２８年４月末　年齢別、男女別人口ピラミッド',
         height: 500,
         width: 700,
         hAxis: {
             format: ';',
             title: '男　　　　女',
         },
         vAxis: {
             direction: -1,
             title: '年齢層',
         }
      };
 
      var formatter = new google.visualization.NumberFormat({
         pattern: ';'
      });

// テーブルの作成
      var formatter2 = new google.visualization.NumberFormat(
               {pattern: '#,###'});
           formatter2.format(data, 1);
   
      var table = new google.visualization.Table(
               document.getElementById('table_div'));
      table.draw(data, {showRowNumber: true});

//グラフの描画
	  formatter.format(gdata, 2);
      var chart = new google.visualization.BarChart(document.getElementById('series_chart_div'));
      chart.draw(gdata, options);
    }

// Get a parameter value in URL (e.g. ?paramString=value )
function getParameterFromURL( paramString )
{			
	var value = "";
	var topWindow = top.window.location.search;
	var q = decodeURIComponent(topWindow.substring(1,topWindow.length)).split("&");
	if( topWindow ){
		for ( var i = 0; i < q.length; i++ ){
			var r = q[i].split("=");
			if ( r[0] ==  paramString )
				value = r[1];
		}
	}
 	return value;
}

// Highlight keyword in the string
function highlight( string, keyword )
{
	if ( keyword.length > 0 ) {
		var ss = string.split(keyword);
		var len = ss.length;
		if ( len > 1 ) {
			string = ss[0];
			for ( i = 1; i < len; i++ )
//				string += "<font color=\"red\">"+keyword+"</font>"+ss[i];
				string += "<span class=\"highlight\">"+keyword+"</span>"+ss[i];
		}
	}
	return string;
}

// get the last name of the string separated with # and /
function getLastName( string )
{
	string = decodeURIComponent(string);
	var sharp = string.split("#");
	var slash = sharp[sharp.length-1].split("/");
	var lastName = slash[slash.length-1];
	return lastName;
}

// return a link to Google map search
function addLinkToMap( latitude, longitude )
{
	var s = "<br><a target=\"_blank\" href=\"http://www.google.com/maps/?q=" + latitude + "," + longitude + "\">Show map</a>";
	return s;
}

// shortening URL e.g. http://.../123.jpg
function shortenURL( url )
{
	url = decodeURIComponent(url);
	var slash = url.split("/");
	var lastName = slash[slash.length-1];
	return url.split(":")[0]+"://.../"+lastName;
}

// get the last name of the string separated with # and /
function getLastName( string )
{
	string = decodeURIComponent(string);
	var sharp = string.split("#");
	var slash = sharp[sharp.length-1].split("/");
	var lastName = slash[slash.length-1];
	return lastName;
}

// return a link to Google map search
function addLinkToMap( latitude, longitude )
{
	var s = "<br><a target=\"_blank\" href=\"http://www.google.com/maps/?q=" + latitude + "," + longitude + "\">Show map</a>";
	return s;
}

// shortening URL e.g. http://.../123.jpg
function shortenURL( url )
{
	url = decodeURIComponent(url);
	var slash = url.split("/");
	var lastName = slash[slash.length-1];
	return url.split(":")[0]+"://.../"+lastName;
}

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
    google.load('visualization', '1', {packages:['corechart', 'table']});
</script>
</head><form name="js" onContextmenu="return false">
<font size="1">年月を選択：<input type="text" name="nen" list="data1" value="平成28年4月">
<datalist id="data1">
<option value="平成19年4月"></option>
<option value="平成19年6月"></option>
<option value="平成19年7月"></option>
<option value="平成19年8月"></option>
<option value="平成19年9月"></option>
<option value="平成19年10月"></option>
<option value="平成19年11月"></option>
<option value="平成19年12月"></option>
<option value="平成20年1月"></option>
<option value="平成20年2月"></option>
<option value="平成20年3月"></option>
<option value="平成20年4月"></option>
<option value="平成20年5月"></option>
<option value="平成20年6月"></option>
<option value="平成20年7月"></option>
<option value="平成20年8月"></option>
<option value="平成20年9月"></option>
<option value="平成20年10月"></option>
<option value="平成20年11月"></option>
<option value="平成20年12月"></option>
<option value="平成21年1月"></option>
<option value="平成21年2月"></option>
<option value="平成21年3月"></option>
<option value="平成21年4月"></option>
<option value="平成21年5月"></option>
<option value="平成21年6月"></option>
<option value="平成21年7月"></option>
<option value="平成21年8月"></option>
<option value="平成21年9月"></option>
<option value="平成21年10月"></option>
<option value="平成21年11月"></option>
<option value="平成21年12月"></option>
<option value="平成22年1月"></option>
<option value="平成22年2月"></option>
<option value="平成22年3月"></option>
<option value="平成22年4月"></option>
<option value="平成22年5月"></option>
<option value="平成22年6月"></option>
<option value="平成22年7月"></option>
<option value="平成22年8月"></option>
<option value="平成22年9月"></option>
<option value="平成22年10月"></option>
<option value="平成22年11月"></option>
<option value="平成22年12月"></option>
<option value="平成23年1月"></option>
<option value="平成23年2月"></option>
<option value="平成23年3月"></option>
<option value="平成23年4月"></option>
<option value="平成23年5月"></option>
<option value="平成23年6月"></option>
<option value="平成23年7月"></option>
<option value="平成23年8月"></option>
<option value="平成23年9月"></option>
<option value="平成23年10月"></option>
<option value="平成23年11月"></option>
<option value="平成23年12月"></option>
<option value="平成24年1月"></option>
<option value="平成24年2月"></option>
<option value="平成24年3月"></option>
<option value="平成24年4月"></option>
<option value="平成24年5月"></option>
<option value="平成24年6月"></option>
<option value="平成24年7月"></option>
<option value="平成24年8月"></option>
<option value="平成24年9月"></option>
<option value="平成24年10月"></option>
<option value="平成24年11月"></option>
<option value="平成24年12月"></option>
<option value="平成25年1月"></option>
<option value="平成25年2月"></option>
<option value="平成25年3月"></option>
<option value="平成25年4月"></option>
<option value="平成25年5月"></option>
<option value="平成25年6月"></option>
<option value="平成25年7月"></option>
<option value="平成25年8月"></option>
<option value="平成25年9月"></option>
<option value="平成25年10月"></option>
<option value="平成25年11月"></option>
<option value="平成25年12月"></option>
<option value="平成26年1月"></option>
<option value="平成26年2月"></option>
<option value="平成26年3月"></option>
<option value="平成26年4月"></option>
<option value="平成26年5月"></option>
<option value="平成26年6月"></option>
<option value="平成26年7月"></option>
<option value="平成26年8月"></option>
<option value="平成26年9月"></option>
<option value="平成26年10月"></option>
<option value="平成26年11月"></option>
<option value="平成26年12月"></option>
<option value="平成27年1月"></option>
<option value="平成27年2月"></option>
<option value="平成27年3月"></option>
<option value="平成27年4月"></option>
<option value="平成27年5月"></option>
<option value="平成27年6月"></option>
<option value="平成27年7月"></option>
<option value="平成27年8月"></option>
<option value="平成27年9月"></option>
<option value="平成27年10月"></option>
<option value="平成27年11月"></option>
<option value="平成27年12月"></option>
<option value="平成28年1月"></option>
<option value="平成28年2月"></option>
<option value="平成28年3月"></option>
<option value="平成28年4月"></option>
<option value="平成28年5月"></option>
<option value="平成28年6月"></option>
<option value="平成28年7月"></option>
<option value="平成28年8月"></option>
</datalist>
<font size="1"><input type="button" value="表示" onclick="aaa()">
<font size="1"><input type="button" value="続けて連続再生" onclick="kkk()">
<font size="1"><input type="button" value="再生終了" onclick="ccc()"><br>
<table>
  <tr><td>
        <div id="table_div" style="position:absolute;top:70px;left:10px;width:150pt;" ></div>
    </td><td>
        <div id="series_chart_div" style="position:absolute;top:75px;left:200px;width:250pt; height:120pt;" ></div>
  </td></tr>
</table>
<body onBlur="focus()">
	<p><font size="2">石巻市　人口ピラミッド　<span id="event-num"></span></p>
</body>

Fork this app as your new one download

Contributor Send Message	石巻市, ＩＣＴ総合推進課
Run count	244
Website
License
Fork count	0
Created date	Oct 3, 2016
Last update date	Dec 14, 2018

Input Data
Related Ideas

LinkData work list used as input data in this application.
You can change input data and execute application if you change the checkbox.

宮城県石巻市　人口ピラミッド Contributor: 石巻市, ＩＣＴ総合推進課 Update: Dec 13, 2018
194 Downloads
,

1 Applications

nenreibetsu_jinkou_tokei
Add New Data

News Feed

linkdata.org に関するツイート