Get Started with the APEX Graph Visualization Plug-in (Oracle Database 23ai)

Get started with the APEX Graph Visualization plug-in in your APEX application on your Autonomous Database instance using Oracle Database 23ai.

Before you begin, ensure that you meet the prerequisites described in Prerequisites for Using the APEX Graph Visualization Plug-in.
  1. Download the Graph Visualization (Preview) plug-in (region_type_plugin_graphviz.sql) from the Oracle APEX GitHub repository.
  2. Sign in to your APEX workspace in your Autonomous Database instance.
  3. Create the DBMS_GVT package in your APEX workspace.
    1. Download the optional-23ai-only/gvt_sqlgraph_to_json.sql file from the Oracle APEX GitHub repository.
    2. Upload and run the gvt_sqlgraph_to_json.sql script in your APEX workspace (see Uploading a SQL Script).
  4. Import the downloaded plug-in script (region_type_plugin_graphviz.sql) file into your target APEX application (see Importing Plug-ins).
  5. Implement the plug-in in an application page to perform various graph visualizations.

    The following basic example describes the steps to visualize a graph existing in your database using the Graph Visualization plug-in.

    1. Open the application page in Page Designer.
    2. Select the Rendering tab on the left pane of the Page Designer.
    3. Right-click an existing component and add a new region component.
    4. Select the new region and configure the following attributes in the Region tab of the Property Editor on the right pane of the Page Designer:
      1. Enter the Identification Title.
      2. Select Graph Visualization (Preview) as Identification Type.
      3. Select the source Location as Local Database.
      4. Select the Type value.

        You can choose either SQL Query or PropertyGraph as the Type value.

      5. Embed the SQL graph query to retrieve the graph data.

        Depending on the type selected in the previous step, you can provide the query as shown in the following examples:

        • SQL Query: Enter the SQL graph query input as shown:
          SELECT *
  FROM GRAPH_TABLE (
           BANK_SQL_PG
           MATCH (a IS accounts) -[e IS transfers]-> (b IS accounts)
           WHERE a.id = 816
           COLUMNS(vertex_id(a) AS id_a, edge_id(e) AS id_e, vertex_id(b) AS id_b)
       )
        • PropertyGraph : Provide the SQL graph query as shown:
          • Graph Name: Select the SQL property graph name.
          • Match Clause: Enter the MATCH clause of the graph query. For example:

            (a IS accounts) -[e IS transfers]-> (b IS accounts)

          • Columns Clause: Enter the COLUMNS clause of the graph query. For example:

            (vertex_id(a) AS id_a, edge_id(e) AS id_e, vertex_id(b) AS id_b)

          • Where Clause: Optionally, enter the WHERE clause of the query. For example, a.id = 816.
    5. Run the application page to visualize the graph rendered by the plugin.
      Description of apex_gviz_basic_graph.png follows
      Description of the illustration apex_gviz_basic_graph.png

      Note:

      The APEX Graph Visualization plug-in on Oracle Database 23ai does not support graphs that use vertex or edge keys with DATE or TIMESTAMP data types. Visualizing graph query results on graphs with DATE or TIMESTAMP keys may result in only a subset of graph data being shown.
  6. Optionally, if you wish to implement pagination in the preceding graph visualization, then perform the following steps:
    1. Switch ON the SQL Query Supports Pagination setting in the Attributes tab of the Property Editor for the graph visualization component in your APEX application.
    2. Set the Page Size value in the Attributes tab of the Property Editor.
    3. Save and rerun the application page.
      The graph gets rendered with pagination.
  7. Optionally, you can import and run the Sample Graph Visualizations application from Oracle APEX GitHub repository.
    1. Import the sample-apps/sample-graph-visualizations/sample-graph-visualizations_23ai.sql into your APEX instance and install the application by following the steps in Importing an Application.
      When installing the sample application, ensure that you have the CREATE VIEW privilege for installing the supporting objects.

      You can directly run the sample application once it is installed.

      Description of apex_sample_graph_viz.png follows
      Description of the illustration apex_sample_graph_viz.png

      Also, note that the sample application requires a secure HTTPS connection. If you want to disable secure connection, then perform the following steps:

      Caution:

      It is not recommended to disable secure connections in production deployment.
      1. Navigate to the sample application home page in App Builder.
      2. Click Shared Components.
      3. Click Authentication Schemes under Security.
      4. Click the Current authentication scheme.
      5. Click the Session Sharing tab and turn off the Secure switch.
      6. Click Apply Changes and then run the application.