Hatena Blog Tags
はてなブログ トップ
Google Maps API
このタグでブログを書く
言葉の解説
ネットで話題
関連ブログ

Google Maps API

(ウェブ)
【ぐーぐるまっぷすえーぴーあい】

Googleが公開している、Google Mapsシステムから地図情報を直接取得するためのツール。
2005年6月30日、無料ベータ版公開開始。
2005年7月7日にはてなが開始した「はてなマップ」のサービスも、このAPIを利用している。

このタグの解説についてこの解説文は、すでに終了したサービス「はてなキーワード」内で有志のユーザーが作成・編集した内容に基づいています。その正確性や網羅性をはてなが保証するものではありません。問題のある記述を発見した場合には、お問い合わせフォームよりご連絡ください。
学生向けプログラミング入門 | 無料•2ヶ月前

Ruby on Rails | Autocompleteとgeocoderの利用

↓↓クリックして頂けると励みになります。ランキング参加中プログラミング Rails 6を使用してGoogleの自動補完（Autocomplete）を実装するには、以下のステップに従うことができます。 Googleの自動補完は、通常、Google Places APIを使用して実装されます。 まずはGoogle Cloud PlatformにGoogleアカウントでログインしてAPIキーを取得してください。 手順は以下の通りにお願いします。 mrradiology.hatenablog.jp GemFileに以下のgemを追加します。 gem 'geocoder', '~> 1.8', '>= …

#Ruby on Rails#Google Maps API

ネットで話題

もっと見る
979ブックマークGeekなぺーじ : Google MAPS APIプログラミングここでは、Google Maps JavaScript API(version 3)を使って遊ぶ方法を説明したいと思います。 Google Maps JavaScript APIを使うと、グーグル社が提供する衛星写真や地図を使ってホームページ上で色々なものを作れます。 対象とする読者は初心者もしくは入門者です。 Google Maps APIはJavaScriptを使って書いてあるので...www.geekpage.jp
905ブックマークGoogle Maps API無償版のポリシー変更、猶予期間が10月12日で終了、地図が突然表示されなくなる可能性も　internet.watch.impress.co.jp
705ブックマーク本当はすごい、知られざるGoogle Maps APIたち!!atmarkit.itmedia.co.jp
580ブックマークGoogleマップAPIの使い方を分かりやすく解説！ - Google Maps 活用講座ホームページに無料地図サービス！　Googleマップの設置方法からカスタマイズまで、分かりやすく解説！Google Maps【グーグル マップ】 米国Google社が提供する無料地図サービスのこと。 Ajax呼ばれる技術を利用して、ブラウザ上でオンライン地図を実現できるサービス。 オンライン登録を行えば、無料で使うことができる...googlemaps.googlermania.com
527ブックマークGoogle Maps API有料化の詳細発表、該当ユーザーは2012年初めに強制課金開始　internet.watch.impress.co.jp
391ブックマークGoogle maps簡単作成ツール：GMapCreator (v2 API 対応版)Google MAPS APIを使ったプログラムを簡単に作るツールを作ってみました。 目標はJavascriptなどが全くわからない人でも簡単にGoogle mapをブログやホームページに貼り付けられる事です。 左クリックでマーカを設置、もしくは開始位置を設定できます。 マーカを左クリックすればマーカ画像を変更したり、マーカをクリッ...www.geekpage.jp
369ブックマークGoogle Maps APIで50万以上使っていた話 - Qiitaqiita.com
367ブックマークGoogle Maps JavaScript APIの使い方まとめlab.syncer.jp
315ブックマークGoogle Maps API を使って、地図のカラーバリエーションを楽しもう。japan.googleblog.com

関連ブログ

Arale•2年前

Google Map をJavaScriptで表示しよう

お店の位置情報を埋め込みで表示させたい 現在、作成しているオリジナルアプリケーションは店舗情報を必要としています。 来店されるお客様にも文字列だけの情報だけでなく、 マップを表示してより具体的な情報を提供したいです。 Googleの仕様変更により、ここ数年はクレジットカードの登録も必須となったみたいです。 昔はAPIキーすらいらない記事を拝見しましたが、10数年前の話なのであてになりません。 API取得、キー制約を設定、カード登録、ドメイン指定、コードを記述 上記の必要な情報を登録し、APIキーもコピーしました。 ところが、どんだけ記述してもポッカリと空白が発生する。 もしくは、空白すら領域に…

