我正在使用d3.jswith創建甜甜圈AngularJS。這是我的甜甜圈，默認情況下，我需要對甜甜圈圖的所有弧線使用相同的顏色，這樣可以正常作業。現在在特定弧的懸停時，我需要將該特定弧的顏色更改為藍色，這不起作用。任何人都可以幫助我嗎？
以下是來自提供的參考 plunker 的答案。：
scope.mouseOverPath = function(d) {
d3.select(this)
.transition()
.duration(duration)
.style("fill", "blue")
.each("start", function(d) {
labelRadius = radius chartConfig.labelPaddingOver;
d3.select(this.parentNode).select('.legend')
.transition()
.attr("transform", function(d) {
var c = arc.centroid(d),
x = c[0],
y = c[1],
height = Math.sqrt(x * x y * y);
return "translate(" (x / height * labelRadius) ','
(y / height * labelRadius) ")";
});
})
... }
scope.mouseOutPath = function(d) {
d3.select(this)
.transition()
.style('fill', function(d) {
return color(d.data.label);
})
.each("start", function(d) {
labelRadius = radius chartConfig.labelPadding;
d3.select(this.parentNode).select('.legend')
.transition()
.attr("transform", function(d) {
var c = arc.centroid(d),
x = c[0],
y = c[1],
height = Math.sqrt(x * x y * y);
return "translate(" (x / height * labelRadius) ','
(y / height * labelRadius) ")";
});
})
...
}
uj5u.com熱心網友回復：
style在指令scope.mouseOverPath和方法中使用 d3 的scope.mouseOutPath方法就可以了。
https://plnkr.co/edit/P98rPVKOHOgN5fKB
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/427199.html
標籤：javascript angularjs d3.js angularjs 指令 甜甜圈图
下一篇：d3.jsUncaught(inpromise)TypeError:d3.forceSimulationisnotafunction