質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

Q&A

解決済

1回答

1769閲覧

Google Maps API 特定の配列を保持しているJSONのみ抽出

chibiyuko_0124

総合スコア18

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

0グッド

0クリップ

投稿2018/08/16 06:34

編集2018/08/16 06:34

いつもお世話になっております。

Google Maps API にて外部のJSONファイルを読み込みピンを表示させることに成功しました。
が、非表示としたいピンが何本かあり、JSONを読み込む箇所で特定の配列を保持しているピンのみを抽出したいと考えておりますがそのようなことはできますでしょうか。

現在は下記のようなJSになっています。

var map; var markers = []; var infowindow = new google.maps.InfoWindow(); function initialize() { geocoder = new google.maps.Geocoder(); var center = new google.maps.LatLng(XXX,XXX); map = new google.maps.Map(document.getElementById('map'), { zoom: 12, center: center, mapTypeId: google.maps.MapTypeId.ROADMAP }); markMultiple(); } function markMultiple(){ $.getJSON('JSONファイル', function(data) { $.each(data, function(i,obj) { var latLng = new google.maps.LatLng( obj.map_latitude, obj.map_longitude ); var content = ピンをクリック後吹き出しの内容; markMap(latLng, content); }); var markerCluster = new MarkerClusterer(map, markers); }); } function markMap(position, content){ var marker = new google.maps.Marker({ position: position, icon: 'img/icon.png' }); google.maps.event.addListener(marker, 'click', function() { infowindow.setContent(content); infowindow.open(map, marker); }); markers.push(marker); } google.maps.event.addDomListener(window, 'load', initialize);

JSONは以下のようになっています。
以下でいえば"timer": "on"でdateが入力されているとなっている原宿のピンを表示させたいです。

[ { "id": "0", "station": "渋谷駅", "timer": "", "date": "2004-12-22T15:00:00.000Z", "map_latitude": XXX, "map_longitude": XXX, }, { "id": "1", "station": "原宿駅", "timer": "on", "date": "2004-12-23T15:00:00.000Z", "map_latitude": XXX, "map_longitude": XXX, }, { "id": "2", "station": "新宿駅", "timer": "on", "date": "", "map_latitude": XXX, "map_longitude": XXX, } ]

お力添えをいただけますと幸いです。
どうぞよろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

jQuery.grepで配列の絞り込みができます。

javascript

1$.getJSON('JSONファイル', function(data) { 2 data = $.grep(data, function(obj, i) { 3 return obj.timer === 'on' && obj.date 4 }); 5 $.each(data, function(i,obj) { 6 // 以下略 7 }); 8});

投稿2018/08/16 06:48

reosablo

総合スコア339

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

chibiyuko_0124

2018/08/17 06:02

ありがとうございます。 こちらの方法で解決できました。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問