#Google Maps API#JavaScript#プログラミング#未経験からエンジニア
素肌にサスペンダー•2年前

【Google Maps API】Webサイトに埋め込んだ地図をモノクロにしてsvgのオリジナルマーカーを適用する方法

Webサイトに埋め込んだGoogleMapをデフォルトのデザインじゃなくて、そのサイト用にカスタマイズしたい場合がある。 Google Maps APIを使ってできるけど、オプションやらたくさんあって出来ることが多い。 developers.google.com 今回は、以下の簡単なカスタマイズを行う方法をメモしておく。 要件 モノクロ（グレースケール） svg画像でマーカーを設定する。 前提 Google Maps APIキーの取得はしてある。 サンプル <!DOCTYPE html> <html lang="ja"> <head> <meta http-equiv="Content-Typ…

#Google Maps API#JavaScript
ものづくりのブログ•3年前

Google Maps APIをつかってみる

Google Maps API を利用して指定した拠点の距離を算出してみました。 Google Maps Platformに登録 Google Maps API キーの取得 プロジェクトの作成 APIの有効化 APIキーの作成 プログラム Google Maps Platformに登録 毎月200 USドル分（Javascript API の場合 月28000ロード相当）は無料で使用することができるみたいです。 cloud.google.com Google Maps API キーの取得 Google Maps API を利用するには、API キーを取得する必要があります。 プロジェクトの作成…

#Google Maps API
あおいろブログ•3年前

WMS の地図画像を Google Map 上に表示する

この記事は ケーシーエスキャロット Advent Calendar の記事です。 WMS とは、地図画像配信方式の一つです。 表示したい地図範囲を指定すると、その範囲を切り取った画像が返ってくるという方式でデータの配信を行います。 地理院地図｜地理院タイルについて これを Google Map 上に表示してみよう、というのが今回の内容です。 WMS の API 仕様 今回利用しようと思っているWMSのAPIは、大体以下のような仕様とします。 範囲指定： 左下（南西）と右上（北東）の緯度経度を指定（世界測地系） サイズ指定： px単位 Google Map 上に画像を表示する方法 まず Goog…

#JavaScript#Google Maps API
tech-kazu’s blog•1ヶ月前

駆け出しエンジニアが知っておくべきWeb技術の基本用語

はじめに この記事では、これからエンジニアになる人、なりたいと思っている人が、仕事を始めてから困らないように、今のうちに知っておくべき代表的なWeb技術の基本用語をいくつかご紹介します。 駆け出しエンジニアが知っておくべきWeb技術の基本用語とは アプリケーション アプリケーションソフトウェアの略称で、一般的にアプリとかソフトとか言われてイメージするようなもの。主に以下のような種類に分けられる。 Webアプリケーション ブラウザの中で動いてインターネットを介して利用するもの。 デスクトップアプリケーション WordやExcelなどパソコン上でインストールして利用するもの。Webアプリケーション…

OPTiM TECH BLOG•1ヶ月前

Vue2系からVue3系への移行における苦労話

はじめまして この記事について 移行前の環境 移行の流れ Vue 3.3 移行について 破壊的変更の対応について 1. v-model v-bind.syncについて 2. v-on.native 修飾子の削除について 3. vue-i18n 8.x → 9.x の破壊的変更対応 移行時の苦労 担当者曰く Vuetify2 から Vuetify3への移行について 全体的な変更 移行時、移行後の苦労 移行後の環境 移行後の使用感 最後に はじめまして サービス開発統括本部 ソリューション開発部で農業プロダクトの開発を担当している西村です。初めてのTECH BLOGです。 私は現在、ピンポイントタ…

ts0818のブログ•1ヶ月前

Web上で高速に描画するアーキテクチャを知りたいんだが...

gigazine.net ⇧ よくぞ調べましたな。 何て言うか、普通だったら、国が主導で作って然るべきのような気もしますが、どうしようもない国ですな... Web上で高速に描画するアーキテクチャを知りたいんだが... 地理空間情報というものを知って、Web上でオブジェクトを表示したいってなった時に、 blog.esrij.com またここで注意していただきたいのは、たとえ 1,000～2,000 ポイントであればパフォーマンスに影響なく描画できるとしても、それは決して推奨される地図データの描画方法ではないという点です。冒頭でも紹介したように、グラフィックによる地図データの描画は、ユーザのアクシ…

