javascript - D3.js はマウスアウト時に以前の色を復元します

Question

私は d3.js を使用しており、マウスオーバーで要素を強調表示しようとしています。マウスオーバーで四角形の色が変わるが、マウスアウトでは元に戻らないという問題があります。要素にはさまざまな色があるため、マウスアウト時に四角形がどの色になるかをハードコードすることはできません。

これが私のコードです

rectを作成するコード

    nodeEnter.append("svg:rect")
    .attr("y", -barHeight / 2)
    .attr("height", barHeight)
    .attr("width", barWidth)
    .style("fill", color)
    .on("click", click)
    .on("mouseover", seres.utilities.highlight)
    .on("mouseout", seres.utilities.downlight);

上記のコードで呼び出されるカラー関数

function color(d) {
  return d._children ? "#3c3c3c" : d.children ? "#c2bcbc" : "#ffffff";

}

ユーティリティコード

var myMouseOver = function() {
    var rect = d3.select(this);
    rect.style("fill", "red");
}

var myMouseOut = function() {
    var rect = d3.select(this);
    rect.style("fill", 'DONTKNOWWHATTOPUTHERE');
}