ゼロと無限の間に

フリーでオープンソースなJavaScriptとかPHPとか。

ユーザ用ツール

サイト用ツール


javascript:google-mapper-v3

差分

この文書の現在のバージョンと選択したバージョンの差分を表示します。

この比較画面にリンクする

両方とも前のリビジョン 前のリビジョン
次のリビジョン
前のリビジョン
javascript:google-mapper-v3 [2011/12/15 22:01]
dgbadmin [サンプル]
javascript:google-mapper-v3 [2015/09/22 14:38] (現在)
dgbadmin [ソースコード] 0.7.1
ライン 5: ライン 5:
 {{http://​maps.google.com/​maps/​api/​staticmap?​center=38%2C137&​zoom=5&​sensor=false&​size=400x460&​markers=color%3Ared%7Clabel%3AA%7C%E6%9C%AD%E5%B9%8C&​markers=color%3Ablue%7Clabel%3AB%7C%E4%BB%99%E5%8F%B0&​markers=color%3Aorange%7Clabel%3AC%7C%E6%9D%B1%E4%BA%AC&​markers=color%3Agreen%7Clabel%3AD%7C%E5%90%8D%E5%8F%A4%E5%B1%8B&​markers=color%3Agray%7Clabel%3AE%7C%E5%A4%A7%E9%98%AA&​markers=color%3Ayellow%7Clabel%3AF%7C%E5%BA%83%E5%B3%B6&​markers=color%3Apurple%7Clabel%3AG%7C%E7%A6%8F%E5%B2%A1&​.png?​}} {{http://​maps.google.com/​maps/​api/​staticmap?​center=38%2C137&​zoom=5&​sensor=false&​size=400x460&​markers=color%3Ared%7Clabel%3AA%7C%E6%9C%AD%E5%B9%8C&​markers=color%3Ablue%7Clabel%3AB%7C%E4%BB%99%E5%8F%B0&​markers=color%3Aorange%7Clabel%3AC%7C%E6%9D%B1%E4%BA%AC&​markers=color%3Agreen%7Clabel%3AD%7C%E5%90%8D%E5%8F%A4%E5%B1%8B&​markers=color%3Agray%7Clabel%3AE%7C%E5%A4%A7%E9%98%AA&​markers=color%3Ayellow%7Clabel%3AF%7C%E5%BA%83%E5%B3%B6&​markers=color%3Apurple%7Clabel%3AG%7C%E7%A6%8F%E5%B2%A1&​.png?​}}
  
-[[http://code.google.com/​intl/​ja/​apis/maps/​documentation/​v3/|Google Maps APIのバージョン3(V3)]]が公開されたので、バージョン2用に作った[[google mapper|Google Mapper]]とは別に、Google Maps API V3用の「Google Mapper V3」を書き直した。\\+[[https://developers.google.com/​maps/​|Google Maps APIのバージョン3(V3)]]が公開されたので、バージョン2用に作った[[google mapper|Google Mapper]]とは別に、Google Maps API V3用の「Google Mapper V3」を書き直した。\\
 これを使えば、普通に地図を表示する他にも、ストリートビューの表示、Google AdSenseの表示、httpsでのアクセス(SSLで暗号化されたセキュアなページの表示)など、いろいろなことを手軽に実現できる。 これを使えば、普通に地図を表示する他にも、ストリートビューの表示、Google AdSenseの表示、httpsでのアクセス(SSLで暗号化されたセキュアなページの表示)など、いろいろなことを手軽に実現できる。
  
ライン 18: ライン 18:
 [[http://​0-oo.net/​sam/​google-mapper/​drawing.php|Google Mapper V3で長方形や円や自由図形や折れ線を描くサンプル]] [[http://​0-oo.net/​sam/​google-mapper/​drawing.php|Google Mapper V3で長方形や円や自由図形や折れ線を描くサンプル]]
  
-[[https://​0-oo.googlecode.com/​svn/​trunk/​sam/​google-mapper-v3-over-https.html|Google Mapper V3をHTTPSで表示するサンプル]]+[[https://​0-oo.github.io/​sam/​google-mapper-v3-over-https.html|Google Mapper V3をHTTPSで表示するサンプル]]
  
 [[http://​0-oo.net/​hotel/​|ホテル 旅館 × 地図から検索]] (応用例 1) [[http://​0-oo.net/​hotel/​|ホテル 旅館 × 地図から検索]] (応用例 1)
ライン 34: ライン 34:
  
 ===== ダウンロード ===== ===== ダウンロード =====
-[[http://​0-oo.googlecode.com/​svn/​google-mapper-v3.js|google-mapper-v3.js]]+[[http://g.0-oo.net/​google-mapper-v3.js|google-mapper-v3.js]]
  
 ※ダウンロードできるのは最新のBeta版の場合もあります ※ダウンロードできるのは最新のBeta版の場合もあります
ライン 61: ライン 61:
 </​code>​ </​code>​
  
-==== アイコン画像を指定してマーカーを表示する ​====+=== アイコン画像を指定してマーカーを表示する ===
 <code javascript>​ <code javascript>​
 GoogleMapper.addMarker(35.7,​ 139.7, "​東京",​ iconUrl); GoogleMapper.addMarker(35.7,​ 139.7, "​東京",​ iconUrl);
 </​code>​ </​code>​
  
-==== 色を指定してマーカーを表示する ​====+=== 色を指定してマーカーを表示する ===
 <code javascript>​ <code javascript>​
 GoogleMapper.addColorMarker(34.7,​ 135.5, "​大阪",​ "​FF0"​);​ GoogleMapper.addColorMarker(34.7,​ 135.5, "​大阪",​ "​FF0"​);​
 </​code>​ </​code>​
  
-==== 色を指定してマーカーを表示して、その中に文字を表示する ​====+=== 色を指定してマーカーを表示して、その中に文字を表示する ===
 <code javascript>​ <code javascript>​
 GoogleMapper.addColorMarker(34.7,​ 135.5, "​大阪",​ "​FF0",​ "​000",​ "​虎"​);​ GoogleMapper.addColorMarker(34.7,​ 135.5, "​大阪",​ "​FF0",​ "​000",​ "​虎"​);​
 </​code>​ </​code>​
  
-==== 吹出し型のマーカーを表示する ​====+=== 吹出し型のマーカーを表示する ===
 <code javascript>​ <code javascript>​
 GoogleMapper.addBubbleMarker(26.2,​ 127.7, "​那覇"​);​ GoogleMapper.addBubbleMarker(26.2,​ 127.7, "​那覇"​);​
ライン 172: ライン 172:
  ​* ​ GoogleMapper V3 - (The Wrapper Class of Google Maps API V3)  ​* ​ GoogleMapper V3 - (The Wrapper Class of Google Maps API V3)
  ​* ​ @see       ​http://​0-oo.net/​sbox/​javascript/​google-mapper-v3  ​* ​ @see       ​http://​0-oo.net/​sbox/​javascript/​google-mapper-v3
- ​* ​ @version ​  0.7.0 + ​* ​ @version ​  0.7.1 
- ​* ​ @copyright 2008-2011 dgbadmin@gmail.com+ ​* ​ @copyright 2008-2015 dgbadmin@gmail.com
  ​* ​ @license ​  ​http://​0-oo.net/​pryn/​MIT_license.txt (The MIT license)  ​* ​ @license ​  ​http://​0-oo.net/​pryn/​MIT_license.txt (The MIT license)
  *  *
  ​* ​ See also Google Maps API V3 documents.  ​* ​ See also Google Maps API V3 documents.
- ​* ​ @see http://code.google.com/​intl/​ja/​apis/​maps/​documentation/​javascript/​ + ​* ​ @see https://developers.google.com/​maps/​documentation/​javascript/​reference
- ​* ​ @see http://​code.google.com/​apis/​maps/​documentation/​javascript/​reference.html+
  */  */
 var GoogleMapper = { var GoogleMapper = {
ライン 218: ライン 217:
  ​* ​ @param ​ Object ​ options (Optional) Mapに渡すパラメータ  ​* ​ @param ​ Object ​ options (Optional) Mapに渡すパラメータ
  ​* ​ @return Map  ​* ​ @return Map
- ​* ​ @see http://code.google.com/apis/​maps/​documentation/​javascript/​reference.html#MapOptions + ​* ​ @see https://developers.google.com/​maps/​documentation/​javascript/​reference#​MapOptions
- * +
- ​* ​ stylesを確認できるツール +
- ​* ​ @see http://​gmaps-samples-v3.googlecode.com/​svn/​trunk/​styledmaps/​wizard/​index.html+
  */  */
 GoogleMapper.show = function(mapId,​ lat, lng, zoom, options) { GoogleMapper.show = function(mapId,​ lat, lng, zoom, options) {
ライン 255: ライン 251:
  *  *
  ​* ​ (参考)Google Maps用のマーカー画像の配布サイト  ​* ​ (参考)Google Maps用のマーカー画像の配布サイト
- ​* ​ @see http://code.google.com/​p/​google-maps-icons/+ ​* ​ @see https://mapicons.mapsmarker.com/
  */  */
 GoogleMapper.addMarker = function(lat,​ lng, title, image) { GoogleMapper.addMarker = function(lat,​ lng, title, image) {
ライン 288: ライン 284:
  ​* ​ @param ​ String ​             str         ​(Optional) マーカー上に表示する文字  ​* ​ @param ​ String ​             str         ​(Optional) マーカー上に表示する文字
  ​* ​ @return String or MarkerImage  ​* ​ @return String or MarkerImage
- ​* ​ @see http://code.google.com/apis/​chart/​docs/​gallery/​dynamic_icons.html+ ​* ​ @see https://developers.google.com/​chart/image/​docs/​gallery/​dynamic_icons
  */  */
 GoogleMapper.addColorMarker = function(lat,​ lng, title, bgColor, textColor, str) { GoogleMapper.addColorMarker = function(lat,​ lng, title, bgColor, textColor, str) {
ライン 315: ライン 311:
  ​* ​ @param ​ String ​             style       ​(Optional) 吹き出し形状(尻尾無しは"​bbT"​)  ​* ​ @param ​ String ​             style       ​(Optional) 吹き出し形状(尻尾無しは"​bbT"​)
  ​* ​ @return String or MarkerImage  ​* ​ @return String or MarkerImage
- ​* ​ @see http://code.google.com/apis/​chart/​docs/​gallery/​dynamic_icons.html+ ​* ​ @see https://developers.google.com/​chart/image/​docs/​gallery/​dynamic_icons
  */  */
 GoogleMapper.addBubbleMarker = function(lat,​ lng, str, bgColor, textColor, style) { GoogleMapper.addBubbleMarker = function(lat,​ lng, str, bgColor, textColor, style) {
ライン 499: ライン 495:
  ​* ​ @param ​ Function ​   callback ​   (Optional) 検索結果が渡されるCallback関数  ​* ​ @param ​ Function ​   callback ​   (Optional) 検索結果が渡されるCallback関数
  ​* ​                                 渡されるのはGeocoderResponseの配列とGeocoderStatus  ​* ​                                 渡されるのはGeocoderResponseの配列とGeocoderStatus
- ​* ​ @see http://code.google.com/apis/​maps/​documentation/​v3/reference.html#Geocoder+ ​* ​ @see https://developers.google.com/​maps/​documentation/​javascript/​reference#​Geocoder
  */  */
 GoogleMapper.search = function(keywords,​ callback) { GoogleMapper.search = function(keywords,​ callback) {
ライン 542: ライン 538:
  ​* ​ @param ​ Function ​   callback ​   検索結果が渡されるCallback関数  ​* ​ @param ​ Function ​   callback ​   検索結果が渡されるCallback関数
  ​* ​                                 渡されるのはGeocoderResponseの配列とGeocoderStatus  ​* ​                                 渡されるのはGeocoderResponseの配列とGeocoderStatus
- ​* ​ @see http://code.google.com/apis/​maps/​documentation/​v3/reference.html#Geocoder+ ​* ​ @see https://developers.google.com/​maps/​documentation/​javascript/​reference#​Geocoder
  */  */
 GoogleMapper.searchByLatLng = function(latLng,​ callback) { GoogleMapper.searchByLatLng = function(latLng,​ callback) {
ライン 655: ライン 651:
  ​* ​ Google Placesに登録されているスポットを表示する(要Placesライブラリ)  ​* ​ Google Placesに登録されているスポットを表示する(要Placesライブラリ)
  ​* ​ @param ​ Number ​ iconSize ​   (Optional) アイコンの表示サイズ  ​* ​ @param ​ Number ​ iconSize ​   (Optional) アイコンの表示サイズ
- ​* ​ @see http://code.google.com/apis/​maps/​documentation/​javascript/​places.html+ ​* ​ @see https://developers.google.com/​maps/​documentation/​javascript/​places
  */  */
 GoogleMapper.showPlaces = function(iconSize) { GoogleMapper.showPlaces = function(iconSize) {
ライン 721: ライン 717:
  ​* ​ @param ​ ControlPosition position ​   (Optional) 地図上のどこに表示するか  ​* ​ @param ​ ControlPosition position ​   (Optional) 地図上のどこに表示するか
  ​* ​ @param ​ String ​         channel ​    ​(Optional) AdSenseのチャネル番号  ​* ​ @param ​ String ​         channel ​    ​(Optional) AdSenseのチャネル番号
- ​* ​ @see http://code.google.com/apis/​maps/​documentation/​javascript/​advertising.html+ ​* ​ @see https://developers.google.com/​maps/​documentation/​javascript/​advertising
  */  */
 GoogleMapper.showAds = function(pubId,​ format, position, channel) { GoogleMapper.showAds = function(pubId,​ format, position, channel) {
ライン 830: ライン 826:
  
     //​マーカーを表示     //​マーカーを表示
-    ​var iconUrl = "//​google-maps-icons.googlecode.com/​files/​moderntower.png";​ +    var tokyo = GoogleMapper.addMarker(35.7,​ 139.7, "​東京"​);​
-    ​var tokyo = GoogleMapper.addMarker(35.7,​ 139.7, "​東京"​, iconUrl);+
     //​マーカー上に吹き出しを表示     //​マーカー上に吹き出しを表示
     GoogleMapper.openMarkerWindow(tokyo);​     GoogleMapper.openMarkerWindow(tokyo);​
javascript/google-mapper-v3.1323954102.txt.gz · 最終更新: 2011/12/15 22:01 by dgbadmin