🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
Google API

Googleは多種多様なAPIを提供していて、その多くはウェブ開発者向けのAPIです。それらのAPIは消費者に人気なGoogleのサービス(Google Maps, Google Earth, AdSense, Adwords, Google Apps,YouTube等)に基づいています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

Google

Googleは、アメリカ合衆国に位置する、インターネット関連のサービスや製品を提供している企業です。検索エンジンからアプリケーションの提供まで、多岐にわたるサービスを提供しています。

Q&A

解決済

2回答

1294閲覧

Google Maps SDK for iOSでマップ上にボタンやラベルを配置したい

W.Taka

総合スコア31

Google API

Googleは多種多様なAPIを提供していて、その多くはウェブ開発者向けのAPIです。それらのAPIは消費者に人気なGoogleのサービス(Google Maps, Google Earth, AdSense, Adwords, Google Apps,YouTube等)に基づいています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

Google

Googleは、アメリカ合衆国に位置する、インターネット関連のサービスや製品を提供している企業です。検索エンジンからアプリケーションの提供まで、多岐にわたるサービスを提供しています。

0グッド

0クリップ

投稿2021/01/30 07:52

現在作成しているアプリで、表示したMap上もしくはMap外にボタンやラベルを配置したいと考えています。

◆困っていること
現在は以下のコードでMapが表示できていいます。
しかしこの場合、ストーリーボード上に設置したボタンやラベルを無視して画面全体にMapが表示されるようで
用意したボタンなどがMap上に表示されません。

Swift

1 private func setupMap() { 2 // GoogleMapの初期位置(仮で東京駅付近に設定) 3 let camera = GMSCameraPosition.camera(withLatitude: 35.6812226, longitude: 139.7670594, zoom: 12.0) 4 mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera) 5 mapView.isUserInteractionEnabled = true 6 mapView.delegate = self 7 self.view = mapView 8 }

そこでMap用のViewを追加して、そのViewにMapを入れる方法を試してみました。
イメージは以下の通りです。
イメージ説明

Swift

1 @IBOutlet weak var viewMap: UIView! 2 3 private func setupMap() { 4 // GoogleMapの初期位置(仮で東京駅付近に設定) 5 let camera = GMSCameraPosition.camera(withLatitude: 35.6812226, longitude: 139.7670594, zoom: 12.0) 6 mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera) 7 mapView.isUserInteractionEnabled = true 8 mapView.delegate = self 9 viewMap = mapView 10 }

上記のように実装をしたところMapが表示されませんでした。
また、色々と試してみたのですが、「self.view.addsubview(map)」のように
AddSubViewを使用しても表示がされませんでした。

Map上にボタンを置く方法もしくは「self.view = mapView」以外の書き方で
Mapを表示する方法を知っている方がいましたら解決方法をご教授願います。

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

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

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

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

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

hoshi-takanori

2021/01/30 19:41

self.view = mapView だと view controller の view を置き換えて mapView だけが表示される状態になってしまいますので、self.view.addSubview(mapView) する必要がありますが、それだけだと最前面に来るので、self.view.sendSubviewToBack(mapView) で後ろに持っていくと良いのでは。
W.Taka

2021/03/06 08:36

hoshi-takanotiさん 親切に回答をいただいたのにもかかわらず、返信が遅くなってしまい大変申し訳ありません。 回答していただいた件についてですが試したところ、 ラベルやボタン部分が表示されるようにはなったのですがマップが表示されませんでした。 なぜかAddSubViewを使うとマップが表示されなくなくなるのですが、 どういったことが原因と考えられますでしょうか。
W.Taka

2021/03/06 08:47

マップを表示しようとしている画面について、 TabBarContorollerを使用しているのですがこちらが問題の可能性はありますでしょうか。。。
hoshi-takanori

2021/03/06 09:06

mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera) の withFrame: CGRect.zero を withFrame: self.view.bounds にする必要がありそうですね。
W.Taka

2021/03/06 09:16

hoshi-takanoriさん 早急な回答ありがとうございます。 withFrame: CGRect.zero を withFrame: self.view.boundsに変更したところ うまく表示されるようになりました! Mapを表示する枠のサイズが0に設定されていたということだったのでしょうか。 だとするのであれば、viewMap = mapViewで表示される理由が謎になりますが・・・
W.Taka

2021/03/06 09:17

hoshi-takanoriさんをベストアンサーに選びたいので、 差し支えなければ回答の方にコメントをいただけると幸いです。
hoshi-takanori

2021/03/06 09:22

私は何も確認してないので、W.Taka さんが書いたちゃんと動くコードを回答欄に貼って自己解決にしちゃってください。
W.Taka

2021/03/06 09:27

hoshi-takanoriさんのおかげで解決できたのによろしいのでしょうか。 そういっていただけるのであれば、自己解決方向でCloseさせていただきます。 本当にありがとうございました。 また機会がありましたらよろしくお願い致します。
guest

回答2

0

自己解決

以下2つの部分を修正することで解決することができました。

・1つ目
◆修正前
mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)
◆修正後
mapView = GMSMapView.map(withFrame: self.view.bounds, camera: camera)

・2つ目
◆修正前
self.view = mapView
◆修正後
self.view.addSubview(mapView)
self.view.sendSubviewToBack(mapView)

回答をいただいたhoshi-takanoriさん、tomatoさんありがとうございました。

投稿2021/03/06 09:34

W.Taka

総合スコア31

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

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

0

ただIBOutletを@IBOutlet weak var mapView: GMSMapView!とすればいいのではないですか?

投稿2021/02/01 11:37

tomato879241

総合スコア133

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

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

W.Taka

2021/03/06 08:46

tomatoさん 親切に回答していただいたにもかかわらず、返信が遅くなってしまい申し訳ありません。 こちら試してみましたが、マップは表示されるもののボタンやラベルは表示がされませんでした。 上記に回答をいただいた、hoshi-takanoriさんのいう通り self.view = mapView このViewの設定に問題があるのかもしれません・・・ かといってAddSubViewを使用すると今度はマップが表示されなくなります 何かこの問題について知っていることがありましたらご教授願いたいです。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.36%

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

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

質問する

関連した質問