ワードクラウドで見るマニフェスト

立候補者を選んでマニフェストの内容をワードクラウド（言葉の雲）で見ることができるアプリです。文章中に含まれるキーワード（名詞）のうち、たくさん出てくるものほど大きく表示します。形態素解析は140noteさんの「日本語形態素解析API」を使用。参考にさせて頂いたサイト：http://shimz.me/blog/d3-js/2711, http://d3wc.dreamons.jp/ TODO：・SVGダウンロード機能

評価指数

アプリケーション

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

DrawWordCloud = {};
DrawWordCloud.propList = ["政治家を志した理由", "地域のありたい姿", "解決したい課題"];
DrawWordCloud.keyProp = "政治家名";
DrawWordCloud.areaProp = "対象の市区町村または都道府県";
DrawWordCloud.area = "世田谷区";
DrawWordCloud.sourceURL = "http://www.maniken.jp/id#";
DrawWordCloud.manifestURL = "http://manifestoswitchsetagaya.strikingly.com/";
DrawWordCloud.subList = [];
DrawWordCloud.workID = "";
DrawWordCloud.fileName = "";

$(function(){
	DrawWordCloud.loadInputData();
	
	$("#area").change(function(){
		$(".subject").remove();
		DrawWordCloud.subList.length = 0;
		DrawWordCloud.changeSubjects($(this).val());
	});

$("#generate").click(function() {
		var sub = "";
		var propList = [];
		$("#wordcrowd, #original").empty();
		if ($('#subjects').val() != "all") {
			sub = $('#subjects').val();
		}
		$('.property:checked').each(function(){
			propList.push($(this).val());
		});
		var str = DrawWordCloud.getData(DrawWordCloud.workID, DrawWordCloud.fileName, sub, propList);
		DrawWordCloud.analyze(str);
	});
});

DrawWordCloud.loadInputData = function() {
	var areaList = [];
	$.each(LinkData.getWorks(), function(workKey, workValue) {
		DrawWordCloud.workID = workValue;
		var keyPropURI = "http://linkdata.org/property/" + workValue + "#" +encodeURIComponent(DrawWordCloud.keyProp);
		var areaPropURI = "http://linkdata.org/property/" + workValue + "#" +encodeURIComponent(DrawWordCloud.areaProp);
		$.each(LinkData.getFiles(workValue), function(fileKey, fileValue) {
			DrawWordCloud.fileName = fileValue;
			$.each(LinkData.getSubjects(workValue, fileValue), function(subjKey, subjValue) {
				$.each( LinkData.getTriplesBySubject(workValue, fileValue, subjValue), function( tripleKey, tripleValue ) {
					if ( tripleValue.property == keyPropURI ) {
						DrawWordCloud.initSubjects(subjValue, tripleValue.object);
						var subMap = {uri:subjValue, label:tripleValue.object};
						DrawWordCloud.subList.push(subMap);
					}
					if ( tripleValue.property == areaPropURI ) {
						areaList.push(tripleValue.object);
					}
				});
			});
		});
	});
	DrawWordCloud.initProperties();
	DrawWordCloud.initArea(areaList);
};

DrawWordCloud.initSubjects = function(subjectURI, subjectValue){
	$("#subjects").append(
		$('<option></option>').val(subjectURI).html(subjectValue).addClass("subject")
	);
};

DrawWordCloud.initProperties = function(){
	$.each(LinkData.getProperties(DrawWordCloud.workID, DrawWordCloud.fileName), function(index, propURI){
		$.each(DrawWordCloud.propList, function(i, prop) {
			var decode = decodeURIComponent(propURI);
			var sharp = decode.split("#");
			var slash = sharp[sharp.length-1].split("/");
			var propName = slash[slash.length-1];
			if (propName == prop) {
				var $input = $('<input type="checkbox" />').attr({value: propURI}).attr({name: propName}).attr({class: "property"});
				var $label = $('<label for="'+ propName +'">'+ propName +'</label>');
				$("#properties").append($input).append($label);
			}
		});
	});
};

DrawWordCloud.initArea = function(areaList){
	var uniqueAreaList = areaList.filter(function (x, i, self) {
        return self.indexOf(x) === i;
    })
    .sort();
	$.each(uniqueAreaList, function(areaIndex, areaValue) {
		var $option = "<option value=\"" + areaValue + "\">"+ areaValue +"</option>";
		$("#area").append($option);
	});
};

DrawWordCloud.changeSubjects = function (area) {
	var keyPropURI = "http://linkdata.org/property/" + DrawWordCloud.workID + "#" +encodeURIComponent(DrawWordCloud.keyProp);
	var areaPropURI = "http://linkdata.org/property/" + DrawWordCloud.workID + "#" +encodeURIComponent(DrawWordCloud.areaProp);
	$.each(LinkData.getSubjects(DrawWordCloud.workID, DrawWordCloud.fileName), function(subjKey, subjValue) {
		$.each( LinkData.getTriplesBySubject(DrawWordCloud.workID, DrawWordCloud.fileName, subjValue), function( tripleKey, tripleValue ) {
			if ( tripleValue.property == keyPropURI &&
					LinkData.getObjects(DrawWordCloud.workID, DrawWordCloud.fileName, subjValue , areaPropURI) == area) {
				DrawWordCloud.initSubjects(subjValue, tripleValue.object);
				var subMap = {uri:subjValue, label:tripleValue.object};
				DrawWordCloud.subList.push(subMap);
			}
		});
	});
};

