Ein kleines Bild auf der Karte mit D3.js und GeoJson setzen

Question

Ich möchte einige vom Benutzer angegebene Koordinaten mit den Koordinaten in der Geojson-Datei vergleichen, und wenn sich die Bedingung als wahr herausstellt, dann möchte ich eine zeichnen kleines kreisförmiges Bild an dieser durch die Koordinaten definierten Position (wirklich klein wie ein Symbol oder etwas). Was muss ich in die d3.json-Methode schreiben, um auf die Koordinaten aus der Geojson-Datei zuzugreifen, sie zu vergleichen und ein Bild darauf zu zeichnen? Jede Hilfe wird geschätzt.

Dies ist ein kleiner Teil meiner GeoJSON Datei

{ 
"type": "FeatureCollection", 
"features": [ 
{ "type": "Feature", "properties": {}, "id":"Andhra Pradesh", "geometry": { "type": "MultiPolygon", "coordinates": [ [ [ [ 80.149167, 13.618300 ], [ 80.142031, 13.544708 ], [ 80.126421, 13.584849 ], [ 80.158087, 13.591093 ], [ 80.120622, 13.605812 ], [ 80.149167, 13.618300 ] ] ], [ [ [ 82.258801, 16.689980 ], [ 82.285562, 16.697563 ], [ 82.368074, 16.723877 ], [ 82.311876, 16.602562 ], [ 82.258801, 16.689980 ] ] ], 

Answer 1

Ich glaube, Sie einen anderen Datenmenge benötigen, um für das, was Sie wollen. Diese Koordinaten, die Sie in Ihrer geometry Sammlung haben, werden verwendet, um den Pfad zu zeichnen. Lesen Sie die Dokumentation:

http://geojson.org/geojson-spec.html#geometry-objects

Mit anderen Worten, das sind nur die Koordinaten auf die „Linien“ (Grenzen), die Sie auf der Karte zu sehen. Ich glaube, dass Sie Koordinaten für Positionen innerhalb jeden Zustand (Pfad) vergleichen möchten, wie Städte oder andere POI, ist das richtig?

In diesem Fall haben Sie zwei Möglichkeiten: Sie können einfach einen Kreis oder was auch immer nach den Koordinaten des Benutzers zeichnen, oder wenn diese Koordinaten Städte sind, können Sie nach einer anderen JSON-Datei mit geografischen Daten für diese Städte suchen und vergleichen Sie die Eingabe des Benutzers mit diesen Koordinaten.

Sobald Sie diese Koordinaten (nennen wir sie longitude und latitude), können Sie sie wie folgt zeichnen:

svg.append("circle") 
    .attr("cx", function() { 
     return projection(longitude); 
    }) 
    .attr("cy", function(d) { 
     return projection(latitude); 
    }) 
    .attr("r", whatever) 
    .style("fill", whatever); 

svg ist die Variable, die Sie den SVG anhängen verwendet, und projection das Sie verwendet um die Projektion einzustellen.