teratail
回答率
85.48%
質問するログイン新規登録

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

新規登録して質問してみよう
ただいま回答率
85.48%
トップJavaScriptに関する質問
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述･作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像･リスト･表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

3873閲覧

google maps 情報ウィンドウの複数表示

RR_KK
RR_KK

総合スコア12

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述･作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像･リスト･表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2016/11/26 06:14

0

0

現在 HTML、CSS、JavaScriptなどを勉強中のものです。
まだまだ知識がなさすぎるので出来るだけわかりやすく教えていただけると助かります＞＜

初めて質問させていただくので、なにか不適切な面がありましたらご指摘ください。

#Ｑ.google maps
で 情報ウィンドウを同時に複数表示させ、
別のリンクを押すと、その情報ウィンドウへと地図が移動する、ということを
実行させたいと思っております。

地図を表示させ、一つだけ情報ウィンドウを表示させるところまでは
できたのですが、複数を同時に表示させる方法がわかりません、、、

教えてください。お願いします！！

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <div id="map" style="width:1020px; height:500px;"></div>
    <script>
      function initMap() {
        var myLatLng = {lat:34.675439, lng: 133.531429};
				
        // Create a map object and specify the DOM element for display.
        var map = new google.maps.Map(document.getElementById('map'), {
          center: myLatLng,
          scrollwheel: false,//スクロールの制御
          zoom: 17
        });

        // Create a marker and set its position.
        var marker = new google.maps.Marker({
          map: map,
          position: myLatLng,
        });
				var infoWindowOption={//情報ウィンドウの表示
					position:myLatLng,//座標
					content:"<div id='infoWindow'>テキスト<br></div>"
				};
				
				//情報ウィンドウの生成
				var infoWindow=new google.maps.InfoWindow(infoWindowOption);
				//情報ウィンドウを開いておく
				infoWindow.open(map);
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDU2APVixt-Rd4BU7sPao9ioxIOEWo0DnY&callback=initMap"
        async defer></script>
  </body>
</html>

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1件

0

ベストアンサー

【複数のgoogle.maps.Markerそれぞれに吹き出しをつける】
http://www.nanchatte.com/map/showDifferentInfoWindowOnEachMarker.html

【配列を使用してGoogleMapに複数のマーカと情報ウィンドウを表示する | Blog | 06.GRASSHOPPER】
https://ghweb.info/post-2709.html

【google maps infowindow 複数 - Google 検索】
https://www.google.co.jp/search?num=100&safe=off&site=&source=hp&q=google+maps+infowindow+%E8%A4%87%E6%95%B0

投稿2016/11/26 06:17

kei344
kei344

総合スコア69407

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

RR_KK
RR_KK

2016/11/26 06:20

回答ありがとうございます！ マーカーに情報ウィンドウをつけたものではなく、 情報ウィンドウだけを地図上に複数表示させたいのですが、 それはこのやり方でも可能なのでしょうか？？＞＜
kei344
kei344

2016/11/26 06:22 編集

標準の情報ウィンドウにそういう機能は無いはずなので、独自にマーカーを作る必要があります。
RR_KK
RR_KK

2016/11/26 06:38

何度も調べていただいて、ありがとうございます！ わたしもこのサイト等を見ながら、一つの情報ウィンドウを 表示させることはできたのですが、複数を同時に表示させるには 表示させる座標をリストなど別で読み込んでいくのか、 ひとつずつ書いていくのか、、方法がわからず こちらで質問させていただいた次第です。。
kei344
kei344

2016/11/26 06:41

それなら回答で提示したものを見てコードを組まれては？マーカーを情報ウィンドウに置き換えて考えればたいした違いは無いと思いますよ。
RR_KK
RR_KK

2016/11/26 07:04

いま組んでみてる途中ですが、複数の情報ウィンドウが 表示するようになりました！ また先へ進んでわからなければ質問させていただきます。 ありがとうございました！
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

トップJavaScriptに関する質問

google maps 情報ウィンドウの複数表示