「15a24/ジオタグ地図」の編集履歴（バックアップ）一覧はこちら

「15a24/ジオタグ地図」の最新版変更点

追加された行はこの色になります。

削除された行はこの色になります。

 #javascript(){{
 <meta name="viewport" content="device-width,initial-scale=1,user-scalable=no" />
 <script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=ABQIAAAAYcnMuEZ9aVvC2_asbHKXuRRnaTBbG-tmmWKb-1Nfcxygo7GqNhQvW8gRUfZFDuDXbWYHCA8N3keWWw&hl=ja"></script>
 <script type="text/javascript" src="http://www21.atwiki.jp/15x24/?cmd=upload&act=open&page=15a24%2F%E3%82%B8%E3%82%AA%E3%82%BF%E3%82%B0%E5%9C%B0%E5%9B%B3&file=twitterapi.js"></script>
 <script type="text/javascript">
 function callbackSearchGeoToMap(res)
 {
     var str = '';
 
     var baseIcon = new GIcon();
     baseIcon.iconSize = new GSize(16, 16);
     baseIcon.iconAnchor = new GPoint(8, 8);
     baseIcon.infoWindowAnchor = new GPoint(8, 2);
 
     function createMarker(point, infoText, profileImageURL) {
         var profileIcon = new GIcon(baseIcon);
         profileIcon.image = profileImageURL;
         var markerOptions = {
             icon: profileIcon
         };
         var marker = new GMarker(point, markerOptions);
         GEvent.addListener(marker, "click", function() {
                     marker.openInfoWindowHtml(infoText);
                 });
         return marker;
     }
 
     function getDateTime(str) {
         var date = new Date(str);
         if (date == null) { return str; }
         return date.toLocaleString();
     }
 
     function getInfoText(obj) {
         var dateTime = getDateTime(obj.created_at);
         return '<img src="' + obj.profile_image_url + '" width=16 height=16 alt="icon" />'
              + obj.from_user + ':'
              + obj.text
              + ', geo:' + obj.geo.coordinates
              + ' (' + dateTime + ')';
     }
 
     function getMarkerText(obj) {
         var dateTime = getDateTime(obj.created_at);
         return '<img src="' + obj.profile_image_url + '" width=32 height=32 alt="icon" style="vertical-align: text-bottom" />'
              + '&nbsp;' + obj.from_user + '<br />'
              + '<div style="clear: both">' + obj.text + '</div>'
              + '<div style="text-align: right">(' + dateTime + ')</div>';
     }
 
     for (var i = 0; i < res.results.length; i++) {
         var obj = res.results[i];
         if (obj.geo != null) {
             var infoText = getInfoText(obj);
             str += infoText + '<br />';
 
             var lat = obj.geo.coordinates[0];
             var lng = obj.geo.coordinates[1];
             var point = new GLatLng(lat, lng);
             var markerText = getMarkerText(obj);
             var profileImageURL = obj.profile_image_url;
             var marker = createMarker(point, markerText, profileImageURL);
             map.addOverlay(marker);
         }
     }
     document.getElementById('info_text').innerHTML = str;
 }
 function searchGeoToMap() {
     map.clearOverlays()
     var q = document.getElementById('q').value;
     var param = 'q=' + escape(q) + "&rpp=100&geocode=35.69%2C139.70%2C100km";
     TwitterAPI.search(callbackSearchGeoToMap, '', param);
 }
 
 var map;
 var geocoder;
 
 function firstSearch() {
     initialize();
     searchGeoToMap();
 }
 
 function initialize() {
     if (GBrowserIsCompatible()) {
         document.getElementById('r_side').style["display"] = "none";
         document.getElementById('header').style["display"] = "none";
 
 	if(navigator.userAgent.indexOf("iPhone") != -1 || navigator.userAgent.indexOf("iPod") != -1){
 		ua="iphone";
 
 document.getElementById('headBarWrapper').style["width"] = "320px";
 document.getElementById('atwiki-jp-bg1').style["width"] = "320px";
 document.getElementById('atwiki-jp-bg1').style["clear"] = "both";
 document.getElementById('wrapper').style["width"] = "320px";
 document.getElementById('content').style["width"] = "320px";
 document.getElementById('map_canvas').style["width"]  = "300px";
 document.getElementById('map_canvas').style["height"] = "300px";
 document.getElementById('info_text').style["width"]  = "300px";
 document.getElementById('info_text').style["height"]  = "100px";
 
 	}else{
 
 document.getElementById('wrapper').style["width"] = (window.innerWidth - 20) + "px";
 document.getElementById('map_canvas').style["width"]  = (window.innerWidth - 100) + "px";
 document.getElementById('map_canvas').style["height"] = (window.innerHeight - 300) + "px";
 document.getElementById('info_text').style["width"]  = (window.innerWidth - 100) + "px";
 
 	}
 
 
         var point = new GLatLng(35.69, 139.70);
         map = new GMap2(document.getElementById("map_canvas"));
         map.setCenter(point, 13);
         map.setZoom(12)
 
         map.addControl(new GLargeMapControl());
         geocoder = new GClientGeocoder()
     }
 }
 
 window.onunload = GUnload;
 window.onload =   firstSearch;
 
 </script>
 
 <div id="map_canvas" style="width: 800px; height: 800px"></div>
 <form onsubmit="searchGeoToMap(); return false;">
 <input type="text" id="q" value="#15a24" />
 <input type="submit" value="twitter 検索→ジオタグ表示" />
 </form>
-<div id="info_text" style="height: 200px; width: 800px; overflow: scroll; background: #f8ffff;"></div>
+<div id="info_text" style="height: 200px; width: 800px; overflow: auto; background: #f8ffff;"></div>
 }}
 * ジオタグ地図
 
 twitter を検索して、最新100件のジオタグの位置を表示します。
 
 注：
 - 都心から半径100km以内のジオタグのみ反応します。
 - twitter API の仕様により、1時間に100回程度しか検索できません。
 
 謝辞：
 http://m-ono.info/tech/geotag-viewer/ をたいへん参考にさせていただきつつ、 http://www.otchy.net/javascript/twitter-api/ を利用して作成しました。
 
 
 
 
 
 ----