タグ

mapに関するhideharaのブックマーク (14)

  • MarkerClustererを使ってカテゴリ分けする - Google Maps 活用講座

    説明 MarkerClusterer ライブラリを使うと大量のマーカーを簡単にコントロールすることができます。 このページでは、マーカーをカテゴリ分けして、さらにMarkerClustererを使う方法を紹介します。 マーカーのカテゴリ分け 最初にマーカーをカテゴリ分けします。コードの中では、次のようにしています。 var markers = {}; for(...) { category = data.category; var marker = createMarker({ position : latLng, title : data.title, icon : categoryIcons[data.category], description : data.description }); markers[category].push(marker); } マーカークラスターの作成

    hidehara
    hidehara 2016/04/08
    Google の JS向けライブラリ MarkerClusterer の利用説明
  • Marker Clustering  |  Maps JavaScript API  |  Google for Developers

    Send feedback Marker Clustering Stay organized with collections Save and categorize content based on your preferences. Overview This tutorial shows you how to use marker clusters to display a large number of markers on a map. You can use the @googlemaps/markerclusterer library in combination with the Maps JavaScript API to combine markers of close proximity into clusters, and simplify the display

    Marker Clustering  |  Maps JavaScript API  |  Google for Developers
    hidehara
    hidehara 2016/04/08
    地図上のマーカーを集約する手法など。いろんな方法がある。Googleから関連ライブラリも2つでてる。
  • Googleマップをイラストマップみたいにしたい。

    サイト制作において、アクセスマップなどの地図の表示はどうしてますか?「Google Maps API」を利用したり、ちょっとデザインにこだわりたい時にはイラストに描き起こしたりしてるんじゃないでしょうか。 今回は、Google マップをちょいとカスタマイズすれば、まるでイラストマップみたいに見せることができるんだぜ!というお話です。 記事中に出てくる画像は2012.3現在のもののため、現在のGoogle Maps APIでの表示とは異なりますので注意です…X(。 リンク切れしていたところを、なるべく近い内容の存在するページにリンクし直しました(2015.7.20追記)。 まずはしっかり抑えておきたい「Google Maps APIの基」から。 基をすっ飛ばして早速カスタマイズしたい方はこちら↓。 Google Maps APIの基 Google マップはGoogle API キーを発

    Googleマップをイラストマップみたいにしたい。
    hidehara
    hidehara 2016/04/07
    おぉぉー、このサイトの情報量はすごい。カスタムしたい時の情報が山盛り1ページにまとめられてて便利。
  • マップタイプを設定する | Google Maps JavaScript API入門

    Google Maps APIでは複数のマップタイプが標準で用意されています。ここでは地図を表示する時に使用するマップタイプを設定する方法について解説します。 1.地図の作成時にマップタイプを設定する 2.後からマップタイプを設定する 3.サンプルコード 地図の作成時にマップタイプを設定する 地図でマップタイプを設定する方法は2つあります。地図を作成時に指定する方法と、作成後に別のマップタイプを設定する方法です。地図を作成する時にマップタイプを指定するには、中心座標やズームレベルと同じようにマップタイプを表すmapTypeIdプロパティに値を設定します。 設定できる値はgoogle.maps.MapTypeIdクラスで定義されており、次の4つの中から1つ指定します。 ROADMAP 道路や建物などが表示される地図です SATELLITE 衛星写真を使った地図です HYBRID ROADMA

    hidehara
    hidehara 2016/04/07
    マップタイプは 4つ
  • Google Maps APIでマーカをクリックしたときに、個別の内容のInfoWindowを表示したい。 - Qiita

    Google Maps APIでマーカをクリックしたときに、個別の内容のInfoWindowを表示したい。JavaScriptGoogleMapsAPI クロージャを利用する事で目的の動作を行えるみたい。 まずクロージャが何者かを知る必要があり、以下のサイトがすごいわかりやすかった。 https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Closures Googleのドキュメントを読み解く。 Googleのデベロッパーサイトに、ソースコード付きで記載があった。これも、読んでいてすごいわかりやすかった。 https://developers.google.com/maps/documentation/javascript/events?hl=ja#EventClosures せっかくなので 自作のサンプルコード(抜粋 & 簡略

    Google Maps APIでマーカをクリックしたときに、個別の内容のInfoWindowを表示したい。 - Qiita
  • PythonでGeocodingする。

    PythonGooglemaps APIを使ってgeocodingする場合、googlemaps 1.0.2なるmoduleがあります。 これを使えば、簡単に geocoding や reverse geocodingができるようになるようですが、API V3では動きません。V2のKeyがないとだめなようです。 しかし、V2 API Keyはもはやsupportされていません。 そこで、色々と探してみて、Googlemaps API V3が使えるmoduleを見つけました。 それは、pygeocoder 1.2.1です。当に、先人に感謝します。 ちょっと、pygeocoder 1.2.1使ってみたので、書き留めておきます。

    hidehara
    hidehara 2016/04/01
    pygeocoder 簡単につかえていいなぁ
  • MapBoxで自作スタイルを作るとき最初に読むページ - Sanwa Systems Tech Blog

    こんにちはでらぽんです。 最近、休日にMapBoxという地図サービスをいじっています。MapBoxの特徴はいくつかありますが、その一つに地図デザインのカスタマイズができることです。地図サービスといえばGoogleMapが有名ですがスタイルのカスタマイズはできません。今回はそんなMapBoxで地図を作ってみる記事です。 基機能でこのような地図を作成することがきます。GoogleMapにとても似ています。サイトに埋め込む事も可能です。 アカウント MapBoxのサイトでアカウントを作成します。これが無くてははじまりません。無料プランと有料プランがありますが、無料プランでスタイルのカスタマイズと全APIは使用でき、50,000View/月 まで使用できるため、まずは無料プランで充分かと思います。(2015/09現在) MapBoxのページ https://www.mapbox.com 地図の表

    MapBoxで自作スタイルを作るとき最初に読むページ - Sanwa Systems Tech Blog
    hidehara
    hidehara 2016/03/31
    MapBoxというサービスもあるのか。地図のカスタマイズも容易そうでいいかも。
  • Google Maps APIをコピペで使い倒せ!Web初心者でもカスタマイズできるgmaps.js | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは。エンジニアののびすけです。 最近はひさしぶりに浅草をランニングして健康オタクを気取っています。 さて、ランニングといえば、アプリを使ってタイム測定をしている人も多いのではないでしょうか。大半のアプリには地図が内蔵してあり、特にGoogle Mapsを呼び出しているものが多いですね。 そこで今回は、そのGoogle Mapsをカンタンに導入できるgmaps.jsを使ってみたいと思います。コピペで試せるので、JavaScriptが得意ではないデザイナーやコーダーの方にもおすすめです。 http://hpneo.github.io/gmaps/ gmaps.jsはGoogle Maps APIを使いやすくしてくれるライブラリです。 そのメリットは大きく3つあります。 1. シンプルなコード 記述方法がとてもカンタンで、通常のGoogle Maps APIよりも分かりやすいソースコード

    Google Maps APIをコピペで使い倒せ!Web初心者でもカスタマイズできるgmaps.js | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
    hidehara
    hidehara 2016/03/31
    GoogleMapsAPIを使いやすくしてくれる gmaps.js 。
  • GISプラットフォーム「ArcGIS」 | ESRIジャパン

    ArcGIS 主要製品 ArcGIS とは ArcGIS OnlineSaaS マッピング プラットフォーム ArcGIS Pro次世代デスクトップ GIS ArcGIS EnterpriseGIS とマッピングの基盤システム ArcGIS Platform位置情報サービス構築を支援する PaaS ArcGIS Developers独自アプリの開発 ArcGIS 特化型製品 ArcGIS Business Analystスマートな意思決定のためのマーケット インテリジェンス ArcGIS Hubコミュニティの関係構築とコラボレーション ArcGIS Urban都市開発プロジェクトのための 3D GIS ロケーション アナリティクス ArcGIS Insightsセルフサービスの位置情報分析 ArcGIS for ExcelExcel で位置情報を活用 ArcGIS for Power BI

    hidehara
    hidehara 2016/03/31
    地図特化型のサービス。バッチで住所の一括Geocodeなどができるみたい
  • 初めて地図周りの技術に触れた時に作ったまとめ資料 - Qiita

    関連して以下も参考にしてください GoogleMapのオープンソース版地図アプリ(OSRM)のインストール - Qiita 住所(市区町村番地)から緯度経度を取得する - Qiita まとめたこと やりたい事ベースでざっくり分類 住所(地名) ⇔ 緯度/経度変換 地図上への位置情報のプロット 距離計算・ルーティング(緯度経度計算、2点間の距離を計測) 詳しく 住所(地名) ⇔ 緯度/経度変換 住所(地名)→緯度/経度の変換はジオコーディング(Geocoding)と呼ばれる。 (昔はアドレスマッチングとも呼ばれていたらしい) 緯度/経度→住所(地名)の変換は逆ジオコーディング(Reverse Geocoding)やアドレスマッチングと呼ばれる。 緯度はlatitude(lat)、経度はlongitude(lng)で各Web/APIドキュメントをみるとよく出てくる。 住所はaddressとかl

    初めて地図周りの技術に触れた時に作ったまとめ資料 - Qiita
    hidehara
    hidehara 2016/03/28
    Google, Y! の他 OSM (OpenStreetMap) にも触れられている
  • Geocoding API の使用量と請求額  |  Google for Developers

    フィードバックを送信 Geocoding API の使用量と請求額 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 Geocoding API は従量課金制の料金モデルを使用します。Geocoding API リクエストは、Geocoding の SKU を使用して課金されます。1 日の割り当ては、太平洋時間の午前 0 時に毎日更新されます。Google の総合的な利用規約に加えて、Geocoding API に固有の使用量上限が存在します。Google Cloud コンソールには、使用料金を管理するためのツールが用意されています。 Geocoding API の課金方法 Geocoding API は従量課金制の料金モデルを使用します。Google Maps PlatformAPI や SDK は、SKU 単位で課金されます。使用量の追跡はサービス

    Geocoding API の使用量と請求額  |  Google for Developers
    hidehara
    hidehara 2016/03/28
    2015年3月現在の制限 “1 秒あたり 10 回のリクエスト” , "1日あたり 2,500回のリクエスト" が無料範囲。1日あたりは十分なんだけど、秒間あたりがちと不足しそう。
  • Geocoding API の概要  |  Google for Developers

    フィードバックを送信 Geocoding API の概要 コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 Geocoding API は、住所、緯度と経度の座標、またはプレイス ID として場所を受け入れるサービスです。住所を緯度と経度の座標とプレイス ID に変換したり、緯度と経度の座標またはプレイス ID を住所に変換したりします。 Geocoding API を使用する理由 Google Maps Platform API の 1 つによって提供される地図内でジオコーディング データを使用する場合は、ウェブサイトまたはモバイルアプリ用の Geocoding API を使用します。Geocoding API では、住所を使用して地図上にマーカーを配置したり、地図上のマーカーを住所に変換したりできます。このサービスは、事前定義された静的住所をジオコーディ

    Geocoding API の概要  |  Google for Developers
    hidehara
    hidehara 2016/03/28
    GoogleMaps Geocoding APIの使い方。
  • 各種ジオコーディングapiの罠と対処法 - 文系プログラマによるTIPSブログ

    色々あるのでそれぞれ規約を調べてみましたよ〜 各種ジオコーディングサービスですが、主に利用制限周りに罠があります。これをしっていないと色々利用規約に違反してしまうので、気をつける必要があります。それぞれ内容を確認し、まずは制限を知り、対策を検討する必要があります。 記事の最後に、実戦向きのジオコーディング処理を載せているので、是非ご覧下さい。 各種ジオコーダ google geocoding v2 google geocoding v3 Yahoo!ジオコーダAPI ジオコーディングの制限 国土交通省:位置参照情報ダウンロードサービス 実践ジオコーディング!! でも解る簡易処理フロー 用意するもの:ジオコーディングキューテーブル 用意するもの:ジオコーディング結果テーブル 用意するもの:クライアントサイドでGoogleジオコーディング 用意するもの:サーバサイドのジオコーディングバッチ

    各種ジオコーディングapiの罠と対処法 - 文系プログラマによるTIPSブログ
    hidehara
    hidehara 2016/03/28
    geocoding api 負荷も高いだろうから有名ドコロといえども、それなりの制限がある
  • アップル参戦! 「OpenStreetMap」をめぐる“地図戦争” (3/4)

    Google Maps脱出1号となった ウェブサービス事業者「Foursquare」 現代において、もはや、地図情報はなくてはならないオンラインサービスのひとつだ。ローカルの店舗や施設検索から、行動計画、データマイニングの一部として、さまざまな用途で応用されている。この傾向はスマートフォンやタブレットが隆盛となった最近ではさらに顕著となっており、これらデバイス保持者の約半数が、定常的にアプリ経由で地図情報サービスを利用しているというデータも存在する。それだけ重要なものなのだ。 iOSデバイスの例でも分かるように、現在ユーザーの多くは地図情報サービスとしてGoogle Mapsに触れるケースが多いと思う。直接同サービスを利用するケースもあれば、組み込みデータベースとしてレストラン/ホテル検索サービスの位置情報表示に利用される形もある。例えば次の画面にもあるような米大手レストラン検索サービス「

    アップル参戦! 「OpenStreetMap」をめぐる“地図戦争” (3/4)
    hidehara
    hidehara 2016/03/23
    MapBoxは3年以上の歴史があるのか。2012年にFourSqure採用のニュースをいまごろ発見。
  • 1