javascript - 从 MySQL 获取数据到 GeoJSON 时，LeafletJS 不显示 map

Question

所以我可以使用这个 Php 查询从 MySQL 获取数据

while($row = mysql_fetch_assoc($dbquery)) {
$feature = array(
'type' => 'Feature', 
'geometry' => array(
'type' => 'Point',
'coordinates' => array((float)$row['lng'], (float)$row['lat'])
),
'properties' => array(
'pano' => $row['pano']
//Other fields here, end without a comma
)
);
array_push($geojson['features'], $feature);

当使用 json_encode($geojson,JSON_NUMERIC_CHECK) 回显数组时；结果是

{"type":"FeatureCollection","features":[{"type":"Feature","geometry":{"type":"Point","coordinates":[25.726231,66.498966]},"properties":{"pano":"81_1_0.html"}},{"type":"Feature","geometry":{"type":"Point","coordinates":[25.723139,66.50158]},"properties":{"pano":"81_1_0.html"}}]};

但是当我尝试将它们放入 LeafletJS map 时，什么也没有显示

var points = <?php echo json_encode($geojson, JSON_NUMERIC_CHECK); ?> ;
var geoJsonLayer = L.geoJson(points, {
    pointToLayer: function (feature, latlng) {
        var marker = L.circleMarker(latlng, geojsonMarkerOptions);

        marker.on('click', function (e) {
            var feature = e.target.feature;
            var content = '<iframe width="665" height="650" frameborder="0" src="/' + feature.properties.pano + '">';
            document.getElementById("event").innerHTML = content;

            if (selectedMarker != false) {
                selectedMarker.setStyle({
                    fillColor: "#ff7800"
                });
            }
            marker.setStyle({
                fillColor: "#000000"
            });
            selectedMarker = marker;
        });

        return marker;
    }
});
markers.addLayer(geoJsonLayer);

我在这里做错了什么？

Answer 1

尝试以下:-

var bicycleRental = {

  "type": "FeatureCollection",
  "features":[{
      "type": "Feature",
      "properties": {
        "point_id": "m14885"
      },
      "geometry": {
        "type": "Point",
        "coordinates": [
          101.52053833007812,
          3.065117257466733
        ]
      }
    }


L.geoJson(bicycleRental, {

                style: function (feature) {
                    return feature.properties && feature.properties.style;
                },

                onEachFeature: onEachFeature,

                pointToLayer: function (feature, latlng) {
                    return L.circleMarker(latlng, {
                        radius: 1.5,
                        fillColor: "#ffffff",
                        color: "#000",
                        weight: 0.8,
                        opacity: 0.5,
                        fillOpacity: 0.5
                    });
                }
            }).addTo(map);