GMAP STYLR is a web app where you can customize the colors of Google maps on the fly.
Chrome Experiments is a showcase of work by coders who are pushing the boundaries of web technology, creating beautiful, unique web experiences. You'll find helpful links throughout the site for creating your own experiments, and you can also explore resources like WebGL Globe and our workshop of tools.
Google Maps API Styled Map Wizardでできること 店舗の場所などを掲載するときに Google Map APIを利用されることもあると思います Google Maps(グーグルマップ)はとても便利なんですが サイトのデザインとGoogle Mapが合わないんだよね って思う人も多いでしょう そこで「Google Maps API Styled Map Wizard」を利用して 簡単にGoogle Mapのデザインを変更する方法を紹介します ご紹介ありがとうございます バシャログ。さま アクセスが急に増えてびっくりしてます! 目次 Google Maps API Styled Map Wizardでできること Google Maps API Styled Map Wizardの使い方 Google Maps API Styled Map Wizard設定項目一覧
◆Google Maps JavaScript API V3 ブログ目次 Google Maps API v3とは? 本ブログは判らないところをコツコツ積み重ねました。あくまでご参考にされて下さい。Google Maps APIを扱うことは決して難しいことではないと思います。Google Maps JavaScript API V3のページからスタートするといいと思います。 ※V2は、2013年11月以降は使用できなくなります。 いきなりサンプル集(example)地図を見るならコチラ Google Maps API Google Maps APIサービスがサポートする国・都市の一覧表 初期設定 Google Maps API V3の地図(マップ)をPC、スマートフォンで見れるように表示させるscriptとメタタグの設定 地図に表示する。 ナビゲーションコントロール、マップタイプコントロー
Google Maps APIを使用することで、単にWebページ上に地図を表示するだけでなくマーカーを設置したり地図上でクリックされた時に独自の処理を行ったりといったことが可能になります。これらの機能を実現するために独自のスクリプトを追加していくことになるのですが、あまりWebページに長文のスクリプトを記述すると可読性が悪くなる場合があります。そこでこのページではスクリプトを外部ファイルに分けて記述す方法について解説します。 1.スクリプトを外部ファイルとして用意する 2.サンプルコード スクリプトを外部ファイルとして用意する 前のページで作成した次のHTMLページを例に試してみます。今回外部ファイルとして分離するのは次の部分です。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>Google Ma
Google マップはグーグルが提供している地図サービスです。この Google マップをカスタマイズして独自のマーカーを表示させたり、指定した区間のルート検索を行ったりすることができるように色々な API が提供されています。ここでは Google マップで提供されている API の中でもウェブサイトで利用者が操作可能な地図をカスタマイズして表示することができる Google Maps JavaScript API の使い方の解説します。 ※ Google マップを利用者として使う場合の使い方については「Googleマップの使い方」を参照されて下さい。 なお JavaScript の基本的な使い方については「JavaScript入門」を参照されてください。
今月発売予定の「メタルギアライジング」をそわそわ楽しみにしているアクションゲー好き seki です。 今回もWebサービスのご紹介です! 最近よくよく見かける、「Google map」のデザインをお洒落にカスタマイズして載せているサイト。皆さんも一度は目にしたことがあるかと思いますが、こちら、どうやって作っているか気になりますよね。 今回は、js無知な私でも簡単に作れる Google Maps API 「Styled Map Wizard」の使い方を、ざっくりと例を挙げてご紹介します。 【参考サイト】 今回はこちらの記事より、参考・引用して解説します。こちら、とても丁寧に解説されているので、jsが分らなくても出来るかと。 今回作成したもの 画像ですみませんがこちら。 アイコンは seki になっていますが場所はバシャログ。本陣です。 色をモノクロにして、交差点やコンビニ、銀行などのアイコン
フィードバックを送信 概要 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 Maps JavaScript API を使用すると、独自のコンテンツと画像を使って地図をカスタマイズして、ウェブページおよびモバイル デバイスに表示できます。Maps JavaScript API で提供されている 4 つの基本地図タイプ(道路地図、衛星、ハイブリッド、地形)に、レイヤとスタイル、コントロールとイベント、さまざまなサービスとライブラリを使用して変更を加えることができます。 対象読者 このドキュメントは、JavaScript のプログラミングとオブジェクト指向プログラミングの概念を理解しているデベロッパーを対象にしています。また、ユーザーの視点で マップを使い慣れていることも必要です。ウェブ上に多数ある JavaScript チュートリアルも参考にしてください。 こ
サイト制作において、アクセスマップなどの地図の表示はどうしてますか?「Google Maps API」を利用したり、ちょっとデザインにこだわりたい時にはイラストに描き起こしたりしてるんじゃないでしょうか。 今回は、Google マップをちょいとカスタマイズすれば、まるでイラストマップみたいに見せることができるんだぜ!というお話です。 記事中に出てくる画像は2012.3現在のもののため、現在のGoogle Maps APIでの表示とは異なりますので注意です…X(。 リンク切れしていたところを、なるべく近い内容の存在するページにリンクし直しました(2015.7.20追記)。 まずはしっかり抑えておきたい「Google Maps APIの基本」から。 基本をすっ飛ばして早速カスタマイズしたい方はこちら↓。 Google Maps APIの基本 Google マップはGoogle API キーを発
どうもです、はやちです(◞‸◟) いきなりですがみなさん、せっかくデザインされた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
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く