ホームページを製作する際、GoogleMapのAPIを使って、サイト上に地図と場所を示すオリジナルのピンを表示させるってことはもう当たり前に行なっていますが、そのピンがRetinaディスプレイなどの高解像度ディスプレイに対応しきれていないサイトが多いように感じます。今回のエントリーではその方法をご紹介します。(自分のサイトにアクセスマップを入れてなかったなんて言えない。)緯度経度を調べるあらかじめ緯度経度を調べておく必要があるので、GoogleMapで目的の住所を打ち込み、表示されたマーカーの上で右クリックして「この場所について」をクリックしてください。赤枠の部分が緯度経度ですので、その部分をクリックすると左側に大きく表示されますのでそれをコピーするなりなんなりしておいてください。APIを使うKeyを取得しなければなりません。APIキーの取得にはGoogleアカウントが必要になりますので、事前に用意しておいてください。こちらのページから「キーの取得」をクリックして、指示に従えば取得できます。(手抜き)その取得したキーを以下のようにはめ込みます。src="https://maps.googleapis.com/maps/api/js?key=ここに取得したキーを入れる"></script>そして、以下のjavascriptをコピペして、それぞれの条件に当てはめます。100)//画像のサイズを入力。initialize);</script>これをヘッダーなどに入れてください。これで表示させる準備は終わりです。id="map"></div>これを表示させたい場所に貼り付けます。このままでは表示されないので、スタイルシートなどで調整します。height:400px;}こんな感じでこれで高解像度ディスプレイに対応できるマーカーを表示させたマップの出来上がりです。ここで実際のものをご覧いただけます。(自分のサイトにry)最後までお付き合いいただき、ありがとうございました。Form7】メッセージの送信に失敗しました。後でまたお試しください。(32)PREVNEXTCONTACTホームページでの集客やWeb全般・スマートフォンアプリ制作などに関するご相談はお問い合わせフォームをご利用ください。ご相談いただいた後でも、弊社から営業などの売り込みを行うことは一切ありませんのでご安心ください。ご相談・お問い合わせはこちらお電話でのお問い合わせは、0952-20-1501平日10:00~18:00まで。セールス目的のお電話はご遠慮ください。