d3 + Leaflet aplica el valor de clase de los datos de geojson

Question

Tengo un archivo geojson que me l capaz de dibujar bien con D3 + Folleto. Estoy teniendo problemas para la aplicación de una clase de objetos svg con un valor en el archivo geojson. Cada entidad en el archivo geojson tiene una "manija" atributo. Yo estoy usando:

 la característica.attr("clase", function (d) {
 el retorno de "código" + d.manejar;
});

para probar y aplicar el valor, pero todos los objetos que vienen con la clase de "código no definido". Yo no creo que estoy enlazando los datos correctamente..o en que todos los objetos svg. Alguna idea?

Gracias!

bl.ocks.org versión: http://bl.ocks.org/jamierob/a21843bf2b7f3eb54456

js:

<script>
    var map = new L.Map("map", {center: [46.861967, -113.982825], zoom: 17})
            .addLayer(new L.TileLayer("http://tile1.map.umt.edu/tiles/tiles.py/composite/{z}/{x}/{y}.png"));
    var svg = d3.select(map.getPanes().overlayPane).append("svg"),
            g = svg.append("g").attr("class", "leaflet-zoom-hide");
    d3.json("bldgs.geojson", function (collection) {
        var transform = d3.geo.transform({point: projectPoint}),
                path = d3.geo.path().projection(transform);
        var feature = g.selectAll("path")
                .data(collection.features)
                .enter()
                .append("path");
        map.on("viewreset", reset);
        reset();
        // Reposition the SVG to cover the features.
        function reset() {
            var bounds = path.bounds(collection),
                    topLeft = bounds[0],
                    bottomRight = bounds[1];
            svg.attr("width", bottomRight[0] - topLeft[0])
                    .attr("height", bottomRight[1] - topLeft[1])
                    .style("left", topLeft[0] + "px")
                    .style("top", topLeft[1] + "px");
            g.attr("transform", "translate(" + -topLeft[0] + "," + -topLeft[1] + ")");
            //apply a class with the 'handle' value from the geojson file
            feature.attr("class", function (d) {
                return "code " + d.handle;
            });
            feature.attr("d", path);
        }
        // Use Leaflet to implement a D3 geometric transformation.
        function projectPoint(x, y) {
            var point = map.latLngToLayerPoint(new L.LatLng(y, x));
            this.stream.point(point.x, point.y);
        }
    });
</script>

Answer 1

"handle" está en las propiedades de la característica, por lo que solo tiene que ser d.properties.handle

Tratar:

 feature.attr("class", function (d) {
  return "code " + d.properties.handle;
});