Is поддается добавлению имени класса из уровня данных GeoJSON с листом

Question

У меня есть две визуализации: одна D3 и другая лифлетная. Я пытаюсь заставить их взаимодействовать. С D3 я могу создать объект, скажем, карту деревьев, и я с легкостью могу добавить идентификаторы или классы в узлы. Например:

var node = div.datum(root).selectAll(".node") 
    .data(treemap.nodes) 
    .enter().append("rect") 
     .attr("class", "node") 
     .attr("id", function(d){ 
     return d.metro_area ? d.metro_area: null; 
     }) .....; 

Я пытаюсь сделать то же самое в буклете, где я творю полигоны для областей метро в США и размещение их в слое на карте листовки. Подобно this example.

geojson = L.geoJson(statesData, { 
     style: style, 
     onEachFeature: onEachFeature 
    }).addTo(map); 

Сейчас на карте, я хочу, чтобы добавить имя Агломерация к Правильный многоугольник в виде класса или ID.

Делая какие-нибудь подобное с D3:

d3.select(map.getPanes().overlayPane).selectAll("path") 
.data(polyData).attr("id", function(d){ 
return d.properties.metro_area.replace(/[\W\s]/g,""); }); 

действительно добавить идентификаторы данных полигонов, но порядок, в котором получают построены полигоны и порядок, в котором метро имена областей (буквенные) возвращаются разные. По большей части эти два являются непоследовательными.

Казалось бы, что для того, чтобы правильно районе метро будут отображены на правильный многоугольник на карте, нужно было бы сделать что-то вроде этого:

function mapToTreeIds(feature){ 
    return feature.properties.metro_area; 
    } 
    geojson = L.geoJson(statesData, { 
     style: style, 
     onEachFeature: onEachFeature, 
     addClass: mapToTreeIds 
    }).addTo(map); 

Однако приведенный ниже код не работает в курс. Существует метод L.DOMUtils.hasClass(), но, похоже, это не трюк. Есть идеи? Можно ли это сделать даже с листингом версии 0.7?

Большое спасибо.

Answer 1

Это основное отличие между D3 и Листовкой: слой Leaflet абстрагирует от DOM & любым другим способом, который он показывает (например, через Canvas), поэтому он ограничивает ваш доступ к базовым элементам. Вы можете взломать эту абстракцию с помощью частных членов, но это не рекомендуется. Листовка - это взаимодействие с элементами только через документированный API Листовки.