DrawWordCloud.getData = function(work, file, sub, prop) {
	var originalStr="";
	$.each (prop, function(i, propValue) {
		if (sub == ""){
			$.each(DrawWordCloud.subList, function(sbjKey, subjValue) {
				originalStr += " " + LinkData.getObjects(work, file, subjValue.uri, propValue);
			});
		} else {
			originalStr += " " + LinkData.getObjects(work, file, sub, propValue);
		}
	});
	var subStr = sub.split("#");
	var subValue = subStr[subStr.length-1];
	var url = DrawWordCloud.sourceURL + subValue;
	if (sub == ""){
		$("#seeManifest").attr("href", DrawWordCloud.manifestURL).text("→マニフェストを見る");
	} else {
		$("#seeManifest").attr("href", url).text("→マニフェストを見る");
	}
	var inputStr = originalStr.substr(0,900); // APIの字数制限対策
	$("#original").append('<p id="props"><b>元の文章</b>：' + inputStr + '</p>');
	return inputStr;
};

DrawWordCloud.analyze = function(str) {
	// 日本語形態素解析API http://140note.hitonobetsu.com/apipage/mp
	$.ajax({
	    type: 'POST',
		url: 'http://api.hitonobetsu.com/mp/analysis',
		dataType: 'jsonp',
		crossDomain: true,
		data: {
	        str: str
		}
	})
	.done(function(data) {
		DrawWordCloud.createNounList(data);
	})
	.fail(function() {
		alert("形態素解析に失敗しました。時間を置いてお試し下さい。");
	});
};

DrawWordCloud.createNounList = function (data) {
	var list = [];
	var table = [];
	// 名詞のうち、意味のあるもののみ抽出
	$.each(data, function(i, result) {
		if (result.part == '名詞' && result.subtyping1 != ("非自立" || "代名詞" || "接尾")) {
			list.push(result.surface);
		}
	});
	// 頻度表作成
	$.each(list, function(i, noun) {
		var array = {};
		var counter = 0;
		if (!(noun == null || DrawWordCloud.checkDuplicate(table, noun) == true)) {
			$.each(list, function(j, value) {
				if (noun == value) {
					counter++;
				}
			});
			array = {word:noun, count:counter};
			table.push(array);
		}
	});
	DrawWordCloud.generate(table);
};

DrawWordCloud.checkDuplicate = function(array, str){
	var bool = new Boolean(false);
	if (array.length > 0){
		array.filter(function(item, index){
		  if (item.word == str) bool=true;
		});
	}
    return bool;
};

DrawWordCloud.generate = function(data) {

var layout_width = 500;
	var layout_height = 500;
	var random = d3.random.irwinHall(2);
	var countMax = d3.max(data, function(d){ return d.count; });
	var sizeScale = d3.scale.linear().domain([0, countMax]).range([10, 100]);

//wordcloud 描画
	  function draw(words) {
		var fill = d3.scale.category20();
	    d3.select("#wordcrowd").append("svg")
	        .attr("width", layout_width)
	        .attr("height", layout_height)
	      .append("g")
	        .attr("transform", "translate(250,250)")
	      .selectAll("text")
	        .data(words)
	      .enter().append("text")
	        .style("font-size", function(d) { return d.size + "px"; })
	        .style("font-family", "Impact")
	        .style("fill", function(d, i) { return fill(i); })
	        .attr("text-anchor", "middle")
	        .attr("transform", function(d) {
	          return "translate(" + [d.x, d.y] + ")rotate(" + d.rotate + ")";
	        })
	        .text(function(d) { return d.text; });
	  }
};

span.highlight {color: red;}
span.propertyName {color: gray;}
span.subject { color: blue; }
span.object{ color: black; }
body { background: white; }
a, a span { text-decoration: underline; }
a:hover, a span:hover { text-decoration: none; }

img {
	width: 550px;
}

#subjects {
	margin: 20px 0;
}

.download {
	font-size:16px;
	font-family:Arial;
	font-weight:normal;
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
	border:1px solid #74b807;
	padding:4px 20px;
	text-decoration:none;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #89c403), color-stop(100%, #77a809) );
	background:-moz-linear-gradient( center top, #89c403 5%, #77a809 100% );
	background:-ms-linear-gradient( top, #89c403 5%, #77a809 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809');
	background-color:#89c403;
	color:#ffffff;
	display:inline-block;
	text-shadow:1px 1px 0px #528009;
 	-webkit-box-shadow:inset 1px 1px 0px 0px #a4e271;
 	-moz-box-shadow:inset 1px 1px 0px 0px #a4e271;
 	box-shadow:inset 1px 1px 0px 0px #a4e271;
	margin-top: 10px;
}

.download:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(5%, #77a809), color-stop(100%, #89c403) );
	background:-moz-linear-gradient( center top, #77a809 5%, #89c403 100% );
	background:-ms-linear-gradient( top, #77a809 5%, #89c403 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809', endColorstr='#89c403');
	background-color:#77a809;
}

.download:active {
	position:relative;
	top:1px;
}

#original {
    background: none repeat scroll 0 0 #eee;
    margin: 10px;
    padding: 5px 10px;
    width: 500px;
}

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

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

作者メッセージ送信	Sayoko Shimoyama
実行回数	998
ウェブサイト	http://manifestoswitchhadano.strikingly.com/
ライセンス	http://opensource.org/licenses/mit-license.php
Fork count	1
作成日	2015年4月19日
最終更新日	2015年4月26日