mynameisdonald.com is for sale Please prove you're not a robot
どうもです、はやちです(◞‸◟) いきなりですがみなさん、せっかくデザインされたWebサイトの中にデフォルトのGoogleマップがあるとなんだかもったいなく感じませんか?(◞‸◟) どーにかこれをうまくデザインできないだろうか(◞‸◟) ということで、今回は簡単にGoogleマップのデザインをカスタマイズできる方法をご紹介したいと思います٩( ᐛ )و Googleマップを表示させよう まずはじめに基本から。Googleマップを設置しましょう( ˘ω˘)☝ Googleマップの設置 <script src="http://maps.google.com/maps/api/js?key=ここにAPIキーを入れます&language=ja"> </script> headerタグAPIを取得するスクリプトをつけます。 APIの取得はこちらをご参照ください <div id="js-map-tae
Webサイトで地図を表示するのに便利なGoogle マップ。Googleが提供しているGoogle Maps APIを使って、地図を設置する方法から、マーカーを置いたり、道のりを表示したり、地図の色を変えたりするためのコードをまとめました。※Google Maps APIの中でも、ここではGoogle Maps JavaScript API v3を使ったサンプルを掲載します。 以下は目次です。クリックするとその項目へ移動します。 Google マップを設置する。 いちばん簡単なGoogle マップ ジオコーディングなGoogle マップ Google マップの読み込み方 場所を示す。 マーカーを置く アイコンを置く 吹き出しを出す 道のりを表示する。 ポリラインで描画する Directions Serviceを利用する 見た目をカスタマイズする。 コントロールのカスタマイズ デザインのカス
Google MapのデザインをjQueryで変更する為のメモ書き。Google Map APIとjQueryでGoogle Mapの色合いを変更し、オリジナルのマーカーを付けてみます。こうする事で、既存デザインに合わせたGoogle Mapが出来ます。 今後必要になりそうだったので調べ物をしたついでにメモ書きです。デザインを変更、というと語弊がありますけど、好みの色に変えてみます。 ゴール↓ こんな感じのをjQueryでやろう、みたいな内容です。特に目新しい情報では無いですが。 なんかシャドウ変になっちゃった・・色やマーカーだけでもWebサイトで使用している色にあわせれば地図だけ浮いてしまうような事も無くなるんじゃないかなと思います。 ジオコーディングリクエスト<script type='text/javascript' src='http://ajax.googleapis.com/a
Webから利用できる地図としてすっかりおなじみの「Googleマップ」には、目的地の場所を知るだけにとどまらない、便利な機能がたくさん揃っています。今回は、出かける前にぜひチェックしておきたい「Googleマップの便利な使い方」を集めてみました。 ■出かける準備はこれでばっちり?Googleマップの便利な使い方 “自分だけの地図”の作成やルート検索、時刻表のチェックまで、Googleマップには旅行や仕事で出かける際に役立つ機能が満載です。 <自分だけの地図を作れる「マイマップ」> ▽Google Japan Blog: Google マップを使って地図が簡単に作れるようになりました。 Googleマップ上の好きな位置に目印のアイコンを付け、自分だけの地図を作ることができるのが「マイマップ」の機能。旅行での行き先をあらかじめ地図にしたり、また作った地図は他の人とも共有することができるので、集
Ajaxで動作するGoogleマップなどを画像として保存し、紙に印刷して持ち運ぶ……という作業を行っている人にオススメなのが「Map Grabber」。自動操作によって、複数画面に渡る超巨大範囲を撮影しまくり、自動で一枚の画像に結合してくれるぞ。 地図サイトの画面を印刷して持ち歩く場合、通常は、フルスクリーンサイズ以上の画面を撮影することができない。「細部が分からない倍率にして広い範囲を撮影すべきか、もしくは範囲が狭くなっても細部まで見える倍率にするべきか……」と悩んでしまう。「Map Grabber」は、ブラウザを自動操作でスクロールすることにより、地図画像を複数画面分撮影しまくり、撮影した画像を自動で一つに繋ぎ合わせてくれるツールだ。……「巨大画像を作ったところで、印刷したら細部が潰れるから意味ないんじゃ?」と思うかもしれないが、PC画面と紙は、解像度が全く違う。例えば3000*240
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く