Question

我正在使用d3 geomaps创建美国的地理地图。当我将鼠标悬停在状态上时，我希望状态突出显示。那可能吗？这是我目前的代码：

<html>
            <head>
     <meta    charset="utf-8">
    <link href="d3-geomap/css/d3.geomap.css" rel="stylesheet">
    <script src="d3-geomap/vendor/d3.geomap.dependencies.min.js"></script>
    <script src="d3-geomap/js/d3.geomap.min.js"></script>
</head>
<body>
    <div id="map"></div>
</body>
</html>

<script>
 var map = d3.geomap.choropleth()
.geofile('d3-geomap/topojson/countries/USA.json')
.projection(d3.geo.albersUsa)
.column('2012')
.unitId('fips')
.scale(1000)
.legend(true);

d3.csv('data.csv', function(error, data) {
d3.select('#map')
    .datum(data)
    .call(map.draw, map);
});

</script>

Answer 1

是的你可以，看看我做过的这个JSFiddle：http://jsfiddle.net/b6huwcd7/1/

我所做的就是将这个CSS代码添加到示例代码中：

path.unit:hover{
    fill:red;
}

Answer 2

基于@ black0ut的回复，这里是答案：

Get-ACL

d3 - geomaps悬停选项

2 个答案: