Programmiererforum

Was sollte mir eine ziemlich einfache Sache sein, die mir in der Broschüre Probleme hat. Ich habe D3 -Punkte auf einer Flugblattkarte überlagert: < /p>
// create map element in DOM

// build leaflet map
L.mapbox.accessToken = 'pk.eyJ1Ijoic3RhcnJtb3NzMSIsImEiOiJjaXFheXZ6ejkwMzdyZmxtNmUzcWFlbnNjIn0.IoKwNIJXoLuMHPuUXsXeug';
var mapboxUrl = 'https://api.mapbox.com/styles/v1/mapbox/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}';
//var accessToken = 'pk.eyJ1Ijoic3RhcnJtb3NzMSIsImEiOiJjam13ZHlxbXgwdncwM3FvMnJjeGVubjI5In0.-ridMV6bkkyNhbPfMJhVzw';
var map = L.map('map').setView([37.7701177, -122.40], 13);
mapLink =
'[url=http://openstreetmap.org]OpenStreetMap[/url]';
L.tileLayer(
'https://api.mapbox.com/styles/v1/mapbox/dark-v9/tiles/{z}/{x}/{y}?access_token=' + L.mapbox.accessToken, {
tileSize: 512,
zoomOffset: -1,
attribution: '© [url=https://www.mapbox.com/feedback/]Mapbox[/url] © [url=http://www.openstreetmap.org/copyright]OpenStreetMap[/url]'
}).addTo(map);

var svgLayer = L.svg();
svgLayer.addTo(map);

var svgMap = d3.select("#map").select("svg");
var g = svgMap.select('g');

//load point data
d3.json("data/SanFrancisco_CoWorkingTenants.json", function(SFData) {
var SFData = SFCoworking.features
console.log(SFData)
})
SFData.forEach(function(d) {
d.latLong = new L.LatLng(d.properties.Latitude,
d.properties.Longitude);

})

// append circles to map
var feature = g.selectAll("circle")
.data(SFData)
.enter().append("circle")
.style("stroke", "black")
.style("opacity", .4)
.style("fill", "red")
.attr("r", 20)
.attr("class", 'features')

function drawAndUpdateCircles() {
feature.attr("transform",
function(d) {
var layerPoint = map.latLngToLayerPoint(d.latLong);

return "translate("+ layerPoint.x +","+ layerPoint.y +")";

}
)
}

drawAndUpdateCircles();
map.on("moveend", drawAndUpdateCircles);
< /code>
Ich möchte Popups für jeden Kreispunkt mit einem Mausover -Event -Listener haben. Aber ich kann nicht einmal so weit kommen. Ich kann den Ereignishörer nicht einmal zum Auslösen bringen. < /P>
d3.selectAll('.features').on("mouseover", function(){console.log("mouse event")})
< /code>
Beim Testen des D3 -Selektors funktioniert es mit Folgendem: < /p>
d3.selectAll('.features').style("opacity", .1)
< /code>
Ich weiß also, dass der Selektor hier nicht das [url=viewtopic.php?t=15738]Problem[/url] ist. Was kann ich als nächstes versuchen?