Roll With IT•2ヶ月前

アウトドア般若心経が楽しめるWebアプリをリリースしました

はじめに サービス URL GitHub リポジトリ 対象読者 自己紹介 アウトドア般若心経とは ポケモンGO の般若心経バージョン サービス開発のきっかけ サービスの概要 使い方 1. Google アカウントでログイン 2. 般若心経の全文を一覧で管理 3. 写経した写真を取り込む 4. 取り込んだ写真をトリミング 5. 写真の登録 6. 保存した内容の確認 7. メモの登録 8. 全体地図の確認 9. マイページ 技術スタック 技術選定の理由 アーキテクチャ ディレクトリ構成 開発方針とこだわり Getting Real UI / UX レスポンシブデザイン パフォーマンス ロゴ 機能面…

Roll With IT•2ヶ月前

CI 環境構築で直面した E2E テスト自動化の壁 〜Google の bot 対策による脅威のディフェンス力〜

はじめに Next.js と Rails を使ってオリジナルの Web アプリを開発しています。 github.com Playwright を導入し E2E テストの実装は問題なくできましたが、その後 CI でのテストの自動化がうまくいかず数日ハマってしまいました。今回の記事ではその原因と結果についてまとめています。 Playwright 導入については以下記事にまとめています。 shirotamaki.hatenablog.com CI 環境構築 ローカル環境下でパスした E2E テストの自動化に取り組みました。 GitHub Actions に yml ファイルを用意し自動化のためのワー…

SOE_ironyのブログ•3ヶ月前

"OSINT"について今更学んでみた。

OSINTとは OSINTの手法 OSINTの実現方法 ツール利用例 ツール開発例 OSINTの注意点 まとめ 参考 OSINTとは みなさん"OSINT"とは何かご存知でしょうか？これはOpen Source Intelligenceの略で、オープンソース、つまり世間一般に公開されている、誰でも知ることのできる情報を利用した、情報収集・分析の手法のことです。 いわゆるスパイ活動などのようなことでも、重宝されてきており、違法行為やグレーゾーンとなることを行わないため、個人でも簡単に始められるものとなります。 近年は、デジタル技術の進化もありオープンソースな情報を取得するのが非常に容易となってき…

Roll With IT•7ヶ月前

ブラウザへ環境変数を公開したい時は`NEXT_PUBLIC_`を忘れずに！

Next.jsでは、環境変数名の前にプレフィックスNEXT_PUBLIC_を付けないとブラウザ側に公開されません。 By default environment variables are only available in the Node.js environment, meaning they won't be exposed to the browser. In order to expose a variable to the browser you have to prefix the variable with NEXT_PUBLIC_. For example: NEXT_PU…

スペースがもったいない•8ヶ月前

GMAPS2GPX Chrome拡張機能でGoogleマップのルートをGPXファイルにエクスポートしてサイコンで読み込む

GoogleマップのルートをGPXファイルにエクスポートする（2022年〜） Maps to GPX Converterが寄付を募られています 以前、こういう記事を書きました。 agyay.hatenablog.com GoogleマップのルートをGPXに変換するにはMaps to GPX Converterを使っていました。 mapstogpx.com とても使いやすいサービスです。しかし、最近どこかの大きな会社がこのサービスを自動で呼び出し始め、そのせいで数千ドル（Google Maps APIの課金だと思われます）を払う羽目になってしまったそうです。すでに問題の会社のIPアドレスはブロッ…

kojiro-uedaのブログ•8ヶ月前

地図上の「指定した地点から n km以内にある何か」を検索する機能を作ってみた

なんのことだかわからないと思われる方もいらっしゃると思いますので、以下のリンクを張っておきます。試してみてください。 （ドメインも、SSLも面倒でまだやっておりません・・・。） http://152.69.199.50/ リポジトリはこちらです。 こちらの記事は、作ったときにやったことやハマったことの覚え書きです。 モチベーション 家探しアプリで地図の中心から n km 以内にある物件を探す、みたいな機能がありますよね。あの機能ってどうやって高速に検索してるんだろうなーと思ったわけです。Elasticsearchの使い方も少しずつわかってきたし、それを使ったアプリを作ってみたいというのもありま…

