2016-03-14 22 views
1

我正在使用d3中的散點圖,並且圖上的每個點代表一張紙。d3.js單擊時發出替代顏色並單擊另一個點時更改爲原始狀態

圖上的所有點都是藍色的,但點擊時我希望選定的紙張改變顏色,例如(黃色)。但是當點擊另一個點時,我希望第一個點返回藍色,而新選擇的點變成黃色。我將如何實現這一目標?我有一個叫做clickHandler的函數,當點擊屬性創建圓時,這個函數會被調用。

這裏有一個類似的問題d3 javascript alternate colors on click

,而不是一圈轉回到原來的顏色在這個圈子我希望它重新打開另一個圈子的點擊第二次點擊,但。

下面的代碼是從上面的問題聯繫在一起,我不知道我會在正確的軌道認爲這是對我應該爲下面我想要什麼?:

function clickHandler (d, i) { 

var toggleColor = (function() { 

     var currentColor = "blue"; 
      return function() { 
       currentColor = currentColor == "blue" ? "yellow" : "blue"; 
       d3.select(this).style("fill", currentColor) 
           .style("stroke", "black"); 
      } 
    }) 
} 

任何幫助是極大的方法不勝感激!提前致謝!

回答

1

這可以是簡單:

function clickHandler (d, i) { 
    // reset all circle to blue 
    d3.selectAll('circle') //<-- or slap a class name on your circles and use that 
    .style('fill', 'blue'); 

    // set selected one to yellow 
    d3.select(this) 
    .style('fill', 'yellow'); 
} 
相關問題