javascript - 使用数据图，我正在尝试创建一个不透明度为 100% 的地图

Question

我正在使用数据地图（http://datamaps.github.io/）并试图使地图透明。我找不到针对国家/地区的 fillOpacity 的内置功能，仅针对气泡。

由于这是建立在 D3 之上的，所以我想知道是否有一个 hacky 解决方法来实现我的目标。最终我可能会切换到 D3 进行控制。

Answer 1

您可以使用 RGBA 值更改默认填充颜色，其中 A (alpha) 用于透明度/不透明度。数据图的 Github主页目前有演示代码，例如：

const opacity = 0.2;
const map = new Datamap({
  element: document.getElementById('container'),
  fills: {
    defaultFill: 'rgba(255, 0, 0, ' + opacity + ')'
  }
});

<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/datamaps/0.5.8/datamaps.all.min.js"></script>
<div id="container" style="position: relative; width: 500px; height: 300px;"></div>