#実現したいこと
こちらソースコードのように、リンクをクリックすると、ポップアップが開くような実装をしたいと思っています。
実際にどのようなソースコードになるのか、ご指導頂ければと存じます。

#現状
GeoJsonを外出ししており、取得は以下のコードで実施しています。
現在は、地図は正しく表示され、ピンは、正しく立っております。

以下は、おそらく修正するべきところと思われる該当箇所の抜粋です

JavaScript
1    $.getJSON("/geo_json").done(function(data){
2        var geojson = L.geoJson(data, {
3            onEachFeature: function (feature, layer) {
4                layer.bindPopup("テスト");
5            }
6        });
7        geojson.addTo(map);
8    });

以下はソースコードの全体です

JavaScript
1    DEF_LAT = 34.000000;
2    DEF_LNG = 135.000000;
3
4    var map = L.map('map').setView([DEF_LAT ,DEF_LNG], 10);
5
6    // 現在地を中央にする
7    //map.locate({setView: true, maxZoom: 15});
8
9    // OSMタイル
10    var tileLayer = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
11        attribution : '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
12    });
13    tileLayer.addTo(map);
14
15    $.getJSON("/geo_json").done(function(data){
16        var geojson = L.geoJson(data, {
17            onEachFeature: function (feature, layer) {
18                layer.bindPopup("テスト");
19            }
20        });
21        geojson.addTo(map);
22    });

#やってみたこと
リンク先のソースコード自体は、動かすことができましたが、現状のソースコードに置き換えて試行錯誤しましたが、できませんでした。

どうぞ、よろしくお願い申し上げます。

2016/12/22 14:05追記

JavaScript
1    var markers = [];
2    $.getJSON("/geo_json").done(function(data){
3        var geojson = L.geoJson(data, {
4            onEachFeature: function (feature, layer) {
5                layer.bindPopup('テスト');
6                markers.push(layer);  // 追加
7            }
8        });
9        geojson.addTo(map);
10
11        function markerFunction(id){
12            for (var i in markers){
13                var markerID = markers[i].options.title;
14                if (markerID == id){
15                    markers[i].openPopup();
16                }
17            }
18        }
19
20        $("a").click(function(){
21            markerFunction($(this)[0].id);
22        });
23
24    });

HTML
1    <a id="marker_1" href="#">Marker 1</a><br>
2    <a id="marker_2" href="#">Marker 2</a><br>
3    <a id="marker_3" href="#">Marker 3</a>

行動規範の内容に同意します

回答1件

ベストアンサー

onEachFeature 内で markers.push(layer); してリンク先のように処理してみればよいのでは？

追記：

JavaScript
1var markers = [];
2$.getJSON( "/geo_json" ).done( function( data ) {
3	var geojson = L.geoJson( data, {
4		onEachFeature: function ( feature, layer ) {
5			layer.bindPopup( feature.properties.popupContent );
6		},
7		pointToLayer: function (feature, latlng) {
8			var m = L.marker( latlng, { title : feature.properties.popupContent } );
9			markers.push( m );
10			return m;
11		}
12	});
13	geojson.addTo( map );
14
15	function markerFunction( id ) {
16		for ( var i in markers ) {
17			var markerID = markers[i].options.title;
18			if ( markerID == id ) {
19				markers[i].openPopup();
20			}
21		}
22	}
23	$("a").click(function(){
24		markerFunction( $( this )[0].id );
25	});
26
27});