Google Maps APIのおさらい。
Webサイトで地図を表示するのに便利なGoogle マップ。Googleが提供しているGoogle Maps APIを使って、地図を設置する方法から、マーカーを置いたり、道のりを表示したり、地図の色を変えたりするためのコードをまとめました。※Google Maps APIの中でも、ここではGoogle Maps JavaScript API v3を使ったサンプルを掲載します。 以下は目次です。クリックするとその項目へ移動します。 Google マップを設置する。 いちばん簡単なGoogle マップ ジオコーディングなGoogle マップ Google マップの読み込み方 場所を示す。 マーカーを置く アイコンを置く 吹き出しを出す 道のりを表示する。 ポリラインで描画する Directions Serviceを利用する 見た目をカスタマイズする。 コントロールのカスタマイズ デザインのカス
Google AJAX Feed APIを使って、静的ページに外部ブログのRSSを取得・表示させるやつを私も試してみた
#2016.07.21追記 Google Feed APIの運用は、2016年9月29日に終了するとの公式発表がありました。今後はこの記事の情報は使えませんのでご了承ください。 参考：Google Developers Japan: Google Feed API 提供終了のお知らせ とある案件で、静的サイトの一部にWordPressを導入して、その新着情報を既存サイトのindex.htmlに表示させる、ということになりました。 そこで、Googleで公開されてるGoogle AJAX Feed APIを使ってRSSを取得する方法を試してみました。 1.APIキーを取得 まず前提として、Googleアカウントが必要です。 ここから利用できます。 http://code.google.com/intl/ja/apis/loader/signup.html ##2013.8.8追記 APIキー
Google Feed APIで3分マッシュアップ (1/2)
特定のテーマに関する情報を集めた、ポータル的なWebサイトを作りたい――。そんなとき、JavaScriptを使って、他のWebサイトのフィードから情報を得て、そのサイトの最新情報を表示できると便利です。 しかし、普通の方法ではできません。というのも、JavaScriptでフィードを読み込むのに使う「XMLHttpRequest」オブジェクトでは、セキュリティ上、異なるドメイン（クロスドメイン）とのやり取りが制限されているためです。そこで、「Google AJAX Feed API」を使いましょう。 Google AJAX Feed APIは、指定したフィードをGoogleのサーバー側で取得し、JSON（JavaScript Object Notation）と呼ばれるJavaScript専用のデータ形式に変換します。変換されたデータは、JSONP（JavaScript Object Nota
手軽になった！Google Maps API V3 (1/2)
Web上で地図を表示するツールの定番といえば「Googleマップ」。独自の地図を簡単に作れる「Google Maps API」を使って、会社案内のページに地図を埋め込んだり、地図と連動するネットサービスを運営している方も多いでしょう。 このGoogle Maps APIの新バージョン「Version 3」（以下V3と略）が5月27日に公開されました。今回は、V3を使って地図を表示する基本的な手順を紹介しましょう。 Google Maps API V3の主な変更点 Google Maps API V3では、以下の点が新しくなりました。 （1）API Keyが不要 V2まででは、Google Maps APIを使うためにはAPI Keyを取得する必要がありましたが、V3では不要になりました。 （2）iPhone／Androidへの対応 iPhoneやAndroidで地図を高速に表示できるように
サイトに外部ブログのRSSを表示する方法と、記事タイトルが長すぎる場合に省略表示する方法メモ。
今更ですが、Google Feed APIを利用してRSSを取得・表示する方法と、そのタイトルをCSSで省略表示させる方法を学びましたのでメモメモ。 みんなだいすきGoogle Feed API サイト制作の際、トップページなどに外部ブログのRSSを表示させたいときってありますよね。 私は過去にバンドの公式サイトを制作していた時、メンバーのブログRSSを表示させてくれとよく頼まれたものです。 （その時は無料RSSサービスを使っていました・・・） そんなときに役立つのがGoogle先生による『Google Feed API』。 表示件数や表示させたい内容、それを囲むタグなどわりと自由にカスタマイズできるので多くのWEB屋さんに愛されているようです。 何かいい方法はないか呟いたところ、多くの方からこちらを薦めていただきましたヾ(*´∀｀*)ﾉ ちなみに、以前はAPIキーを取得する必要があったよ
郵便番号での住所検索を、常に最新版で簡単にする方法。 | サイブリッジラボブログ
ぽこ太です。 会員登録をする際に郵便番号を打ち込むだけで住所まで出してくれる 便利なサイトがよくありますが。 しかし、郵便番号の更新は意外と多く たまに古い情報が出てしまっていることもあります。 郵便番号が更新される度に、 サイトの郵便番号データを更新するのも大変なので 今回は常に最新版の郵便番号での住所検索を行う方法を紹介します。 ajaxzip3 ajaxzip3はProject Hosting on Google Codeで公開されている 郵便番号検索APIです。 利用方法（設置するHTMLのcharsetがUTF-8の場合） ・ヘッダにajaxzip3を設置 <head> <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″> <title>サンプル</title> <script src=”http:
東京・大阪のホームページ・Web制作会社｜株式会社ジーピーオンライン
デザイナー必見！フォントが大好きなアートディレクターがおすすめするAdobe Fonts10選 第2弾！
RSSフィード指定するだけ！たった10分でアンテナサイトを作る方法
最近流行ってる（のかどうか分からないけど）アンテナサイトみたいなものを自分で作れんかなとここ数日試行錯誤してました。 普段ブログネタの収集にはもっぱらGoogleリーダーで用が足りてるんですが、どうせならウェブクラスタの皆さんのブログをまとめて人に見せれるようなものにならないかなぁ…とあちこち調べつつやってみたら、なんと出来ちゃいました。 JSファイル呼び出して使うようにしたので、同じようにRSSフィード利用してアンテナサイト作ってみたいと思ってる人は参考にしてみてください。 【2012/10/02追記】そぷさんがYahoo！Pipesを使ってアンテナサイトを作る方法を書いてくれました。 アンテナサイトは米Yahoo!のPipesを利用すると便利だよ | そぷログ こちらはGoogleAPIのようにRSSのキャッシュ利用ではないので即時性が高く記事更新のタイミングで順序入れ替わったりする不
infowindowのサイズ指定 - American Life in the Summertime
昨日のエントリに久しぶりにGoogle Maps API v3のことを書いたんで、あれこれ見てたんだけど… 英語のリファレンスと日本語のリファレンスに差異があるのね。 日本語のリファレンスには、infowindowにsizeというプロパティがあるのに、英語版じゃmaxWidthしかない。 …っつーか、そもそもこのサイズ関係のプロパティって、動作が意味不明。 どうやらみんな同じようなことを思ってるようで、Googleグループでも色々と議論されているようです。 it seems no matter what i use for maxWidth for the infowindow it's always at least 200px wide. This is a problem for mobile phone that have small screens. Is there a way
Google Maps 入門
Google マップはグーグルが提供している地図サービスです。この Google マップをカスタマイズして独自のマーカーを表示させたり、指定した区間のルート検索を行ったりすることができるように色々な API が提供されています。ここでは Google マップで提供されている API の中でもウェブサイトで利用者が操作可能な地図をカスタマイズして表示することができる Google Maps JavaScript API の使い方の解説します。 ※ Google マップを利用者として使う場合の使い方については「Googleマップの使い方」を参照されて下さい。 なお JavaScript の基本的な使い方については「JavaScript入門」を参照されてください。
Google Maps API V3 InfoWindowにHtml ビジネスマンの徹底パソコン奮闘サイト
2011-03-16： 目次を作成しました。 2010-09-17： Google Map 2 記事一覧を作成しました。 2010-07-03： Google Map 3 記事一覧を作成しました。 前回、InfoWindowの記事だったので、 ついでなので今回はそのInfoWindowにHtmlを表示してみます。 サンプルコードです。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Google Maps V3</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="http://maps.googl
Browse Fonts - Google Fonts
Making the web more beautiful, fast, and open through great typography
QRコードをGoogle Chart APIで作成して表示する方法 [ホームページ作成] All About
QRコードをGoogle Chart APIで作成して表示する方法Google Chart APIを使ったQRコードの簡単な作成方法を解説。Google提供のQRコード作成サービスなら、HTMLソースに記述した文字列からQRコード画像が動的に生成されるため、ウェブ上にQRコードを表示したい場合でも事前に画像ファイルを用意する手間が不要で簡単です。URLやメールアドレスだけでなく、日本語などの自由な文字列を含むQRコードの作り方をご紹介。 携帯端末向けにURLやメールアドレスなどを伝える用途として、図のようなQRコードがよく使われています。携帯端末で長いアドレスを入力するのは面倒ですから、QRコードをカメラにかざすだけで文字列を入力できる手軽さは便利です。「今閲覧中のURLを携帯端末に送る」という目的でウェブページ上に掲載しておくのも便利でしょう。 QRコードは、世界的に使われている2次元コ
![QRコードをGoogle Chart APIで作成して表示する方法 [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/a8bb9407ce84d63af48a3d180b7e70a6a18cba80/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F2%2F4%2F0%2F1%2F3%2F201610021223%2Ftopimg_original.png)
お手軽WordPress Tips：URLやサイズを指定出来るQRコードをショートコードで作れるようにする
ご質問頂いたのでついでに記事にします。 WordPressでURLとかサイズを指定出来る QRコードをショートコードで作成したい、 というもの。情報系のサイトだと、ユー ザーが携帯で閲覧したい事も多々ありそう なので割りと汎用性はあるんじゃないかな と思います。 というわけでショートコードでQRコードを作れるようにする方法です。APIが手軽なのでAPI使います。 普通にショートコード作る方法と変わりません。functions.phpに以下を追記します。 function add_qrcode_in_this_article($atts) { extract(shortcode_atts(array( 'url' => 'http://example.com', 'size' => '80', ), $atts)); return '<img src="http://api.qrserver
今どきのWebディレクターなら避けては通れないAPIの勘どころ : LINE Corporation ディレクターブログ
こんにちは。ライブドアのモリウチです。突然ですがWebディレクターのみなさん、「WebAPI」を使った企画や設計をしていますか？ APIとは「Application Programming Interface」の略で、特にWebAPIとはあるプログラムが、別のシステム (Webサービス) が持っているデータのCRUD (読み書き削除) や、一連の処理 (機能) の利用を可能にするための技術です。 WebAPIの活用の普及に貢献したのは2005年のGoogleMapのAPIでしょう。 WebAPIは、登場当初は地図情報や、都道府県やジャンルなどの静的な情報を取り出して利用することが主流でしたが、最近ではTwitterやFacebookのように利用ユーザーからの許可を受けてユーザーの個人データやソーシャルグラフを取り出して利用したり更新したりできるようなWebAPIが一般化してきました。そして
Google AJAX Feed API への登録 - Google AJAX Feed API - Google Code
Google AJAX Feed API を使うと、Javascript のみを使って公開されている Atom フィードや RSS フィードをダウンロードできます。1 つの Google API キーは、ウェブ サーバー上の 1 つのディレクトリとその中のすべてのサブディレクトリに対して有効です。たとえば、URL http://www.mysite.com/mydir を登録すると、http://www.mysite.com/mydir/ ディレクトリ内のすべての URL で使用できるキーが作成されます。詳しくはAPI のドキュメントをご覧ください。Google API キーを取得するには Google アカウントが必要です。取得した API キーは、この Google アカウントと直接関連付けられます。複数のウェブサイトをお持ちの場合は、アカウントで複数の API キーを生成できます。
JavascriptのみでRSSを表示するGoogle AJAX Feed API｜ぞえぞえねっと
RSSを表示する時にCGIやPHPだと導入できるパターンが多く、動かないサーバだと問題があったりします。 JavascriptのみでRSSを表示する「Google AJAX Feed API」というのがあり、これだと、どのサーバでも動作します。 Google AJAX Feed API への登録 Google AJAX Feed API への登録ページに行きます。 利用規約を読んだ上でこれに同意しますにチェックをします。 使用するウェブサイトの URLにURLを記入します。 APIキーを生成ボタンを押します。 生成されたキーが表示されます。 ぞえぞえねっとを登録した場合、下記のコードでした。 ABQIAAAA7_2e7OzfQnVgCZgpBhg3_RRuFDZRL6kVjV5uEtK0eNiWSesqyRQLz2Yqzy4YWkbEdJbTDPQHNS4Itg サンプルコードも記載されて
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
YouTube プレーヤーのデモ | YouTube IFrame Player API | Google for Developers
http://masablog.me/?p=95
Google Maps のパラメータ