0

I loaded my node.csv and edge.csv successfully to AWS Neptune.
I'm trying to display the vertices as an image accordingly to the corresponding label.
For example, there's an edge between 198.51.100.0 & adesai and 198.51.100.0 is also connecting to gramirez.
So, I would like to display a address.png for the IPAddress and a person.png for adesai & gramirez.

I'm using Gremlin lanugage and I have tried below but it's not working.

 %%graph_notebook_vis_options<br>
{<br>
  "nodes":{  "id":"0",   "label": "User", "shape": "circularImage", "image": "person.png"},<br>
  "nodes":{  "id":"1",   "label": "User","shape": "circularImage", "image": "person.png"},<br>
  "nodes":{  "id":"2",   "label": "Restaurant","shape": "circularImage", "image": "restaurant.png"},<br>
  "nodes":{  "id":"3",   "label": "Restaurant","shape": "circularImage", "image": "restaurant.png"},<br>
  "nodes":{  "id":"4",   "label": "IPAddress","shape": "circularImage", "image": "address.png"}<br>
}

The nodes are just showing the same image. Can anyone advise? thank you

Showing the node and the graph

Kelvin Lawrence
  • 14,674
  • 2
  • 16
  • 38
wdatauser
  • 1
  • Have you looked at the examples in the 02-visualization folder? The air route Gremlin example shows how to use custom icons for nodes. – Kelvin Lawrence Nov 12 '21 at 10:54
  • I went ahead and added an answer below. You can also find additional information in the Git repo for the project which is located here: https://github.com/aws/graph-notebook – Kelvin Lawrence Nov 12 '21 at 16:11

1 Answers1

0

Here is an example taken from the Air-Routes-Gremlin sample notebook, that once the notebooks are installed, can be found in the Neptune/02-Visualization folder. The key thing to note is that it needs to be done as part of a group definition. Anything that matches the given group will be drawn using the specified image or icon. You can also find additional information in the Git repo for the project which is located here: https://github.com/aws/graph-notebook

Changing Group Colors and Adding Icons

One of the features that is also available is the ability to change the color, add an image, or associate a particular icon representation for a group. Run the two cells below and you will see that all airports in Mexico are shown with the Mexican flag, all airports in the US are shown as a blue flag, and all airports in Canada are shown in red.

%%graph_notebook_vis_options
{
  "groups": {
      "['CA']": {"color": "red"},
    "['MX']": {"shape": "image", 
               "image":"https://cdn.countryflags.com/thumbs/mexico/flag-round-250.png"},
    
    "['US']": {
      "shape": "icon",
      "icon": {
        "face": "FontAwesome",
        "code": "\uf024",
        "color": "blue"
      }
  }
}
}

EDITED on 2021-11-16

What is not possible today is to group by multiple keys and have multiple icons represent a single vertex

Kelvin Lawrence
  • 14,674
  • 2
  • 16
  • 38