更改軸顏色酒窩

我有一個非常簡單的折線圖。我想將x和y軸的顏色更改爲白色。更改軸顏色酒窩

var svg = dimple.newSvg(".line_chart_container", 400, 300),dataset; 
var chart = new dimple.chart(svg, dataset); 
var x = chart.addCategoryAxis("x", "Attempts"); 
//x.style ("fill","red") 
var y = chart.addMeasureAxis("y", "Value"); 
y.showGridlines = true; 
x.showGridlines = true; 
var s = chart.addSeries(["Metric", "Value"], dimple.plot.bubble); 
var lines = chart.addSeries("Metric", dimple.plot.line); 
lines.lineWeight = 2; 
lines.lineMarkers = true; 
chart.assignColor("Metric", "#30D630"); 
chart.draw(); 
s.shapes.style("opacity", function (d) { 
return (d.yValue === 0 ? 0 : 0.8); 
});

我檢查了dimple.axis documentation in GitHub但找不到任何東西。有一個dimple.axis.colors屬性，但它會更改數據的顏色而不是軸。酒窩甚至支持這個嗎？

我還試圖（以D3等）添加樣式屬性：

x.style ("fill","red")

而是陷入了一個錯誤：未捕獲的類型錯誤：x.style不是一個函數

任何想法？

來源

2015-06-19 Reyhane Askari

x不是d3選擇，它是dimple.axis。您可以使用shapes屬性（這是任何凹坑對象的標準）訪問內部d3選擇。有一個例子是here。

根據您是否要更改線條顏色，文本顏色，或一切，你會做

x.shapes.selectAll("*").style("fill", "white")

其中*也可以是「文本」或「行」。注意：單個刻度標記是<line>節點，要更改它們的顏色，您需要使用「描邊」而不是「填充」。此外，實際軸線本身不是<line>元素，它是<path>元素。因此，要改變這種顏色是：

x.shapes.select("path.dimple-custom-axis-line").style("stroke", "white");

用戶也可以直接手動編寫CSS規則來覆蓋樣式的圖表：

g.dimple-axis > g.tick > line, g.dimple-axis path.dimple-custom-axis-line { 
    stroke:white; 
}

來源

2015-06-19 19:44:33 ne8il

X軸

d3.selectAll("path.domain")[0][0].style.stroke = "red";

對於Y軸

d3.selectAll("path.domain")[0][1].style.stroke = "yellow";

來源

2016-10-04 11:15:16

更改軸顏色酒窩

回答

相關問題