【最高300ポイント】再質問させて頂きます。Google Mapに自前の画像を表示させて、縮尺ボタンと連動させて拡大・縮小したいと考えています。JavaScriptのサンプルを教えていただけますか。宜しくお願いいたします。

Question

er7

47

44もっと見る

300pt

コンピュータインターネット

【最高300ポイント】再質問させて頂きます。Google Mapに自前の画像を表示させて、縮尺ボタンと連動させて拡大・縮小したいと考えています。JavaScriptのサンプルを教えていただけますか。宜しくお願いいたします。

回答の条件

URL必須
1人2回まで

登録：2006/10/02 01:47:23
終了：2006/10/02 20:45:45

※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

talepanda 2006/10/02 21:19:08

仰るとおりGMarkerのアイコンとzoomendイベントで強引にごにょごにょやるのもありかと思います。
ただそれだと、余計なものが色々付いてきてややこしいかと。

GMarkerも結局はGOverlayのサブクラスなので、直接GOverlayを使うほうが、中身を好き勝手弄れるので柔軟だと思いますよ。例えば動画を貼り付けるとかも出来ますしね。
er7 2006/10/02 21:36:19

なるほど。。。動画の貼り付けもできるのは面白いですね。弄り易いほうが楽しいと思いますし。

人力検索はてな自作の地図画像で、Googlemapのようにグリ.. 2006-10-10 18:26:27
速報ダム日和 2007-02-08 00:44:16

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

リクエスト送信済

回答リクエストを送信したユーザーはいません

talepanda · Accepted Answer · 2006-10-02T16:11:30+09:00

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps JavaScript API Example</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key="
	    type="text/javascript"></script>
    <script type="text/javascript">
      function TestOvy(){      // location and size, src
      this._x=139.7454;
      this._y=35.65872;
      this._w=0.001;
      this._h=0.001;
      this._src="tmp.jpg";
      }
      TestOvy.prototype = new GOverlay();
      TestOvy.prototype.initialize = function(map) {
      var div = document.createElement("img");div.style.backgroundColor = "pink";div.style.position = "absolute";div.src=this._src;
      map.getPane(G_MAP_MARKER_PANE).appendChild(div);this._div = div;this._map=map;
      }
      TestOvy.prototype.redraw = function(force){
      if (!force) return;
      var m=this._map,z=m.getSize(),s=m.getBounds().toSpan(),p=m.fromLatLngToDivPixel(new GLatLng(this._y,this._x));
      this._div.style.width=z.width*(this._w/s.lng())+"px";
      this._div.style.height=z.height*(this._h/s.lat())+"px";
      this._div.style.left=p.x+"px";
      this._div.style.top=p.y+"px";
      }
      function load() {
      if (GBrowserIsCompatible()) {
      var map = new GMap2(document.getElementById("map"));
      map.setCenter(new GLatLng(35.65872,139.7454), 16);
      map.addControl(new GLargeMapControl());
      map.addOverlay(new TestOvy());
      map.addOverlay(new GMarker(new GLatLng(35.65872,139.7454)));
      }
      }
    </script>
  </head>
  <body onload="load()" onunload="GUnload()"><div id="map" style="width: 500px; height: 300px"></div></body>
</html>

みたいな。

マーカーは確認のためにおいてるだけなので、外してもらってもおｋ

http://www.google.com

【最高300ポイント】再質問させて頂きます。Google Mapに自前の画像を表示させて、縮尺ボタンと連動させて拡大・縮小したいと考えています。JavaScriptのサンプルを教えていただけますか。宜しくお願いいたします。

ベストアンサー

talepanda57122006/10/02 16:11:30

コメント（2件)

この質問への反応（ブックマークコメント）

トラックバック