I have the following problem when using any JavaFX Chart:
I dynamically add data to the chart and only the last X-Axis label shows up.
I already noticed that the chart is displayed fine when animations are disabled.
XYChart.Series<String,Double> series1= new Series<String, Double>();
series1.setName(scenario1.getName());
XYChart.Series<String,Double> series2= new Series<String, Double>();
series2.setName(scenario2.getName());
for(int period = 0; period < config1.getPeriods(); period++){
series1.getData().add(new Data<String, Double>("Period "+(period+1), rmList1.get(0).getCashflowsPerPeriod(config1)[period]));
System.out.println("Series1: "+rmList1.get(0).getCashflowsPerPeriod(config1)[period]);
}
for(int period = 0; period < config2.getPeriods(); period++){
series2.getData().add(new Data<String, Double>("Period "+(period+1), rmList2.get(0).getCashflowsPerPeriod(config2)[period]));
System.out.println("Series2: "+rmList2.get(0).getCashflowsPerPeriod(config2)[period]);
}
sacCashflows.getData().addAll(series1,series2);
Can you help me out here?
Thank you!
Disabling the animation worked for me.
sacCashflows.setAnimated(false);
I know you said in the comments that you had already tried that and it hadn't worked, but maybe for someone else having the same problem it will.
change your code like this
xAxis1.setAnimated(false);
yAxis1.setAnimated(true);
barChart.setAnimated(true);
Let's try with sample code (JavaFX-8-b40):
#Override
public void start( Stage stage )
{
CategoryAxis xAxis = new CategoryAxis();
NumberAxis yAxis = new NumberAxis();
AreaChart<String, Number> sacCashflows = new AreaChart<>( xAxis, yAxis );
Button b = new Button( "Add" );
b.setOnAction( new EventHandler<ActionEvent>()
{
#Override
public void handle( ActionEvent event )
{
XYChart.Series<String, Number> series1 = new XYChart.Series<>();
series1.setName( "series1" );
XYChart.Series<String, Number> series2 = new XYChart.Series<>();
series2.setName( "series2" );
for ( int period = 0; period < 10; period++ )
{
series1.getData().add( new XYChart.Data<>( "Period " + (period + 1), 5.0 * period ) );
}
for ( int period = 0; period < 5; period++ )
{
series2.getData().add( new XYChart.Data<>( "Period " + (period + 1), 10.0 * period ) );
}
sacCashflows.getData().addAll( series1, series2 );
}
} );
final Scene scene = new Scene( new VBox( sacCashflows, b ), 400, 300 );
stage.setScene( scene );
stage.show();
}
Here is a quick-n-dirty fix for this bug:
chartVariable.getData().add(new XYChart.Series(FXCollections.observableArrayList(new XYChart.Data("",0))));
chartVariable.getData().clear();
While initializing the chart, add fake data and then remove it. This works because the bug gets resolved after the first update/change to the chart. Setting animation to false also works, but I like the animations.
Related
I'm currently writing a CAD-like program for logic circuits (it's my first "graphics intensive" program ever). When I place a component on the schematic, let say an AND gate (which is Region class at its root), I want to be able to interact with it (select it, change its properties, etc). So far, so good. I can click on it and everything go well. However, if I click outside of it, the mouse click event still show the component as it source(!).
Digging a bit further, I put some traces in the mouse click handler and found out that getBoundsInLocal() and getBoundsInParent() return bounds that are around 50% larger than it should be. The getLayoutBounds(), getWidth() and getHeight() do return the correct value.
The pane onto which the components are laid out is a simple Pane object, but it uses setScaleX() and setScaleY() to implement zooming capabilities. I did try to disable them, with no luck.
public abstract class SchematicComponent
extends Region {
private Shape graphicShape = null;
public Shape getGraphicShape() {
if( isShapeDirty() ) {
if( graphicShape != null ) {
getChildren().remove( graphicShape );
}
graphicShape = createShape();
markShapeDirty( false );
if( graphicShape != null ) {
getChildren().add( graphicShape );
}
}
return graphicShape;
}
abstract protected Shape createShape();
}
abstract public class CircuitComponent
extends SchematicComponent {
}
abstract public class LogicGate
extends CircuitComponent {
#Override
protected void layoutChildren() {
super.layoutChildren();
Pin outPin;
final double inputLength = getInputPinsMaxLength();
// Layout the component around its center.
// NOTE: I did try to set the center offset to 0 with no luck.
Point2D centerOffset = getCenterPointOffset().multiply( -1 );
Shape gateShape = getGraphicShape();
if( gateShape != null ) {
gateShape.setLayoutX( centerOffset.getX() + inputLength );
gateShape.setLayoutY( centerOffset.getY() );
}
/* Layout the output pins. */
outPin = getOutputPin();
if( outPin != null ) {
outPin.layout();
outPin.setLayoutX( centerOffset.getX() + getWidth() );
outPin.setLayoutY( centerOffset.getY() + getHeight() / 2 );
}
/* Compute the first input pin location and the gap between each
pins */
double pinGap = 2;
double y;
if( getInputPins().size() == 2 ) {
y = centerOffset.getY() + getHeight() / 2 - 2;
pinGap = 4;
}
else {
y = centerOffset.getY() + ( getHeight() / 2 ) - getInputPins().size() + 1;
}
/* Layout the input pins */
for( Pin inPin : getInputPins() ) {
inPin.layout();
inPin.layoutXProperty().set( centerOffset.getX() );
inPin.layoutYProperty().set( y );
y += pinGap;
}
}
}
// The actual object placed on the schematic
public class AndGate
extends LogicGate {
#Override
protected double computePrefWidth( double height ) {
// NOTE: computeMin/MaxWidth methods call this one
double width = getSymbolWidth() + getInputPinsMaxLength();
double length = 0;
width += length;
if( getOutputPin().getLength() > 0 ) {
width += getOutputPin().getLength();
}
return width; // Always 16
}
#Override
protected double computePrefHeight( double width ) {
// NOTE: computeMin/MaxHeight methods call this one
return getSymbolHeight() + getExtraHeight(); // Always 10
}
#Override
protected Shape createShape() {
Path shape;
final double extraHeight = getExtraHeight();
final double inputLength = getInputPinsMaxLength();
final double outputLength = getOutputPin().getLength();
/* Width and Height of the symbol itself (i,e, excluding the
input/output pins */
final double width = getWidth() - inputLength - outputLength;
final double height = getHeight() - extraHeight;
/* Starting point */
double startX = 0;
double startY = extraHeight / 2;
ArrayList<PathElement> elements = new ArrayList<>();
elements.add( new MoveTo( startX, startY ) );
elements.add( new HLineTo( startX + ( width / 2 ) ) );
elements.add( new ArcTo( ( width / 2 ), // X radius
height / 2, // Y radius
180, // Angle 180°
startX + ( width / 2 ), // X position
startY + height, // Y position
false, // large arc
true ) ); // sweep
elements.add( new HLineTo( startX ) );
if( extraHeight > 0 ) {
/* The height of the input pins is larger than the height of
the shape so we need to add extra bar on top and bottom of
the shape.
*/
elements.add( new MoveTo( startX, 0 ) );
elements.add( new VLineTo( extraHeight + height ) );
}
else {
elements.add( new VLineTo( startY ) );
}
shape = new Path( elements );
shape.setStroke( getPenColor() );
shape.setStrokeWidth( getPenSize() );
shape.setStrokeLineJoin( StrokeLineJoin.ROUND );
shape.setStrokeLineCap( StrokeLineCap.ROUND );
shape.setFillRule( FillRule.NON_ZERO );
shape.setFill( getFillColor() );
return shape;
}
} // End: LogiGate
// SchematicView is the ScrollPane container that handles the events
public class SchematicView
extends ScrollPane {
/* Mouse handler inner class */
private class MouseEventHandler
implements EventHandler<MouseEvent> {
#Override
public void handle( MouseEvent event ) {
if( event.getEventType() == MouseEvent.MOUSE_CLICKED ) {
processMouseClicked( event );
}
else { /* ... more stuff ... */ }
}
private void processMouseClicked( MouseEvent event ) {
Object node = event.getSource();
SchematicSheet sheet = getSheet();
Bounds local = ( (Node) node ).getLayoutBounds();
Bounds local1 = ( (Node) node ).getBoundsInLocal();
Bounds parent = ( (Node) node ).getBoundsInParent();
// At this point, here is what I get:
// node.getHeight() = 10 -> Good
// local.getHeight() = 10 -> Good
// local1.getHeight() = 15.6499996... -> Not expected!
// parent.getHeight() = 15.6500015... -> Not expected!
/*... More stuff ... */
}
}
So at this point, I'm running of clues of what is going on. Where do these getBoundsInXXX() values come from? They doesn't match with the parent's scale values either. The same goes with getWidth(): I get 24.825000... instead of 16.
Looking at this, I understand why clicking outside the component works as if I clicked on it. Its bounds are about 50% bigger than what it should be.
I googled the damn thing and search some doc for almost 2 days now and I'm still baffled. I think I understand that getBoundsInXXX() methods do their own computation but could it be off by that much? I don't thing so. My best guess is that it is something inside the createShape() method but I just can't figure what it is.
Anyone has a clue of what is going on?
Many thanks for your help.
P.S.: This is my first post here, so hopefully I did it right ;)
I think I finally found the problem :)
Basically, the Pin custom shape was drawn in the negative part of X axis (wrong calculations, my bad!). My best guess is that somehow, Java notices that I drew outside the standard bounds and then added the extra space used to the bounds, hence, adding 50% to width, which matches the length of the Pin. Drawing it in the positive region seem to have fixed the problem.
I'm not 100% sure if that is the right answer, but it make sense and it is now working has expected.
A little introduction: I've created a simple (for now) application which uses an AnimationTimer to update animations and draw objects to the Canvas. Everything runs smoothly and the timer adjusts its fps to the refresh-rate of my laptop (50/60Hz).
When I start the program however, there seems to be something wrong which causes my animations to appear 'jurky' or dropping frames, but the framerate stays a solid 60/50fps. Then when I resize the window for the first time (no difference how many), suddenly all the animations are super-smooth. After that, everything stays 'synced' no matter the resizes done.
What is the reason that the AnimationTimerstarts 'out-of-sync' until the window is resized and can it be prevented?
Update
Added a code example. The problem is mostly visible when on 50Hz, but also exist on 60Hz. Using Eclipse on Windows 10 (first code-share, may be to much/missing things).
public void start(Stage primaryStage) {
try {
pane = new Pane();
drawables = new ArrayList<>();
canvas = new Canvas(400,400);
canvas.widthProperty().bind(pane.widthProperty());
canvas.heightProperty().bind(pane.heightProperty());
GraphicsContext g = canvas.getGraphicsContext2D();
SimpleAnimatedCircle circle = new SimpleAnimatedCircle(20);
circle.setX(100);
circle.setY(50);
timer = new AnimationTimer() {
#Override
public void handle(long now) {
frameCount++;
if (System.currentTimeMillis() > frameStart + 500) {
System.out.println("FPS: " + frameCount*2);
frameStart = System.currentTimeMillis();
frameCount = 0;
}
for (Drawable drawable:drawables) {
drawable.update();
}
g.setFill(Color.DARKSLATEBLUE);
g.fillRect(0, 0, canvas.getWidth(), canvas.getHeight());
circle.draw(g);
}
};
timer.start();
canvas.setOnMouseClicked((e) -> {
circle.start();
});
pane.getChildren().add(canvas);
Scene scene = new Scene(pane,400,400);
primaryStage.setScene(scene);
primaryStage.show();
} catch(Exception e) {
e.printStackTrace();
}
}
public static class SimpleAnimatedCircle {
double diameter;
double x;
double y;
long startTime;
double diffY = 300; // Animated distance over y-axis.
double duration = 2000; // 2 second duration.
public SimpleAnimatedCircle(double diameter) {
this.diameter = diameter;
}
public void setX(double value) {
x = value;
}
public void setY(double value) {
y = value;
}
public void start() {
startTime = System.currentTimeMillis();
}
public void draw(GraphicsContext g) {
double animatedY = y;
// Update the animation.
if (System.currentTimeMillis() < startTime + duration) {
animatedY = y + (System.currentTimeMillis() - startTime) /
duration * diffY;
}
g.setFill(Color.ORANGE);
g.fillOval(x, animatedY, diameter, diameter);
}
}
I have a problem with the orientation of a node (GridPane) after rotating it with setRotate() in JavaFX. When i rotate the node and put it in a cell of the GridPane, I would like the rotated node to fit inside the cell and also resize with the cell. I added some sample code to show you what I would like the result to be.
public class MonopolyApp extends Application {
#Override
public void start(Stage primaryStage) {
//Construction of the grid
GridPane square = new GridPane();
square.setGridLinesVisible(true);
final int heightPercent = 14;
final int widthPercent = 8;
RowConstraints rowsEdge = new RowConstraints();
rowsEdge.setPercentHeight(heightPercent);
RowConstraints rowsMid = new RowConstraints();
rowsMid.setPercentHeight(widthPercent);
ColumnConstraints colEdge = new ColumnConstraints();
colEdge.setPercentWidth(heightPercent);
ColumnConstraints colMid = new ColumnConstraints();
colMid.setPercentWidth(widthPercent);
square.getColumnConstraints().addAll(colEdge, colMid,
colMid, colMid, colMid, colMid, colMid, colMid, colMid, colMid, colEdge);
square.getRowConstraints().addAll(rowsEdge, rowsMid,
rowsMid,rowsMid,rowsMid,rowsMid,rowsMid,rowsMid, rowsMid,rowsMid, rowsEdge);
GridPane wrongSuare = makeMonopolySquare();
square.add(wrongSuare, 0, 4);
wrongSuare.setRotate(90);
GridPane rightSquare = makeMonopolySquare();
square.add(rightSquare, 1, 10);
Scene s = new Scene(square);
primaryStage.setHeight(500);
primaryStage.setWidth(500);
primaryStage.setScene(s);
primaryStage.show();
}
public static void main(String[] args) {
Application.launch(args);
}
private GridPane makeMonopolySquare(){
GridPane monopolySquare = new GridPane();
RowConstraints top = new RowConstraints();
top.setPercentHeight(20);
RowConstraints bottom = new RowConstraints();
bottom.setPercentHeight(80);
ColumnConstraints c = new ColumnConstraints();
c.setPercentWidth(100);
monopolySquare.getRowConstraints().addAll(top,bottom);
monopolySquare.getColumnConstraints().addAll(c);
bottom.setValignment(VPos.CENTER);
monopolySquare.setGridLinesVisible(true);
Label name = new Label("name");
Pane colorPane = new Pane();
colorPane.setMaxSize(Double.MAX_VALUE, Double.MAX_VALUE);
colorPane.setBackground(new Background( new BackgroundFill(Color.BLUE, null, null)));
GridPane.setMargin(colorPane, new Insets(1));
monopolySquare.add(colorPane,0,0);
monopolySquare.add(name, 0, 1);
return monopolySquare;
}
}
If you run the code you will see that the GridPane at the bottom of the stage perfectly fits it's cell. But the rotated GridPane does not. I will also add a picture to show you what my problem is:
Does anyone know how to solve this? I know that I could put it in a group, but the problem with putting it in a group is that the group would not resize to the cell of the GridPane.
Well, that is a tough one. No optimal solution comes to mind, but if I was in your position, I would try to stay within the confinements of the layout (not use low-level operations like rotation).
For example, build a differently layout cell for each row/column:
private static Node makeMonopolySquare( final Layout layout )
{
final GridPane monopolySquare = new GridPane();
monopolySquare.setGridLinesVisible( true );
final Label label = new Label( "name" );
final StackPane name = new StackPane( label );
final Pane colorPane = new Pane();
GridPane.setMargin( colorPane, new Insets( 1 ) );
colorPane.setMaxSize( Double.MAX_VALUE, Double.MAX_VALUE );
colorPane.setBackground( new Background( new BackgroundFill( Color.BLUE, null, null ) ) );
final RowConstraints top = new RowConstraints();
final RowConstraints bottom = new RowConstraints();
// bottom.setValignment( VPos.CENTER );
// top.setValignment( VPos.CENTER );
final ColumnConstraints c = new ColumnConstraints();
c.setPercentWidth( 100 );
final ColumnConstraints right = new ColumnConstraints();
// right.setHalignment( HPos.CENTER );
final ColumnConstraints left = new ColumnConstraints();
// left.setHalignment( HPos.CENTER );
final RowConstraints r = new RowConstraints();
r.setPercentHeight( 100 );
switch ( layout )
{
case BOTTOM:
top.setPercentHeight( 20 );
bottom.setPercentHeight( 80 );
monopolySquare.getRowConstraints().addAll( top, bottom );
monopolySquare.getColumnConstraints().addAll( c );
monopolySquare.add( colorPane, 0, 0 );
monopolySquare.add( name, 0, 1 );
break;
case LEFT:
right.setPercentWidth( 20 );
left.setPercentWidth( 80 );
monopolySquare.getColumnConstraints().addAll( left, right );
monopolySquare.getRowConstraints().addAll( r );
monopolySquare.add( name, 0, 0 );
monopolySquare.add( colorPane, 1, 0 );
break;
case RIGHT:
right.setPercentWidth( 80 );
left.setPercentWidth( 20 );
monopolySquare.getColumnConstraints().addAll( left, right );
monopolySquare.getRowConstraints().addAll( r );
monopolySquare.add( colorPane, 0, 0 );
monopolySquare.add( name, 1, 0 );
break;
case TOP:
top.setPercentHeight( 80 );
bottom.setPercentHeight( 20 );
monopolySquare.getRowConstraints().addAll( top, bottom );
monopolySquare.getColumnConstraints().addAll( c );
bottom.setValignment( VPos.CENTER );
monopolySquare.add( colorPane, 0, 1 );
monopolySquare.add( name, 0, 0 );
break;
}
This however, will not rotate the label (which, I would argue is better anyways for a digital monopoly board ;) ). As soon as you rotate the label, you get the same problem you had with the cell, only smaller.
The full code example.
I use to create a surface contour of the 3D contour plots.
I have now been drawing contour lines in my 3D figure, this also works wonderfully, but the legend is not displayed why?
code:
private void button1_Click(object sender, EventArgs e)
{
ILArray<float> data = ILSpecialData.sincf(50, 50);
BackgroundWorker bgw = new BackgroundWorker();
bgw.DoWork += bgwCreateProcess_DoWork;
bgw.RunWorkerAsync(data);
}
private void bgwCreateProcess_DoWork(object sender, System.ComponentModel.DoWorkEventArgs e)
{
ILArray<float> data = e.Argument as ILArray<float>;
using (ILScope.Enter())
{
ILScene scene = new ILScene();
ILPlotCube plotCube = new ILPlotCube(twoDMode: false);
plotCube.Rotation = Matrix4.Rotation(new Vector3(1, 0, 0), Math.PI / 2);
ILSurface surface = new ILSurface(data);
List<ContourLevel> conturLevels = new List<ContourLevel>();
conturLevels.Add(new ContourLevel() { Text = "Limit Max", Value = 0.9f, LineWidth = 2 });
conturLevels.Add(new ContourLevel() { Text = "Limit Min", Value = -0.1f, LineWidth = 2 });
conturLevels.Add(new ContourLevel() { Text = "Average", Value = 0.5f, LineWidth = 3 });
ILContourPlot contourPlot = new ILContourPlot(data, conturLevels, create3D: true);
plotCube.Children.Add(contourPlot);
ILLegend legend = new ILLegend();
legend.Location = new PointF(.99f, 0f);
surface.Children.Add(legend);
ILColorbar colorbar = new ILColorbar();
colorbar.Location = new PointF(.99f, 0.4f);
surface.Children.Add(colorbar);
surface.Markable = false;
surface.Fill.Markable = false;
surface.Wireframe.Markable = false;
surface.Wireframe.Visible = true;
surface.UseLighting = false;
plotCube.Add(surface);
scene.Add(plotCube);
ilPanel.Scene = scene;
}
}
This code should be extended to a winform, a ILPanel and a button. Last but the Click event of the button has to be subscribed. Less code is not possible, because otherwise the situation is changed.
Felix, there are several issues in the code. Some of them are related to a bug in ILNumerics which will be fixed in the next version. The following code creates an image like that:
private void button1_Click(object sender, EventArgs e) {
ILArray<float> data = ILSpecialData.sincf(50, 50);
BackgroundWorker bgw = new BackgroundWorker();
bgw.DoWork += bgwCreateProcess_DoWork;
bgw.RunWorkerAsync(data);
}
private void bgwCreateProcess_DoWork(object sender, System.ComponentModel.DoWorkEventArgs e) {
using (ILScope.Enter()) {
ILArray<float> data = e.Argument as ILArray<float>;
ILScene scene = new ILScene();
ILPlotCube plotCube = new ILPlotCube(twoDMode: false);
plotCube.Rotation = Matrix4.Rotation(new Vector3(1, 0, 0), Math.PI / 2);
ILSurface surface = new ILSurface(data);
List<ContourLevel> conturLevels = new List<ContourLevel>();
conturLevels.Add(new ContourLevel() { Text = "Limit Max", Value = 0.9f, LineWidth = 2 });
conturLevels.Add(new ContourLevel() { Text = "Limit Min", Value = -0.1f, LineWidth = 2 });
conturLevels.Add(new ContourLevel() { Text = "Average", Value = 0.5f, LineWidth = 3 });
ILContourPlot contourPlot = new ILContourPlot(data, conturLevels, create3D: true);
plotCube.Add(contourPlot);
ILLegend legend = new ILLegend("one","two","three","four");
legend.Location = new PointF(.99f, 0f);
ILColorbar colorbar = new ILColorbar();
colorbar.Location = new PointF(.99f, 0.4f);
surface.Add(colorbar);
surface.Markable = false;
surface.Fill.Markable = false;
surface.Wireframe.Markable = false;
surface.Wireframe.Visible = true;
surface.UseLighting = false;
plotCube.Add(surface);
surface.Fill.Visible = false;
scene.Add(plotCube);
contourPlot.Add(legend);
legend.Configure(); // only needed in version 3.2.2.0!
scene.Configure();
ilPanel1.Scene = scene;
}
}
Let's step through the code:
As you see, I hided the surface fill color. Otherwise, the labels of the contour plot might get hidden by the surface.
Legends should be added to the plot they are about to describe. I added the legend to the contourplot instead of the surface. However, for some reasons, the legend does not automatically find the contour lines from the contour plot, so...
... I added the legend entries manually in the legend constructor. Here, I just used the strings "one"... "three". You will want to replace that with your own names.
Due to the bug I mentioned, you will have to call legend.Configure() explicitely. This will not be needed after version 3.2.2.0.
You are doing the scene modifications in a background worker thread - which is fine! However, after having finished the configuration, the panel must be signaled to refresh itself. ilPanel.Refresh(), however, requires to be called from the main (GUI-) thread. So I suspect, you could use Control.Invoke() at the end of bgwCreateProcess_DoWork in order to call ilPanel.Refresh(). Otherwise, the changes will not display.
Can the width of the tab-header of a CTabItem be set arbitrary?
Thnx in advance!
Kind regard,
Marcus
You can try to override CTabItem, but this solution doesn't look as nice solution (nevertheless I use it):
CTabItem tabItem;
final int tabWidth = 90;
tabItem = new CTabItem( tabFolder, SWT.NONE ) {
#Override
public Rectangle getBounds( ) {
Rectangle bounds = super.getBounds();
bounds.x = 0 * tabWidth;
bounds.width = tabWidth;
return bounds;
}
};
tabItem.setText( __lang.str( this, "Tab Item I" ) );
tabItem = new CTabItem( tabFolder, SWT.NONE ) {
#Override
public Rectangle getBounds( ) {
Rectangle bounds = super.getBounds();
bounds.x = 1 * tabWidth;
bounds.width = tabWidth;
return bounds;
}
};
tabItem.setText( __lang.str( this, "Tab Item II" ) );
tabItem = new CTabItem( tabFolder, SWT.NONE ) {
#Override
public Rectangle getBounds( ) {
Rectangle bounds = super.getBounds();
bounds.x = 2 * tabWidth;
bounds.width = tabWidth;
return bounds;
}
};
tabItem.setText( __lang.str( this, "Tab Item III" ) );
No you can't do that. Not at least by any exposed API (read public methods).
A possible solution is to extend the code of CTabFolder and CTabItem.
As a workaround, you can pad the title with extra spaces
using String.format like:
cTabItem.setText(String.format("%-15s", orgTitle));
This will add extra spaces to the end of the string if its length is less than 15 characters.
Check this for more details:
https://docs.oracle.com/javase/tutorial/essential/io/formatting.html