Mit Datamaps versuche ich eine Karte mit nicht 100% Opazität zu erstellen

Question

Ich verwende Datamaps (http://datamaps.github.io/) und versuche, die Karte transparent zu machen. Ich kann keine eingebaute Funktion für fillOpacity für die Länder finden, nur für die Bubbles.

Da dies auf D3 aufgebaut ist, habe ich mich gefragt, ob es einen hacky Workaround gibt, um mein Ziel zu erreichen. Irgendwann werde ich wahrscheinlich für die Kontrolle auf D3 wechseln.

Answer 1

Sie können die Standardfüllfarbe mit einem RGBA-Wert ändern, wobei A (Alpha) für Transparenz/Deckkraft verwendet wird. Der Haupt Github page für Datenzuordnungen hat derzeit Demo-Code für das, zum Beispiel:

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>