- Trending Categories
Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to set a particular color as background to a JavaFX chart?
The javafx.scene.chart package provides classes to create various charts namely − line chart, area chart, bar chart, pie chart, bubble chart, scatter chart, etc.
You can create the required chart by instantiating the respective class.
Setting background image and the color −
The -fx-background-color class of JavaFX CSS is used to set a colored background to a chart.
The -fx-background-color (of the region chart-plot-background) class of JavaFX CSS is used to set the back ground color.
JavaFX Scene class has an observable list to hold all the required style sheets. You can get this list using the getStylesheets() method.
To set an image as a background to a chart −
Create a CSS file in the current package of the project sheet (say LineChart.css).
Set the background image using the -fx-background-color CSS class as −
.chart-plot-background { -fx-background-color: DIMGRAY; }
Set the plot color as transparent using the -fx-background-color CSS class as −
.chart-plot-background { -fx-background-color: transparent; }
In the program, get the observable list of style sheets using the getStylesheets() method.
Add the created CSS file to the list using the add() method.
Example
color.CSS −
.chart { -fx-padding: 10px; -fx-background-color: DIMGRAY; } .chart-plot-background { -fx-background-color: transparent; } .chart-vertical-grid-lines { -fx-stroke: #dedddc; -fx-stroke-width: 2; } .chart-horizontal-grid-lines { -fx-stroke: #dedddc; -fx-stroke-width: 2; }
JavaFX Program −
import javafx.application.Application; import javafx.scene.Scene; import javafx.scene.chart.AreaChart; import javafx.scene.chart.CategoryAxis; import javafx.stage.Stage; import javafx.scene.chart.NumberAxis; import javafx.scene.chart.XYChart; import javafx.scene.layout.StackPane; public class AreaChartExample extends Application { public void start(Stage stage) { //Defining the X and Y axes CategoryAxis xAxis = new CategoryAxis(); NumberAxis yAxis = new NumberAxis(); //Setting labels to the axes xAxis.setLabel("Months"); yAxis.setLabel("Rainfall (mm)"); //Creating the Area chart AreaChart<String, Number> areaChart = new AreaChart(xAxis, yAxis); //Prepare data for the area chart XYChart.Series series = new XYChart.Series(); series.getData().add(new XYChart.Data("Jan", 13.2)); series.getData().add(new XYChart.Data("Feb", 7.9)); series.getData().add(new XYChart.Data("Mar", 15.3)); series.getData().add(new XYChart.Data("Apr", 20.2)); series.getData().add(new XYChart.Data("May", 35.7)); series.getData().add(new XYChart.Data("June", 103.8)); series.getData().add(new XYChart.Data("July", 169.9)); series.getData().add(new XYChart.Data("Aug", 178.7)); series.getData().add(new XYChart.Data("Sep", 158.3)); series.getData().add(new XYChart.Data("Oct", 97.2)); series.getData().add(new XYChart.Data("Nov", 22.4)); series.getData().add(new XYChart.Data("Dec", 5.9)); //Setting the name to the line (series) series.setName("Rainfall In Hyderabad"); //Setting data to the area chart areaChart.getData().addAll(series); //Creating a stack pane to hold the chart StackPane pane = new StackPane(areaChart); //Setting the Scene Scene scene = new Scene(pane, 595, 300); stage.setTitle("Area Chart"); stage.setScene(scene); scene.getStylesheets().add("javafx_transformastions/color.css"); stage.show(); } public static void main(String args[]){ launch(args); } }