We Keep Coding

JavaFx Charts highlight entire curve on hover

I am using a logarithmic scale for a graph and I want to be able to make the individual curves a little wider when hovered over and on top of all the other curves as well as the color key's value too. Below is a picture better illustrating what I want to do (with sensitive data redacted)
Is something like this even possible? And if so what direction should I move in to achieve this?

The first of your cases, which is applying the visual changes when the mouse hovers over the curve, is possible by modifying the Node that represents the Series on the chart, which is a Path. You can apply the changes to the stroke of the Path making it darker, wider and bringing in to the front when the mouse enters and reverting them when the mouse leaves
The second, which is applying the visual changes when hovering over the legend items is still possible but it's not as clean a solution, at least it's not in my implementation below. With a Node lookup you can get the items and cast them to either a Label or a LegendItem which expose the graphic and text. I chose Label to avoid using the internal API
See more here: It is a bad practice to use Sun's proprietary Java classes?
With String comparisons between the legend text and series names you can associate the two assuming each series has a name and that it is unique. If it isn't unique you could compare the stroke fills as well as the names
Important: These assumptions limit this approach and so if possible I'd avoid it
SSCCE:
public class DarkerSeriesOnHoverExample extends Application {
#SuppressWarnings("unchecked")
#Override
public void start(Stage primaryStage) throws Exception {
//LogarithmicNumberAxis source: https://stackoverflow.com/a/22424519/5556314
LineChart lineChart = new LineChart(new LogarithmicNumberAxis(1, 1000000), new NumberAxis(0, 2.25, 0.25));
lineChart.setCreateSymbols(false);
//Values guessed from the screen shot
ObservableList<XYChart.Data> seriesData = FXCollections.observableArrayList(new XYChart.Data(1, 2),
new XYChart.Data(10, 2), new XYChart.Data(100, 2), new XYChart.Data(1000, 1.85),
new XYChart.Data(10000, 1.50), new XYChart.Data(100000, 1.20), new XYChart.Data(1000000, 0.9));
ObservableList<XYChart.Data> series2Data = FXCollections.observableArrayList(new XYChart.Data(1, 2),
new XYChart.Data(10, 2), new XYChart.Data(100, 2), new XYChart.Data(1000, 1.60),
new XYChart.Data(10000, 1.25), new XYChart.Data(100000, 0.95), new XYChart.Data(1000000, 0.65));
ObservableList<XYChart.Data> series3Data = FXCollections.observableArrayList(new XYChart.Data(1, 2),
new XYChart.Data(10, 1.85), new XYChart.Data(100, 1.55), new XYChart.Data(1000, 1),
new XYChart.Data(10000, 0.65), new XYChart.Data(100000, 0.5), new XYChart.Data(1000000, 0.45));
ObservableList<XYChart.Series> displayedSeries = FXCollections.observableArrayList(
new XYChart.Series("Series 1", seriesData), new XYChart.Series("Series 2", series2Data),
new XYChart.Series("Series 3", series3Data));
lineChart.getData().addAll(displayedSeries);
Scene scene = new Scene(lineChart, 300, 300);
primaryStage.setScene(scene);
primaryStage.show();
darkenSeriesOnHover(displayedSeries); //Setup for hovering on series (cleaner)
darkenSeriesOnLegendHover(lineChart); //Setup both hovering on series and legend (messier)
}
private void darkenSeriesOnHover(List<XYChart.Series> seriesList){
for(XYChart.Series series : seriesList){
Node seriesNode = series.getNode();
//seriesNode will be null if this method is called before the scene CSS has been applied
if(seriesNode != null && seriesNode instanceof Path){
Path seriesPath = (Path) seriesNode;
Color initialStrokeColor = (Color)seriesPath.getStroke();
double initialStrokeWidth = seriesPath.getStrokeWidth();
seriesPath.setOnMouseEntered(event -> {
updatePath(seriesPath, initialStrokeColor.darker(), initialStrokeWidth*2, true);
});
seriesPath.setOnMouseExited(event -> {
//Reset
updatePath(seriesPath, initialStrokeColor, initialStrokeWidth, false);
});
}
}
}
private void darkenSeriesOnLegendHover(LineChart lineChart){
Set<Node> legendItems = lineChart.lookupAll("Label.chart-legend-item");
List<XYChart.Series> seriesList = lineChart.getData();
//Will be empty if this method is called before the scene CSS has been applied
if(legendItems.isEmpty()){ return; }
for(Node legendItem : legendItems){
Label legend = (Label) legendItem;
XYChart.Series matchingSeries = getMatchingSeriesByName(seriesList, legend.getText());
if(matchingSeries == null){ return; }
Node seriesNode = matchingSeries.getNode();
//seriesNode will be null if this method is called before the scene CSS has been applied
if(seriesNode != null && seriesNode instanceof Path){
Path seriesPath = (Path) seriesNode;
Color initialStrokeColor = (Color)seriesPath.getStroke();
double initialStrokeWidth = seriesPath.getStrokeWidth();
legendItem.setOnMouseEntered(event -> {
updatePath(seriesPath, initialStrokeColor.darker(), initialStrokeWidth*2, true);
});
legendItem.setOnMouseExited(event -> {
//Reset
updatePath(seriesPath, initialStrokeColor, initialStrokeWidth, false);
});
seriesPath.setOnMouseEntered(event -> {
updatePath(seriesPath, initialStrokeColor.darker(), initialStrokeWidth*2, true);
});
seriesPath.setOnMouseExited(event -> {
//Reset
updatePath(seriesPath, initialStrokeColor, initialStrokeWidth, false);
});
}
}
}
private void updatePath(Path seriesPath, Paint strokeColor, double strokeWidth, boolean toFront){
seriesPath.setStroke(strokeColor);
seriesPath.setStrokeWidth(strokeWidth);
if(!toFront){ return; }
seriesPath.toFront();
}
private XYChart.Series getMatchingSeriesByName(List<XYChart.Series> seriesList, String searchParam){
for (XYChart.Series series : seriesList){
if(series.getName().equals(searchParam)){
return series;
}
}
return null;
}
}
Output:
Before vs Hover

