Google マップの InfoWindow をモーダル ウィンドウのように動作させる方法はありますか? ここに私の目標があります:
- 画面の幅と高さのすべてまたはほとんどを占める
- マーカーがクリックされたときにマップを自動的に移動しない
これらの目標を達成するために誰かが私を正しい方向に向けることができれば、それは大歓迎です. ありがとうございました!
Google マップ API v3
Google マップの InfoWindow をモーダル ウィンドウのように動作させる方法はありますか? ここに私の目標があります:
これらの目標を達成するために誰かが私を正しい方向に向けることができれば、それは大歓迎です. ありがとうございました!
Google マップ API v3
それは実際には非常に簡単です。マップ情報ボックスを無視して、幅と高さが 100% の 0,0 に固定された HTML に余分な div を追加します。
cssで非表示にしてから、マーカーの「クリック」イベント関数を使用して、divを表示し、コンテンツを挿入します。
フルスクリーン完了。
情報ウィンドウを使用する代わりに、カスタム モーダルを作成する必要があります。
これを実現するには、Bootstrap の使用を検討することをお勧めします。ドキュメントでは、モーダルの使用方法を例で非常にうまく説明しています。スタイリングもとても綺麗です。
画面スペースの大部分を占めるようにしたい場合は、モーダルを完全にカスタムで構築する必要があるかもしれません。
その後、クリック イベントでカスタム モーダルを Hide()/Show() することができます。