プログラマブル深海魚•8ヶ月前

Google Mapをページに埋め込む

WebページにGoogle Mapを表示してみたかったので、実際にやってみました。 Google Mapを表示するには、Maps JavaScript APIを利用します。 Maps JavaScript APIはGoogle Cloud Platformを構成するAPIの1つなので、まずはGoogle Cloud Platformで必要な準備をしてから実際にコードを書いていきます。 目次 プロジェクトを作成する 請求先アカウントの作成 APIキーを作成する 実際に埋め込んでみる 初期の中心点・倍率を指定する マーカーを表示する マーカーの位置を取得する おわり 参考文献 プロジェクトを作成す…

スプレッドシート使い方ブログ•9ヶ月前

他のアプリケーションとのデータ連携方法

他のアプリケーションとのデータ連携方法 スプレッドシートには、他のアプリケーションとデータを連携させる機能があります。以下に、いくつかの代表的な連携方法を紹介します。 1. Google フォームとの連携 Google フォームは、アンケートや申込フォームなどを作成することができるツールです。スプレッドシートと連携することで、フォーム入力内容を自動的にスプレッドシートに反映させることができます。入力内容から自動的に集計したり、通知を設定したりすることで、効率的なデータ管理が可能です。 2. Zapier との連携 Zapierは、複数のWebアプリを連携させることができるツールです。スプレッド…

technikki•9ヶ月前

ふるさと納税のwebサービス案出し

はじめに ふるさと納税の何かしらのWebサービスを作りたい。 自分は田舎の出身だが、自治体はふるさと納税で結構な額を稼いでるらしい。 逆に言えば、国民全体の納税額は変わらないのだから、ふるさと納税弱者の自治体もいるはず。 なんかこう。楽天とか有名どころで人気のある商品だから買うとかではなく。 自治体を応援したいとか、そんな気持ちになりやすいWebサービスを作りたいと思って。 ふるさと納税は実質負担額が少ないし、やった分得だよね、という感じなので相性はいいはず。 ざっくりと、新たな魅力を発見できるようなサービスにしたい。 案出し 旅行先や散歩で気付けるようにする リアルな体験と結びつける ふるさ…

Sochi419のブログ•9ヶ月前

rails基本操作まとめ

rails基本操作まとめ プログラミング初学者の私が、初学者目線でrailsの基本操作についてまとめました。 ページを作成 rails generate controller welcome index welcomeという名前のページが作成された。 作成ページをトップページにする config/routes.rbに、root 'welcome#index'を記述する Rails.application.routes.draw do get 'welcome/index' resources :articles root 'welcome#index' # For details on the…

yaginuuun blog•10ヶ月前

週報 2023/02/05 ~ 2023/02/11

週報を始めて約1ヶ月が経過した。軽くでも定期的に振り返りの機会を持つことは有用だし、オープンにすることで継続する圧力が多少なりともかかるのでこれまでのところはまっているように思う。また、こういうものは後々振り返った時にまた威力を発揮するものだと思うので、それを実感する日を楽しみにまた続けていこうと思う。 Input Books システム運用アンチパターン Chap7~11 プロセスの改善の話や情報の溜め込み（ドキュメンテーション）の話が特に自分には刺さった。実際身につまされる内容もあった。 来週には読み終わるかな エラスティックリーダーシップ Chap4~7 サバイバルモードからいかにして学習…

Hello Android Studio ！•1年前

ちょっと考えてみた19

UIについてのAndroidの知識は無限にありますので、それについては適時調べていったほうがよさそうです。 今後本筋に戻りたいと思います。改めて、このブログの本筋ですが、 ①To do Listアプリの仕組みを理解し、そういうアプリを自分で作成する ②APIを使えるようにして、返ってくるJSON形式データを処理する。特に、Google Maps APIを使う。 ③歩数計の仕組みを理解し、そういうアプリを自分で作成する ④AR（拡張現実）アプリの仕組みを理解し、そういうアプリを自分で作成する こととします。