noteにGoogleマップ埋め込みする時にピンを真ん中にする方法
自分向け備忘録
noteで記事を書く時に、GoogleMapで目的地を表示して共有ボタンを押すと、ピンが右にずれたりスマホでうまく表示できなかったり最悪の場合まってく位置そのものがズレてしまう問題
たとえば先日いった「裏庭」の地図をGoogleマップで検索し、その共有ボタンを押して貼った地図がこちら。
https://goo.gl/maps/krZ6zFwAj15UsGF49↑のコードをNoteに貼って埋め込んだのが↓
見事に右にずれる。そしてこれをスマホで表示すると
すでにピンすら見えない、、、、、。
もちろんズラすと見えるんだけど、これじゃ場所を表示する目的を果たせていない。
これを是正する方法を見つけた。手順は以下（超面倒くさい。。）
手順１）GoogleMapをスマホのブラウザで表示
手順２）同じやりかたで目的地を検索
手順３）PC版と同じ方法で共有→URLコピー
https://www.google.co.jp/maps/place/%E3%80%92411-0857+%E9%9D%99%E5%B2%A1%E7%9C%8C%E4%B8%89%E5%B3%B6%E5%B8%82%E8%8A%9D%E6%9C%AC%E7%94%BA%EF%BC%91%EF%BC%91%E2%88%92%EF%BC%95+%E8%A3%8F%E5%BA%AD/@35.1210788,138.9139273,19z/data=!4m14!1m7!3m6!1s0x60199a8212e539dd:0xd7533d6a8aba2fc5!2z44CSNDExLTA4NTcg6Z2Z5bKh55yM5LiJ5bO25biC6Iqd5pys55S677yR77yS4oiS77yR77yX!8m2!3d35.1209317!4d138.9141142!16s%2Fg%2F11fx3wykx7!3m5!1s0x60199a826b5948ab:0x6274fd887d555b57!8m2!3d35.1210788!4d138.9139273!16s%2Fg%2F1td0sykq?hl=ja↑この方法で取得できた共有リンクを貼りつけて埋め込んだのが↓
↓スマホでこのnoteの記事表示しても大丈夫
なんでこうなるのか理由はよくわかってません。。
PC版の検索の仕方がおかしいのかな？
いずれにしても、うまく地図表示できていない方はこちらを参考にしてみてください。
コメント