Domanda

Ho un topojson che contiene i percorsi di stato.Voglio che l'utente sia in grado di aggirare su uno stato e lo stato per apparire in un diverso SVG.Finora, ho cercato di estrarre la geometria fuori dal topojson (D.Geometry, D.Geometry.Coordinati ecc.) Ma non sono in grado di farlo. Forse ho bisogno di disegnare un poligono da quello, ma alcuni stati sono di tipo "poligono" e alcuni di loro sono di tipo "multipolgyon".

Qualche idea / suggerimenti?

Modifica: Ecco il mio codice

var svg = d3.select("#india-map")
.append("svg")
.attr("width",width).attr("preserveAspectRatio", "xMidYMid")
.attr("viewBox", "0 0 " + width + " " + height)
.attr("height", height)

var stateSvg = d3.select("#state-map")
.append("svg")
.append("g")
.attr("height", height)
.attr("width", width);


var g = svg.append("g");

var projection = d3.geo.mercator()
  .center([86, 27])
  .scale(1200);

var path = d3.geo.path().projection(projection);

var pc_geojson = topojson.feature(pc, pc.objects.india_pc_2014);
var st_geojson = topojson.feature(state_json, state_json.objects.india_state_2014);

g.selectAll(".pc")
    .data(pc_geojson.features)
    .enter().append("path")
    .attr("class", "pc")
    .attr("d", path)
    .attr("id", function(d){ return d.properties.Constituency;})
    .attr("fill", "orange")
    .on("click", function(d){
        drawCons(d);
    });

function drawCons(d){
 stateSvg.selectAll(".pc2")
   .data(d)
   .enter().append("path")
   .attr("class","pc2")
   .attr("d", path)
}
.

È stato utile?

Soluzione

.data() prevede di essere fornita una serie di oggetti da abbinare alla selezione.Stai passando un singolo oggetto, quindi non funziona.È possibile utilizzare .datum(d) o .data([d]) per farlo funzionare.

Demo veloce e sporco qui .

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top