HanSolo
LineChart - am i dumb?
Hi thereeee, started using your linechart. Its simple and beautiful.
As i started playing around i couldnt get behind the following:
xAsisBottom.maxValue(13)
xAsisBottom.maxValue(5)
Questions: why has every categorie changed to "Jan" when changing maxValue from 13 to 5? why has maxvalue(13) nut begun at the beginning of the chart but maxvalue(5) did?
xAsisBottom.maxValue(7)
Questions: this is basically what i want, except the fact that theres useless space in the chart because i always want to display just 5 values on the x-asis. why do i need the space in order for the categories to be kinda right?
Explanation for how i got there: sooo... the thing is, i played around in your test and all i did was only using 1 instead of 3 series and displaying only 5 values on the x asis instead of 13.
the following code is from your LineChartTest but with my changes (i left your original code commented) at the //TODO might be the problem or my own stupidness, lets find out
`public class LineChartTest extends Application { private static final Random RND = new Random(); private static final Double AXIS_WIDTH = 25d; private XYChartItem p1; private XYChartItem p2; private XYChartItem p3; private XYChartItem p4; private XYChartItem p5; private XYChartItem p6; private XYChartItem p7; private XYChartItem p8; private XYChartItem p9; private XYChartItem p10; private XYChartItem p11; private XYChartItem p12; private XYSeries xySeries1; private XYSeries xySeries2; private Axis xAxisBottom; private Axis yAxisLeft; private XYChart<XYChartItem> lineChart; private long lastTimerCalled; private AnimationTimer timer;
@Override public void init() {
p1 = new XYChartItem(1, RND.nextDouble() * 300 + 200, "Jan");
p2 = new XYChartItem(2, RND.nextDouble() * 300 + 200, "Feb");
p3 = new XYChartItem(3, RND.nextDouble() * 300 + 200, "Mar");
p4 = new XYChartItem(4, RND.nextDouble() * 300 + 200, "Apr");
p5 = new XYChartItem(5, RND.nextDouble() * 300 + 200, "May");
/*
p6 = new XYChartItem(6, RND.nextDouble() * 300 + 200, "Jun");
p7 = new XYChartItem(7, RND.nextDouble() * 300 + 200, "Jul");
p8 = new XYChartItem(8, RND.nextDouble() * 300 + 200, "Aug");
p9 = new XYChartItem(9, RND.nextDouble() * 300 + 200, "Sep");
p10 = new XYChartItem(10, RND.nextDouble() * 300 + 200, "Oct");
p11 = new XYChartItem(11, RND.nextDouble() * 300 + 200, "Nov");
p12 = new XYChartItem(12, RND.nextDouble() * 300 + 200, "Dec");
*/
xySeries1 = XYSeriesBuilder.create()
.items(p1, p2, p3, p4, p5)
//.items(p1, p2, p3, p4, p5, p6, p7, p8, p9, p10, p11, p12)
.chartType(ChartType.SMOOTH_AREA)
.fill(Color.web("#00AEF520"))
.stroke(Color.web("#00AEF5"))
.symbolFill(Color.web("#00AEF5"))
.symbolStroke(Color.web("#293C47"))
.symbolSize(10)
.strokeWidth(3)
.symbolsVisible(true)
.build();
/*
xySeries2 = XYSeriesBuilder.create()
.items(new XYChartItem(1, 280, "Jan"),
new XYChartItem(2, 190, "Feb"),
new XYChartItem(3, 280, "Mar"),
new XYChartItem(4, 300, "Apr"),
new XYChartItem(5, 205, "May"),
new XYChartItem(6, 430, "Jun"),
new XYChartItem(7, 380, "Jul"),
new XYChartItem(8, 180, "Aug"),
new XYChartItem(9, 300, "Sep"),
new XYChartItem(10, 440, "Oct"),
new XYChartItem(11, 300, "Nov"),
new XYChartItem(12, 390, "Dec"))
.chartType(ChartType.SMOOTH_AREA)
.fill(Color.web("#4EE29B20"))
.stroke(Color.web("#4EE29B"))
.symbolFill(Color.web("#4EE29B"))
.symbolStroke(Color.web("#293C47"))
.symbolSize(10)
.strokeWidth(3)
.symbolsVisible(true)
.build();
*/
xAxisBottom = AxisBuilder.create(Orientation.HORIZONTAL, Position.BOTTOM)
.type(AxisType.TEXT)
.prefHeight(AXIS_WIDTH)
.categories("Jan", "Feb", "Mar", "Apr", "May")
//.categories("", "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec")
.minValue(1)
//TODO whats wrong here? try maxValue(13), maxValue(5) and maxValue(7)
.maxValue(7)
//.maxValue(13)
.autoScale(true)
.axisColor(Color.web("#85949B"))
.tickLabelColor(Color.web("#85949B"))
.tickMarkColor(Color.web("#85949B"))
//.tickMarksVisible(false)
.build();
AnchorPane.setBottomAnchor(xAxisBottom, 0d);
AnchorPane.setLeftAnchor(xAxisBottom, AXIS_WIDTH);
AnchorPane.setRightAnchor(xAxisBottom, AXIS_WIDTH);
yAxisLeft = AxisBuilder.create(Orientation.VERTICAL, Position.LEFT)
.type(AxisType.LINEAR)
.prefWidth(AXIS_WIDTH)
.minValue(0)
.maxValue(1000)
.autoScale(true)
.axisColor(Color.web("#85949B"))
.tickLabelColor(Color.web("#85949B"))
.tickMarkColor(Color.web("#85949B"))
//.tickMarksVisible(false)
.build();
AnchorPane.setTopAnchor(yAxisLeft, 0d);
AnchorPane.setBottomAnchor(yAxisLeft, AXIS_WIDTH);
AnchorPane.setLeftAnchor(yAxisLeft, 0d);
Grid grid = GridBuilder.create(xAxisBottom, yAxisLeft)
.gridLinePaint(Color.web("#384C57"))
.minorHGridLinesVisible(false)
.mediumHGridLinesVisible(false)
.minorVGridLinesVisible(false)
.mediumVGridLinesVisible(false)
.gridLineDashes(4, 4)
.build();
XYPane lineChartPane = new XYPane(xySeries1);
//XYPane lineChartPane = new XYPane(xySeries1, xySeries2);
lineChart = new XYChart<>(lineChartPane, grid, yAxisLeft, xAxisBottom);
/*
lastTimerCalled = System.nanoTime();
timer = new AnimationTimer() {
@Override public void handle(final long now) {
if (now > lastTimerCalled + 2_000_000_000l) {
p1.setY(RND.nextDouble() * 300 + 200);
p2.setY(RND.nextDouble() * 300 + 200);
p3.setY(RND.nextDouble() * 300 + 200);
p4.setY(RND.nextDouble() * 300 + 200);
p5.setY(RND.nextDouble() * 300 + 200);
p6.setY(RND.nextDouble() * 300 + 200);
p7.setY(RND.nextDouble() * 300 + 200);
p8.setY(RND.nextDouble() * 300 + 200);
p9.setY(RND.nextDouble() * 300 + 200);
p10.setY(RND.nextDouble() * 300 + 200);
p11.setY(RND.nextDouble() * 300 + 200);
p12.setY(RND.nextDouble() * 300 + 200);
lastTimerCalled = now;
}
}
};
*/
}
@Override public void start(Stage stage) {
StackPane pane = new StackPane(lineChart);
pane.setPadding(new Insets(10));
pane.setBackground(new Background(new BackgroundFill(Color.web("#293C47"), CornerRadii.EMPTY, Insets.EMPTY)));
Scene scene = new Scene(pane);
stage.setTitle("Line Chart");
stage.setScene(scene);
stage.show();
//lineChart.getXYPane().getListOfSeries().add(createSeries());
//timer.start();
}
@Override public void stop() {
System.exit(0);
}
private XYSeries createSeries() {
XYSeries xySeries = XYSeriesBuilder.create()
.items(new XYChartItem(1, 600, "Jan"),
new XYChartItem(2, 760, "Feb"),
new XYChartItem(3, 585, "Mar"),
new XYChartItem(4, 410, "Apr"),
new XYChartItem(5, 605, "May"),
new XYChartItem(6, 825, "Jun"),
new XYChartItem(7, 595, "Jul"),
new XYChartItem(8, 300, "Aug"),
new XYChartItem(9, 515, "Sep"),
new XYChartItem(10, 780, "Oct"),
new XYChartItem(11, 570, "Nov"),
new XYChartItem(12, 620, "Dec"))
.chartType(ChartType.SMOOTH_AREA)
.fill(Color.web("#AE00F520"))
.stroke(Color.web("#AE00F5"))
.symbolFill(Color.web("#AE00F5"))
.symbolStroke(Color.web("#293C47"))
.symbolSize(10)
.strokeWidth(3)
.symbolsVisible(true)
.build();
return xySeries;
}
private Axis createLeftYAxis(final double MIN, final double MAX, final boolean AUTO_SCALE, final double AXIS_WIDTH) {
Axis axis = new Axis(Orientation.VERTICAL, Position.LEFT);
axis.setMinValue(MIN);
axis.setMaxValue(MAX);
axis.setPrefWidth(AXIS_WIDTH);
axis.setAutoScale(AUTO_SCALE);
AnchorPane.setTopAnchor(axis, 0d);
AnchorPane.setBottomAnchor(axis, AXIS_WIDTH);
AnchorPane.setLeftAnchor(axis, 0d);
return axis;
}
private Axis createCenterYAxis(final double MIN, final double MAX, final boolean AUTO_SCALE, final double AXIS_WIDTH) {
Axis axis = new Axis(Orientation.VERTICAL, Position.CENTER);
axis.setMinValue(MIN);
axis.setMaxValue(MAX);
axis.setPrefWidth(AXIS_WIDTH);
axis.setAutoScale(AUTO_SCALE);
AnchorPane.setTopAnchor(axis, 0d);
AnchorPane.setBottomAnchor(axis, AXIS_WIDTH);
AnchorPane.setLeftAnchor(axis, axis.getZeroPosition());
return axis;
}
private Axis createRightYAxis(final double MIN, final double MAX, final boolean AUTO_SCALE, final double AXIS_WIDTH) {
Axis axis = new Axis(Orientation.VERTICAL, Position.RIGHT);
axis.setMinValue(MIN);
axis.setMaxValue(MAX);
axis.setPrefWidth(AXIS_WIDTH);
axis.setAutoScale(AUTO_SCALE);
AnchorPane.setRightAnchor(axis, 0d);
AnchorPane.setTopAnchor(axis, 0d);
AnchorPane.setBottomAnchor(axis, AXIS_WIDTH);
return axis;
}
private Axis createBottomXAxis(final double MIN, final double MAX, final boolean AUTO_SCALE, final double AXIS_WIDTH) {
Axis axis = new Axis(Orientation.HORIZONTAL, Position.BOTTOM);
axis.setMinValue(MIN);
axis.setMaxValue(MAX);
axis.setPrefHeight(AXIS_WIDTH);
axis.setAutoScale(AUTO_SCALE);
AnchorPane.setBottomAnchor(axis, 0d);
AnchorPane.setLeftAnchor(axis, AXIS_WIDTH);
AnchorPane.setRightAnchor(axis, AXIS_WIDTH);
return axis;
}
private Axis createCenterXAxis(final double MIN, final double MAX, final boolean AUTO_SCALE, final double AXIS_WIDTH) {
Axis axis = new Axis(Orientation.HORIZONTAL, Position.CENTER);
axis.setMinValue(MIN);
axis.setMaxValue(MAX);
axis.setPrefHeight(AXIS_WIDTH);
axis.setAutoScale(AUTO_SCALE);
AnchorPane.setBottomAnchor(axis, axis.getZeroPosition());
AnchorPane.setLeftAnchor(axis, AXIS_WIDTH);
AnchorPane.setRightAnchor(axis, AXIS_WIDTH);
return axis;
}
private Axis createTopXAxis(final double MIN, final double MAX, final boolean AUTO_SCALE, final double AXIS_WIDTH) {
Axis axis = new Axis(Orientation.HORIZONTAL, Position.TOP);
axis.setMinValue(MIN);
axis.setMaxValue(MAX);
axis.setPrefHeight(AXIS_WIDTH);
axis.setAutoScale(AUTO_SCALE);
AnchorPane.setTopAnchor(axis, AXIS_WIDTH);
AnchorPane.setLeftAnchor(axis, AXIS_WIDTH);
AnchorPane.setRightAnchor(axis, AXIS_WIDTH);
return axis;
}
public static void main(String[] args) {
launch(args);
}
}`
Hi there, I‘m currently on vacation but will take a look at it when back home
