如何將特定顏色設置爲JavaFX XYChart.Series？

我想要設計我的JavaFX線條圖，但找不到任何方法將顏色設置爲特定系列。我知道，我可以通過CSS來設計風格，但我無法找到如何爲我的系列設置ID或CLASS。如何將特定顏色設置爲JavaFX XYChart.Series？

誰能給我一個線索：

如何設置一種顏色來linecharts？
如何設置一個CSS類到系列？

2012-06-22 Yurish

一般來說，風格圖表的首選方式是沒有代碼，只使用css樣式表，正如jschoen的建議。此外，如果需要進一步定製，可以使用代碼中的css查找來挖掘從系列數據生成的節點，並應用各種其他css樣式。

以下是關於動態更改JavaFX line chart style和sample program以回答問題的信息。在示例應用程序中，所有其他css樣式均通過代碼中的setStyle調用完成。使用類似的查找技術，您可以訪問系列節點來應用合適的樣式表樣式而不是setStyle調用。

來源

2012-06-22 22:37:20 jewelsea

只是想說你有一些漂亮的示例程序在你的git帳戶。今天早些時候我遇到了他們，並且花了幾個小時看着他們。一個非常有用的資源。謝謝。 –

我可以相信，基於CSS的圖表樣式適用於「儀表板」軟件，但對於任何試圖以交互方式處理數據的人來說，這都是可憎的。即使JavaScript圖表庫通常不會強制您更新樣式表以在單個散點圖上更改磅值。 –

我在Styling charts with CSS上找到了一份此Oracle文檔，並且在該頁面上向下滾動到Setting Chart Colors以瞭解您正在尋找的內容。

如何將顏色設置爲線條圖？

造成這種情況的最簡單的方法是下面的CSS代碼片段：

.default-color0.chart-series-line { -fx-stroke: #e9967a; } 
.default-color1.chart-series-line { -fx-stroke: #f0e68c; } 
.default-color2.chart-series-line { -fx-stroke: #dda0dd; }

這不幸的是不會被ID或一系列的工作，而是爲了該系列被放置在圖中。您還可以設置線條樣式，雖然這樣做：

.chart-series-line {  
    -fx-stroke-width: 2px; 
    -fx-effect: null; 
}

如何將CSS類設置爲系列？

不幸的是我沒有看到辦法做到這一點。能夠基於XYChart.Series名稱屬性創建CSS規則會很好，但我認爲這是不可能的。

來源

2012-06-22 16:20:20

謝謝，我想到了更改默認的顏色，但我需要禁用/啓用系列（用戶將功能顯示/隱藏系列）。這樣做並不是最好的辦法。 – Yurish

jewelsea的回答似乎表明，您必須在系列的每個節點上放置一個風格級別。我使用下面的代碼來設計一系列面積圖的樣式，並且只將一個類分配給與該系列關聯的節點。示例代碼在Scala中，但應該很容易翻譯。

當創建一個系列，我添加了一個系列特定的樣式類：

 val s = new XYChart.Series[Number, Number]() //create a new series 
     s.setName(seriesName)       //set its name (display in legend) 
     s.getNode.getStyleClass.add("series-" + seriesName) //add specific style class

然後css -file我這樣做改變系列的butterwings'的填充顏色內部：

.series-butterwings *.chart-series-area-fill{ 
    -fx-fill: #aab597; 
}

這是有效的，因爲系列區域的節點低於系列節點（在面積圖的情況下是一個組）。

來源

2012-09-05 17:08:59 ziggystar

我試過這樣做，但發現我的程序掛在'add'調用上。任何人都有類似的經歷？我從ScalaFx這樣做;不知道這是否有所作爲（儘管我調用了本地javafx方法而不是包裝器）。 – Luciano

如何將顏色設置爲線圖？

這裏有一個簡單的方法來AreaChart或線型圖

XYChart chart = new AreaChart(); 
Series series = new Series(); 
chart.getData().add(series); 

Node fill = series.getNode().lookup(".chart-series-area-fill"); // only for AreaChart 
Node line = series.getNode().lookup(".chart-series-area-line"); 

Color color = Color.RED; // or any other color 

String rgb = String.format("%d, %d, %d", 
     (int) (color.getRed() * 255), 
     (int) (color.getGreen() * 255), 
     (int) (color.getBlue() * 255)); 

fill.setStyle("-fx-fill: rgba(" + rgb + ", 0.15);"); 
line.setStyle("-fx-stroke: rgba(" + rgb + ", 1.0);");

來源

2015-02-12 12:22:03

這些行上我得到一個空值： series.getNode（）。lookup（「。chart-series-area-fill」）; series.getNode（）。lookup（「。chart-series-area-line」）; 我正在使用面積圖。 – LordScone

對於LineChart，請嘗試'series.getNode（）。lookup（「。chart-series-line」）;'。 – Pygmalion

我想強調一下''在將系列添加到圖表之後，必須調用'series.getNode（）。lookup（）'，否則它將返回null。 –

如何將特定顏色設置爲JavaFX XYChart.Series？

回答

相關問題