Using JAVAFX how would i make a label show numbers incrementing when i click a button

FeathersPerSec fps = new FeathersPerSec();
public void start(Stage primaryStage)
{
double getFeathers = fps.getNumOfFeathers();
//double setFeathers = fps.setNumOfFeathers(1);
double click = 1;
GridPane pane = new GridPane();
Image image = new Image("dancingChicken.gif");
Button chickenClick = new Button();
Label feathers = new Label("FPS " + click);
chickenClick.setGraphic(new ImageView(image));
chickenClick.setOnAction((e) -> {
click++;
feathers = new Label("FPS" + click);
});
heres a pieceof my program, im trying to make a cookie clicker type game. except with a chicken and feathers. Im trying to make it so when the user clicks the image button the number of feathers will increment by one. Im not sure what I should put in the setOnAction. with my current set up I keep getting a "Local Variable feathers defined in an enclosing scope must be final or effectively final."

You need to update the text of the current label, instead of creating a new label (which isn't part of your scene graph).
Additionally, you can't change a local variable inside a lambda expression (local variables accessed in a lambda expression must be final or effectively final (meaning they can only be assigned a value once)). The simplest fix for this is to move click to an instance variable:
private FeathersPerSec fps = new FeathersPerSec();
private double click ;
public void start(Stage primaryStage)
{
double getFeathers = fps.getNumOfFeathers();
//double setFeathers = fps.setNumOfFeathers(1);
click = 1;
GridPane pane = new GridPane();
Image image = new Image("dancingChicken.gif");
Button chickenClick = new Button();
Label feathers = new Label("FPS " + click);
chickenClick.setGraphic(new ImageView(image));
chickenClick.setOnAction((e) -> {
click++;
feathers.setText("FPS" + click);
});
}

Get Multiple Results from Custom Dialog -- JavaFX

I've got a little problem with my JavaFX code. I'm sure you all know that you can get the input from a TextInputDialog with an Optional< String > and .showAndWait(). But what should I do when I have a custom dialog with multiple TextFields and a ChoiceBox? How do I get the results from all of them when clicking OK? I thought about a List<String> but I didn't manage to do it..
Code (Custom Dialog):
public class ImageEffectInputDialog extends Dialog {
private ButtonType apply = new ButtonType("Apply", ButtonBar.ButtonData.OK_DONE);
private ButtonType cancel = new ButtonType("Cancel", ButtonBar.ButtonData.CANCEL_CLOSE);
public ImageEffectInputDialog(String title) {
setTitle(title);
setHeaderText(null);
GridPane dPane = new GridPane();
Label offsetX = new Label("Offset X: ");
Label offsetY = new Label("Offset Y: ");
Label color = new Label("Shadow Color: ");
TextField offsetXText = new TextField();
TextField offsetYText = new TextField();
ChoiceBox<String> shadowColors = new ChoiceBox<>();
shadowColors.getItems().add(0, "Black");
shadowColors.getItems().add(1, "White");
dPane.setHgap(7D);
dPane.setVgap(8D);
GridPane.setConstraints(offsetX, 0, 0);
GridPane.setConstraints(offsetY, 0, 1);
GridPane.setConstraints(offsetXText, 1, 0);
GridPane.setConstraints(offsetYText, 1, 1);
GridPane.setConstraints(color, 0, 2);
GridPane.setConstraints(shadowColors, 1, 2);
dPane.getChildren().addAll(offsetX, offsetY, color, offsetXText, offsetYText, shadowColors);
getDialogPane().getButtonTypes().addAll(apply, cancel);
getDialogPane().setContent(dPane);
}
}
Code (where I want the results)
if(scrollPane.getContent() != null && scrollPane.getContent() instanceof ImageView) {
// ImageEffectUtil.addDropShadow((ImageView) scrollPane.getContent());
ImageEffectInputDialog drop = new ImageEffectInputDialog("Drop Shadow");
//Want the Results here..
}
I hope someone might be able to help.

First of all, in order to obtain different values of different types (generic solution) just define a new data structure, say Result, which contains fields like offsetX, offsetY and whatever else you need. Next, extend Dialog<Result> instead of just Dialog. Finally, in the constructor of your ImageEffectInputDialog you need to set result converter, as follows:
setResultConverter(button -> {
// here you can also check what button was pressed
// and return things accordingly
return new Result(offsetXText.getText(), offsetYText.getText());
});
Now wherever you need to use the dialog, you can do:
ImageEffectInputDialog dialog = new ImageEffectInputDialog("Title");
dialog.showAndWait().ifPresent(result -> {
// do something with result object, which is of type Result
});

java awt color chooser does't show in proper way in JavaFx

#FXML
Private void handleItemBackAction(ActionEvent eve)
{
java.awt.Color color=JColorChooser.showDialog(null,"Select a color",java.awt.Color.CYAN);
String hex = Integer.toHexString(color.getRGB() & 0xffffff);
hex="#"+hex;
Text.setText(hex);
ShortcutButton.setStyle("-fx-background-color: " + hex + ";");
}
When I run this window and click on button at first time color chooser goes behind my actual pane.
When I click on button second time while running it shows at top of all other pane which is correct and so on it works properly.
Then why color chooser not shows in front first time on button click?

The first argument to JColorChooser.showDialog is the parent component of the dialog. You told that method to show the dialog with no parent, so it doesn't know about your other windows.
Instead of using JColorChooser.showDialog, you'll need to embed a JColorChooser instance inside a JavaFX dialog or window:
JColorChooser colorChooser = new JColorChooser(java.awt.Color.CYAN);
SwingNode colorChooserNode = new SwingNode();
colorChooserNode.setContent(colorChooser);
Alert dialog = new Alert(Alert.AlertType.NONE);
// Guarantees dialog will be above (and will block input to) mainStage.
dialog.initOwner(mainStage);
dialog.setTitle("Select a color");
dialog.getDialogPane().setContent(colorChooserNode);
dialog.getDialogPane().getButtonTypes().setAll(
ButtonType.OK, ButtonType.CANCEL);
Optional<ButtonType> response = dialog.showAndWait();
if (response.filter(r -> r == ButtonType.OK).isPresent()) {
int rgb = colorChooser.getColor().getRGB();
String hex = String.format("#%06x", rgb & 0xffffff);
Text.setText(hex);
ShortcutButton.setBackground(new Background(
new BackgroundFill(Color.valueOf(hex), null, null)));
} else {
System.out.println("User canceled");
}
Of course, you're probably better off using ColorPicker in your main window, so you don't have to create an explicit dialog at all:
final ColorPicker colorPicker = new ColorPicker(Color.CYAN);
colorPicker.setOnAction(e -> {
Color color = colorPicker.getValue();
String hex = String.format("#%02x02x02x",
(int) (color.getRed() * 255),
(int) (color.getGreen() * 255),
(int) (color.getBlue() * 255));
Text.setText(hex);
ShortcutButton.setBackground(
new Background(new BackgroundFill(color, null, null)));
});
myLayoutPane.getChildren().add(colorPicker);
As an aside, Java variable names should always start with a lowercase letter, to make them easy to distinguish from class names. Consider changing Text to text, and ShortcutButton to shortcutButton.

How to display frame only when required & set frame to appear on top all the time?

My program will alert users when data (stock name & price) in the database matches with the data (stock name and price) from Yahoo Finance. With the help of HarryJoy i'm able to implement a pop up notification.
Problem is the pop up location on the screen is based on the database loop (int db). The frame will pop even if data doesn't match.
How can I set a counter or some method to pop up the frame only when database data = Yahoo Finance data? Also, my notification panels appears to be behind the main frame. How can make the panels appear on top of my main frame?
I hope I've given enough information, please ask if still unclear. Any guidance will be appreciated! Thanks!
In the database (using code sample only to display my explanation in order, source code below).
Object 1 = match
Object 2 = doesn't match (hence there's a gap)
Object 3 = match
Object 4 = match
Screenshot:
Code:
for (int db=0; db<= rowCount; db++)
{
Object popSymbol = table.getModel().getValueAt(db, 0);
String popupSymbol = popSymbol.toString();
Object popValue = table.getModel().getValueAt(db, 1);
String str = popValue.toString();
double popStockValue = Double.valueOf(str).doubleValue();
String stockNameDB = popupSymbol;
StockPara stock = YahooStock.getInstance().getStockPrice(stockNameDB);
double stockPriceDB = Math.round(stock.getPrice());
final JFrame popUpFrame;
final JPanel popupPanel;
if (stockPriceDB == popStockValue)
{
String header = "Stock: " + stock.getTicker() + " is now # " + stock.getPrice();
String message = "";
popUpFrame = new JFrame();
popUpFrame.setSize(320,90);
popUpFrame.setUndecorated(true);
popUpFrame.getContentPane().setLayout(null);
popupPanel = new JPanel();
popupPanel.setBorder(new LineBorder(new Color(0, 0, 0)));
popupPanel.setBounds(0, 0, 320, 90);
getContentPane().add(popupPanel);
popupPanel.setBackground(new Color(255, 255, 224));
popupPanel.setLayout(null);
popUpFrame.add(popupPanel);
// Other labels, images, etc.
Dimension screenSize = Toolkit.getDefaultToolkit().getScreenSize();
Insets toolHeight = Toolkit.getDefaultToolkit().getScreenInsets(popUpFrame.getGraphicsConfiguration());
popUpFrame.setLocation(screenSize.width - popUpFrame.getWidth(), screenSize.height - toolHeight.bottom - (popUpFrame.getHeight() * (db+1)));
}
}

To solve your issue quickly, simply create an additional counter (int counter = 0;). Then use that counter instead of db to position your popUpFrame and right after that increment counter.
int counter = 0; // Initiate outside de loop
...
for(int db=0; db<= rowCount; db++) {
...
if (stockPriceDB == popStockValue) {
...
popUpFrame.setLocation(screenSize.width - popUpFrame.getWidth(),
screenSize.height - toolHeight.bottom - (popUpFrame.getHeight() * (counter+1)));
counter++;
}
}
To bring your frame to the front use:
popUpFrame.toFront()
and to force it to be always on top (although I would really not recommend that because it is more annoying for the user than anything else):
popUpFrame.setAlwaysOnTop(true);
This is not necessarily supported by all platforms.

for on top issue, use
notificationPanel.requestFocus();