Eclipse Community Forums: GEF » GEF5 Problem Setting Graph Background

Home » Eclipse Projects » GEF » GEF5 Problem Setting Graph Background(I'm unable to set the graph background color, nor the background image.)

GEF5 Problem Setting Graph Background [message #1790408]

Sat, 09 June 2018 15:15

Eclipse User

Similar to a problem from GEF3 from several years ago (see https://www.eclipse.org/forums/index.php?t=msg&th=162068&goto=512362&#msg_512362), I'm having trouble setting the graph background with GEF5 to anything but the default white. I'm using the JFace approach (Zest FX), and so I have a custom label provider that implements IGraphAttributesProvider. Therefore, I have an overridden method getGraphAttributes().

Here's what it looks like:

@overrride
public Map<String, Object> getGraphAttributes() {
Map<String, Object> graphAttributes = new HashMap<>();

graphAttributes.put(IAttributeStore.ATTRIBUTES_PROPERTY, "-fx-background-color:green;");
return graphAttributes;
}

So, I've tried "-fx-background:green;" as well as "-fx-background-image:url('file:///home/fenbers/myImage.png');" but nothing seems to work. I *did* add a println(); statement to verify that this getGraphAttributes() method is even being called. It is.

What am I doing wrong?
Mark

Re: GEF5 Problem Setting Graph Background [message #1790410 is a reply to message #1790408]

Sat, 09 June 2018 15:54

Eclipse User

Setting the graph background color is already supported by the GEF DOT component: https://bugs.eclipse.org/bugs/show_bug.cgi?id=521327
This feature has been implemented by the following commit: https://github.com/eclipse/gef/commit/b49855111062c37b0f437467a729108d7bf70f9b
Feel free to analyze that solution and adapt it to your particular use case.

Re: GEF5 Problem Setting Graph Background [message #1790424 is a reply to message #1790410]

Sun, 10 June 2018 07:24

Eclipse User

Great that this supports color now, but I need an image as my background (a map, actually, so the nodes can be placed strategically). Does the bgcolor option support transparency, so that I can set the image in the shell, and have the graph *not* paint over it?
Mark

Re: GEF5 Problem Setting Graph Background [message #1790461 is a reply to message #1790424]

Mon, 11 June 2018 08:03

Eclipse User

Hi Mark,

judging from the code snippet, I suspect that you did not take a look at the documentation, which you can find online at https://github.com/eclipse/gef/wiki/Zest#zestfxjface, and which explains usage of ZestContentProvider, IGraphContentProvider, and IGraphAttributesProvider in 15 short sentences.

I quote the important part for you: "Further, the label provider may implement IGraphAttributesProvider, which allows to provide values for all specified ZestProperties for graphs, nodes and edges, via which the visualization can be controlled even more fine-grained."

And one more: There are examples for how to use Zest.JFace: https://github.com/eclipse/gef/blob/master/org.eclipse.gef.zest.examples.jface/src/org/eclipse/gef/zest/examples/jface/JFaceEdgeDecorationExample.java

"What am I doing wrong?"
- You did not read the documentation.
- You did not look at examples.
- You did not read the javadoc.
- So, where did you take the information from that made you think you are doing anything right?

"Does the bgcolor option support transparency, so that I can set the image in the shell, and have the graph *not* paint over it?"
- Did you try to "set the image in the shell"?
- Did you check if the default background color might be transparent already?
- What did you try?

Best regards,
Matthias

[Updated on: Mon, 11 June 2018 10:42] by Moderator

Re: GEF5 Problem Setting Graph Background [message #1790492 is a reply to message #1790461]

Mon, 11 June 2018 15:05

Eclipse User

Matthias, I know you are trying to be helpful, but I didn't post all this information initially because I didn't see how it was relevant. But to answer your questions, Yes, I *did* read (and studied) https://github.com/eclipse/gef/wiki/Zest#zestfxjface numerous times as I've been trying to resolve this issue over the past couple of weeks. And my code DOES make use of a LabelProvider in which I've @overridden the methods in IGraphAttributesProvider to return customized attributes for Node and Edges, but for the Graph, there are no ZestProperties that pertain to it other than the layout algorithm, so I used IAttributesStore.ATTRIBUTES_PROPERTY instead to set CSS strings like this: "-fx-background:green;" and "-fx-bgcolor:green;" and "-fx-background-color:green;" and even my ultimate goal of an image, with "-fx-background-image:url('file:///home/fenbers/topology.png');". But all these did nothing to change the default (white) graph background, though I am successful in customizing my nodes and edges in various ways.

Furthermore, I've incorporated the example from https://github.com/eclipse/gef/blob/master/org.eclipse.gef.zest.examples.jface/src/org/eclipse/gef/zest/examples/jface/JFaceEdgeDecorationExample.java and similar examples into my code, except that I actually return a populated Map<> from getGraphAttributes instead of the Collections,emptyMap() used in the example.

So, I *did* read the documentation, *did* look at and use the examples, and *did* read all the Javadoc. Though, most of my googling was rather confusing because of the mix of GEF3 vs GEF4 vs GEF5 instructions, which are drastically different. Also, there is the JFace approach vs non-JFace approach, so the learning curve is quite steep.

And, yes, I *did* set the image in a shell and also the background color in the shell, and determined that the Graph background is NOT already transparent. When I stretch the Shell window, I can briefly see the background color that I set it to a microsecond before the Graph repaints itself.

So... what *else* am I doing wrong?
Mark

Re: GEF5 Problem Setting Graph Background [message #1790606 is a reply to message #1790492]

Wed, 13 June 2018 09:03

Eclipse User

Hi Mark,

I was upset, because I did not see the efforts behind your opening post. Nonetheless, I should have been more helpful and I want to apologise for my behaviour.

So, we should really enhance the documentation, because it does not make sense to put attributes in these maps (graph-attributes, node-attributes, edge-attributes) that are not present in ZestProperties.

As you already figured, only the layout algorithm attribute is supported for graphs. Therefore, the default Zest capabilities do not allow colouring the background or displaying a background image. Moreover, the JavaFX CSS styling cannot be set via these attributes (with the exception of shape style, curve style, etc.).

Fortunately, you do have multiple options for colouring the background, as well as for displaying an image in the background.

The easiest way IMHO would be to subclass GraphPart and do the customisation there. Then, you can directly manipulate the JavaFX visual that surrounds all graph nodes and edges. An alternative might be to subclass RootPart or InfiniteCanvasViewer and style/influence the JavaFX visuals there.

Other than JavaFX CSS, you can also add an ImageView (or more complex JavaFX visuals) to the GraphPart's Group in order to render the background image.

By default, the GraphPart does not paint its background, so when you paint an image behind it, that should already work. However, the shell is not the right place to put the image since then you are in SWT world. Within SWT, there is FXCanvas that maintains a JavaFX Scene. Within that Scene there is an InfiniteCanvas that fills the whole FXCanvas, the InfiniteCanvas is controlled by the InfiniteCanvasViewer. Inside that InfiniteCanvas there are layers for content, feedback, and handles, which are controlled by the RootPart. Within the content layer, you will find the visual for the graph, controlled by the GraphPart. Etc.

You can subclass any of the JavaFX/GEF parts in this setup, i.e. FXCanvas, Viewer, RootPart, GraphPart, etc.. But you need to ensure that your custom subclass is used (via binding, exchanging factories, etc.).

Best regards,
Matthias

[Updated on: Wed, 13 June 2018 09:20] by Moderator

Re: GEF5 Problem Setting Graph Background [message #1790708 is a reply to message #1790606]

Thu, 14 June 2018 13:35

Eclipse User

Matthias, when you mentioned your ideas with GraphPart, the gears in my brain started turning in a different direction. I didn't subclass anything, but got it to work with very little code.

This may not be the perfect solution, but it works!

In my LabelProvider, which implements IGraphAttributesProvider(), I need to override the getGraphAttributes() method.

So for now, the following code to set the background is in this method, though it probably doesn't need to be. I'll move it later. Here is the code that does the trick.

for(IVisualPart<? extends javafx.scene.Node> v : MyZestContentViewer.getContentViewer().getVisualPartMap().values())
  if(v instanceof GraphPart) {
    GraphPart gp = (GraphPart) v;
    gp.getViewer().getCanvas.getScene().getRoot().setStyle("-fx-background-image:url('file:///home/oper/topologyBasemap.jpeg')");
  }

Thanks for the help!
Mark

Re: GEF5 Problem Setting Graph Background [message #1790709 is a reply to message #1790606]

Thu, 14 June 2018 13:35

Eclipse User

for(IVisualPart<? extends javafx.scene.Node> v : MyZestContentViewer.getContentViewer().getVisualPartMap().values())
  if(v instanceof GraphPart) {
    GraphPart gp = (GraphPart) v;
    gp.getViewer().getCanvas.getScene().getRoot().setStyle("-fx-background-image:url('file:///home/oper/topologyBasemap.jpeg')");
  }

Thanks for the help!
Mark

Re: GEF5 Problem Setting Graph Background [message #1791449 is a reply to message #1790709]

Fri, 29 June 2018 10:51

Eclipse User

Hi Mark,

you should really rewrite that code as follows:

MyZestContentViewer.getContentViewer().getCanvas().getScene().getRoot().setStyle(...);

I guess it is okay to have such code in getGraphAttributes(), but personally, I would try to put it into a ZestContentViewer subclass.

edit: Maybe you could even drop getRoot().

Best regards,
Matthias

[Updated on: Fri, 29 June 2018 10:53] by Moderator

Re: GEF5 Problem Setting Graph Background [message #1791461 is a reply to message #1791449]

Fri, 29 June 2018 15:10

Eclipse User

Yes, your suggestion is more efficient! (It eliminates the loop.) Thanks for the tip!
Mark

Re: GEF5 Problem Setting Graph Background [message #1804029 is a reply to message #1791461]

Sat, 16 March 2019 04:13

Eclipse User

I created a bugzilla https://bugs.eclipse.org/bugs/show_bug.cgi?id=545465 to extend the Zest API to provide background color/background image support for graphs.

Previous Topic:	GEF5 Moving anchorage of anchored Connections performances
Next Topic:	Calling the doRefreshVisual Method

Goto Forum:

-=] Back to Top [=-

Current Time: Wed May 07 06:51:29 EDT 2025

.:: Contact :: Home ::.

Breadcrumbs

Sign up to our Newsletter