僕が住んでいる愛知県豊橋市でプレミアム商品券が使えるお店を地図上に表示するサイトを作ってみました。
市のホームページで公開されているデータを取り込んで、住所から緯度経度を算出して、マップに表示するというサイトです。
https://maru-site.com/mapstest1/toyohashi.php
※繁華街などのお店が密集している場所は、ちょっと表示が重いかもです。。。
スマホやタブレットなどのGPS機能が付いているデバイスであれば、現在位置の表示もできます
現在地ボタンを押すと現在位置に移動します
自分が今いる場所付近でプレミアム商品券を使える店をパッと見て探すことができます。
★マーク
地図上の★マークがプレミアム商品券が使えるお店です
★マークをクリック(タップ)すると、フキダシに店名が表示されます
フキダシをクリック(タップ)すると、そのフキダシが隠れます
■フキダシボタン
地図をある程度拡大するとフキダシボタンが表示されます
このボタンを押すと、今、表示されているエリアの店がフキダシ表示されます
もう一度ボタンを押すとフキダシが解除されます
繁華街などお店が密集している場所では
フキダシの数が多くて重なってしまうことがあります。
そんなときはズームインしてみてください。
すると、★と★の間隔が広がります
それでもフキダシが重なる場合は、フキダシをクリック(タップ)すると個別に非表示にできます
※ある程度ズームアウトすると描画処理が重くなるので自動的にフキダシが消えます
■バグったら「更新」
Webアプリはたまにバグります(汗)
そんなときは更新ボタンで、ページを再読みしてやってください
■謝りごと
なにぶん、
データの取り込みや緯度経度の計算までプログラムで自動的に行っているので、たま~に実際のお店と地図上の場所が違っていることがあります。
全部はチェックできてません(泣)
ごめんなさい。。。
■お役に立てれば何よりです
とりあえず手始めに自分が住んでいる豊橋バージョンを作ってみましたが、余裕があればその他の市町村でも作れればなー、とボンヤリ企んでます。
この著者はこんな記事も書いてます
Tweet |
Follow @maru_ryan |
この著者が描いた微妙なLINEスタンプ発売中
買ってとは言いませんっ!
見るだけ見てやってくださいっ
第一弾
http://line.me/S/sticker/1263783
第二弾
http://line.me/S/sticker/1273125
第三弾
http://line.me/S/sticker/1272540
この著者はこんな記事も書いてます
【ぜんじろう&コラアゲン 4都市ツアーファイナル ライブレポ】 |
【稲葉浩志ソロツアー Koshi Inaba LIVE 2016~enIII~in名古屋 ライブレポート】
2016年2月11日に名古屋・日本ガイシホールで行われた稲葉浩志ソロツアーの様子をネタバレ必至で僕の主観を交えて詳細にお伝えしている記事。B’zファン・稲葉ファン必見です。 |
【タクシー】 |
【安い!軽自動車ユーザー車検ガイド 豊橋】
車検~それは、忘れた頃にやってくる大きな出費。 この記事では、愛知県豊橋市でユーザー車検を受けるときの予約の方法から書類の書き方・費用・検査場での流れまで詳しく説明しています。 |
この著者はこんな記事も書いています
Tweet |
Follow @maru_ryan |