創建狀態的熱圖在巴西

//var map = new Datamap({element: document.getElementById('container')}); 
 
var colors = d3.scale.category10(); 
 
var arcs = new Datamap({ 
 
    element: document.getElementById("container"), 
 
    scope: 'bra' 
 
});

<script src="http://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script> 
 
<script src="http://cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js"></script> 
 
<script src="./datamaps.bra.min.js"></script> 
 
<div id="container" style="position: relative; width: 1540px; height: 900px;"></div>

會有人能夠向我解釋這不會正確繪製地圖巴西？我有一個類似於美國的例子。我使用https://datamaps.github.io/

控制檯不會產生錯誤

來源

2016-11-16 Apollo

你必須設置一個自定義投影：

var map = new Datamap({ 
 
    scope: 'bra', 
 
    element: document.getElementById('container'), 
 
    setProjection: function(element) { 
 
     var projection = d3.geo.equirectangular() 
 
      .center([-55.908333, -18.19638]) 
 
      .scale(1000) 
 
      .translate([element.offsetWidth/2, element.offsetHeight/2]); 
 
     var path = d3.geo.path() 
 
      .projection(projection); 
 

 
     return { 
 
      path: path, 
 
      projection: projection 
 
     }; 
 
    }, 
 
})

<script src="https://d3js.org/d3.v3.min.js"></script> 
 
    <script src="https://d3js.org/topojson.v1.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/datamaps/0.4.4/datamaps.bra.js"></script> 
 
<div id="container" style="position: relative; width: 1540px; height: 900px;"></div>

來源

2017-02-09 03:55:55

創建狀態的熱圖在巴西

回答

相關問題