使用D3.js着色地圖

我是StackOverflow的新手，剛開始使用D3。我需要在地圖上顯示值。我看到this question與我應該做的非常相似。使用D3.js着色地圖

我想要的是根據列Date列中的值將國家上色爲CSV並且基於用戶選擇的年份（單選按鈕）。我該怎麼做？

我創建了一個灰度色標，並將它們包含在一個數組中，然後我創建了一個方法chooseColor(value)，該方法根據該國在該年的值返回正確的顏色。我認爲這不是最有效的方法來做這件事...

在我的CSV也不是所有的國家在歐盟出席。例如，我沒有關於俄羅斯的數據，因此我「關閉」了一些國家將if放在mouseover的事件中。但是爲了擴大已知的國家，我還會在地圖上切掉俄羅斯的一部分。我怎麼能做到這一點？

我看着這些例子：等值線和閾值等值線由邁克·博斯托克在bl.ocks.org但我不知道如何上色的國家...... （我希望把聯繫，但我可以由於我的信譽低，不會超過2個鏈接）

This is my code。

我爲我的壞英語道歉。謝謝大家，

碼頭

編輯

我承認我不明白你的代碼中的一些東西。

爲什麼我需要活動on mouseover和mouseout？什麼是hover和rhover？我以爲他們是與this question有關的事件。但在我的情況下，我不需要它，不是嗎？
使用array_values或d是一樣的吧？如果我使用d或array_values不會改變，對吧？這是一個愚蠢的問題，但讓我困惑。

我以這種方式修改了makemap方法。我正確理解如何使用你的代碼？

function makemap（error，europe，dessease）dess = dessease.slice（）; county = topojson.feature（europe，europe.objects.collection）;

vector = svg.selectAll("path") 
    .data(counties.features) 
    .enter() 
    .append("path") 
    .attr("class", "county") 
    .attr("id", function(d) { 
     return "coun" + d.properties.indx; 
    }) 
    .attr("d", path) 
    .style("fill", function(array_values) { 
     return color(array_values[d.country]); 
    });

在這種情況下沒有關於d，當然是一個錯誤。對不起，我不知道我在哪裏錯了...

來源

2016-06-12 Buster

請刪除您的功能：選擇顏色。或者重構它 – Klaujesi

該國的顏色將取決於一個值。所以顏色是「價值」的函數。要做到這一點，你必須定義基於您的值的顏色範圍：

var color = d3.scale.linear() 
         .domain([mn,mx])  // <--- min and MAX of your value 
         .range(["#ffffff","000000"]);

然後定義你的國家的顏色：

svg.selectAll(".county") 
        .style("fill", function(array_values) { 
         return color(array_values[d.country]); 
        });

必讀：Jerome Cukier - d3: scales, and color

來源

2016-06-12 16:09:51 Klaujesi

我按照你的建議修改了代碼，但它不起作用。現在這些國家都是黑人，而不是以價值觀爲基礎的灰色。爲什麼？ [code]（https://plnkr.co/edit/F4byFugwvnflH4S46295?p=preview） – Buster

檢查你的[min，MAX]你的值。它是否正確？ – Klaujesi

'[min，max]'是正確的，但是如果我打印'd.value'，我得到'undefined' ..我錯誤地從csv文件中取值了嗎？ – Buster

使用D3.js着色地圖

回答

相關問題