Vectores invisibles? Combinando d3.tile (), d3.zoom () y vectores TopoJSON

He hecho mapas D3 efectivos usando rásteres (d3.tile y bibliotecas de mapas) y vectores (TopoJSON en formas SVG). Pero me topé con un error cuando los combino.

Seguí los ejemplos de trama y vector de Mike Bostock, especialmente su"Ráster y vector III", que cambia la transformación y el ancho del trazo para actualizar cómo se muestran los vectores.

Mi mapacasi funciona perfectamente. Sin embargo, al cargar, solo se muestran los mosaicos de trama; los vectores son invisibles:

Pero tan pronto como active eld3.zoom evento (al desplazarse o hacer zoom), se muestran los vectores:

No entiendo esto, porque le digo explícitamente al navegador, independientemente del evento de zoom, que dibuje los vectores. Este es el fragmento relevante:

  // read in the topojson
  d3.json("ausElectorates.json", function(error, mapData) {
    if (error) throw error;

    var electorates = topojson.feature(mapData, mapData.objects.tracts);

    // apply a zoom transform equivalent to projection{scale,translate,center}
    map.call(zoom)
      .call(zoom.transform, d3.zoomIdentity
        .translate(mapWidth / 2, mapHeight / 2)
        .scale(1 << 12)
        .translate(-centre[0], -centre[1]));

    // draw the electorate vectors
    vector.selectAll("path")
      .data(electorates.features)
      .enter().append("path")
        .attr("class", "electorate")
        .attr("d", path);
  });

Por alguna razón, esa última línea de lad3.json() función -.attr("d", path") - No está visualizando los vectores.

haga clic aquí para ver el mapahaga clic aquí para acceder al código completo y al TopoJSON que usa.

¡Me encantaría recibir consejos sobre esto, lo que me desconcierta!

(PS Disculpas por omitir las atribuciones de derechos de autor para los mosaicos de mapas, la biblioteca D3.js, etc., solo estoy tratando de minimizar el código para este ejemplo).

Respuestas a la pregunta(1)

Su respuesta a la pregunta