Language
Login
Language Setting
X
English
日本語 [Japanese]
about this App
forked:faamo
useful
0
Loading...
if(typeof Application==="undefined"||!Application){var Application = {};} // map var map = null; // var cityMasterArray = null; var cityMarketArray = null; var cityObservationArray = null; // アプリケーションのビジネスロジック Application.faamo = function(){this.init();}; // faamoメイン Application.faamo.prototype = { // 初期化処理 init : function(){ this._loadStart(); var isSuccess = this._loadData(); if(!isSuccess){ this._loadError(); } else { this._loadEnd(); } }, // ロード時のローディング画面 _loadStart : function(){ console.log('now loading'); $('#main_contents').hide(); }, _loadEnd : function(){ $("#loading").delay(600).fadeOut(700); $('#main_contents').show(); console.log('load success'); }, _loadError : function(){ alert('load error'); }, // データロード _loadData : function(){ var application = new Application.faamo.LinkData(); // // if(this.isEmpty(cityMaster)){ cityMasterArray = application.getDataResult('city_master'); // } // // if(this.isEmpty(cityMarket)){ cityMarketArray = application.getDataResult('city_market'); // } // // if(this.isEmpty(cityObservation)){ cityObservationArray = application.getDataResult('city_observation'); // } return true; }, }; // LinkData関連 Application.faamo.LinkData = function(){}; Application.faamo.LinkData.prototype = { /** * 指定ファイル内のデータを取得 * @param dataname 取得するデータソースのファイル名 * @result データソースファイル内の全データの配列 */ getDataResult : function(dataname){ var resultArray = null; $.each(LinkData.getWorks(), function(wKey, workId){ $.each(LinkData.getFiles(workId), function(fKey, filename){ if(filename == dataname){ $.each(LinkData.getSubjects(workId, filename), function(sKey, subject){ if(resultArray == null) resultArray = new Array(); var objArray = []; $.each(LinkData.getProperties(workId, filename), function(pKey, property){ var obj = LinkData.getObjects(workId, filename, subject, property); var prop = property.split('#')[1]; objArray[prop] = obj; }); resultArray.push(objArray); }); } }); }); return resultArray; } }; Application.faamo.Draw = function(){this._init();}; Application.faamo.Draw.prototype = { _init : function(){ }, _markerArray : new google.maps.MVCArray(), drawMap : function(){ //表示するGoogleMapの定義 //latlng型(経度・緯度) latlng var latlng = new google.maps.LatLng(39, 138); var opts = { zoom: 2, mapTypeId: google.maps.MapTypeId.SATELLITE, center: latlng }; //Google map表示 htmlのmapに対応 map = new google.maps.Map(document.getElementById("map"), opts); //シティマスタを読み込み、マーカーをデータ数分作成する for(var i = 0; i < cityMasterArray.length; i++){ //国コード var cityMaster = cityMasterArray[i]; // var markerOpt = new google.maps.Marker({ position: new google.maps.LatLng(cityMaster.lat, cityMaster.long), map: map, icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png' }); var marker = new google.maps.Marker(markerOpt); this._markerArray.push(marker); google.maps.event.addListener(marker, 'click', function(event){ // クリックしたマーカーのクラスを作る var cityCluster = cityMaster.cluster; var heatmapData = new Array(); cityMasterArray.forEach(function(cityMaster, idx){ if(cityMaster.cluster == cityCluster){ heatmapData.push(new google.maps.LatLng(cityMaster.lat, cityMaster.long)); } }); var heatmap = new google.maps.visualization.HeatmapLayer({ data: heatmapData, radius:25 }); heatmap.setMap(map); //壹岐追記 var infowindow = new google.maps.InfoWindow({ content: "国名:なんたら共和帝国<br/>カテゴリー:A" // content: "<img src= 'http://voiceyourchoice.jp/images/ico_atoxic02.png'> </img>" //content: "<div style='background-color:#cccccc;'>てすとー</div>" //background-color: #5599ff; //boxClass: "{ background: url('http://blankcoin.com/mn/mn_img/sora/mn_sora_23.jpg') no-repeat" }); infowindow.open(map, marker); }); marker.setMap(map); } // var heatmap = new google.maps.visualization.HeatmapLayer({ // data: this.heatmapData // }); // heatmap.setMap(map); } }; google.load("visualization", "1", {packages:["corechart"]}); var application = new Application.faamo(); var draw = new Application.faamo.Draw(); google.setOnLoadCallback(draw.drawMap());
/* global */ #container { background: #FFF; padding: 10px 100px 10px 10px; font-size: 14px; min-width: 980px; } /* top */ #title { margin: 10px 0; } #title #logo-img { float: left; width: 70px; margin-right: 10px; } #title h1 { color: #41adc0; font-size: 1.6em; margin: 0; font-weight: normal; } #title h3 { color: #41adc0; font-size: 1.1em; margin: 0; font-weight: normal; } /* application */ #map { min-width: 700px; max-width: 1000px; height: 450px; }
<div id="container"> <div id="title"> <h1>いきテスト用</h1> <h3>いきテスト用:気候の似ている都市を探せるシステム</h3> </div> <div id="application"> <div id="loading"> <img src="http://app.linkdata.org/asset/e1c6626d.png"/> </div> <div id="main_contents"> <div id="map">map</div> </div> </div> </div>
Preview
Input Data
ReadMe
Snapshots
LinkData Work
Table Data
Faamo
Contributor:Sayoko Shimoyama
Update:Apr 13, 2014
1039 Downloads, 3 Applications
city_market
city_master
city_observation
Add LinkData work(LinkData)
Link http://app.linkdata.org/run/app1s628i?tab=readme
jquery-1.7.1.min.js
https://www.google.com/jsapi
http://maps.googleapis.com/maps/api/js?sensor=false&v=3&language=ja&libraries=visualization
Work
Add
Clear
insert work id or work name.