Cách đặt màu cụ thể cho JavaFX XYChart.Series?

Question

Tôi đang cố gắng tạo kiểu cho linechart JavaFX của mình, nhưng không thể tìm thấy bất kỳ cách nào để đặt màu thành chuỗi cụ thể. Tôi biết, rằng tôi có thể tạo kiểu thông qua CSS, nhưng tôi không thể tìm thấy cách đặt ID hoặc CLASS thành chuỗi của mình.

bất cứ ai có thể cho tôi một đầu mối về:

1. Làm thế nào để thiết lập một màu để linecharts?
2. Cách đặt một lớp css thành chuỗi?

Answer 1

Nói chung, cách thức ưu tiên của biểu đồ kiểu không có mã, chỉ sử dụng biểu định kiểu css như jschoen đề xuất. Ngoài ra, nếu cần thêm tùy chỉnh, bạn có thể sử dụng tra cứu css từ mã để tìm hiểu các nút được tạo từ dữ liệu chuỗi và áp dụng nhiều kiểu tạo CSS khác nhau.

Dưới đây là thông tin về thay đổi động JavaFX line chart style và sample program để đi cùng với câu trả lời. Trong ứng dụng mẫu, tất cả các kiểu css bổ sung được thực hiện thông qua một cuộc gọi setStyle từ mã. Sử dụng một kỹ thuật tra cứu tương tự, bạn có thể truy cập vào các nút chuỗi để áp dụng một kiểu bảng kiểu dáng thích hợp thay vì một cuộc gọi setStyle.

Answer 2

Tôi tìm thấy Tài liệu Oracle này trên Styling charts with CSS và trên trang đó cuộn xuống Setting Chart Colors cho những gì bạn đang tìm kiếm cụ thể.

Cách đặt màu thành linecharts?

Cách đơn giản nhất cho điều này là đoạn CSS sau:

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

này tiếc là sẽ không hoạt động bằng cách id hoặc đó là hàng loạt, mà là thứ tự truyện được đặt trong đồ thị. Bạn cũng có thể đặt kiểu đường bằng cách thực hiện:

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

Cách đặt một lớp css thành chuỗi?

Rất tiếc, tôi không thấy cách nào để thực hiện điều đó. Nó sẽ là tốt đẹp để có thể tạo ra các quy tắc CSS dựa tắt thuộc tính tên XYChart.Series, nhưng tôi không nghĩ rằng đó là có thể.

Answer 3

câu trả lời của jewelsea dường như nói rằng bạn phải đặt một lớp kiểu trên mỗi nút của chuỗi. Tôi đang sử dụng mã sau đây để tạo kiểu cho chuỗi biểu đồ vùng và chỉ gán một lớp cho nút được liên kết với chuỗi. Mã ví dụ là trong Scala, nhưng phải dễ dịch.

Khi tạo hàng loạt, tôi thêm một loạt cụ thể lớp phong cách:

 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 

Sau đó bên trong css -file tôi làm như sau để thay đổi màu fill cho loạt 'butterwings':

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

Điều này làm việc, bởi vì nút cho khu vực chuỗi nằm dưới nút chuỗi (là một nhóm trong trường hợp biểu đồ vùng).

Answer 4

Cách đặt màu thành linecharts?

Đây là một cách đơn giản để AreaChart hoặc Biểu đồ dạng đường

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);");