8.2 Getting Started with the APEX Graph Visualization Plug-in

This section helps you get started with the Graph Visualization plug-in in your APEX application.

Before you get started, ensure that your APEX workspace meets the following requirements:

• The target application into which you want to import the plug-in exists.
• The target application is connected to Oracle Database 23ai.
• The SQL property graph to be used for visualization exists in the default database schema.

  Using the command editor in the SQL Workshop component, you can create a SQL property graph using the CREATE PROPERTY GRAPH DDL statement (see Using the Command Editor).

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 (see Signing In to Your Workspace).
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 account) -[e IS transfer]-> (b IS account)
                      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 account) -[e IS transfer]-> (b IS account)

           • 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.

      Figure 8-1 Visualizing a SQL Graph Query in an APEX Application

      
      Description of "Figure 8-1 Visualizing a SQL Graph Query in an APEX Application"

      Tip:

      You can use the Height attribute to control the size of the visualization panel.
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.
   See Importing the Sample Graph Visualizations Application in APEX for more information.

• Importing the Sample Graph Visualizations Application in APEX
  The Sample Graph Visualizations application demonstrates the use of the Graph Visualization plug-in.

8.2.1 Importing the Sample Graph Visualizations Application in APEX

The Sample Graph Visualizations application demonstrates the use of the Graph Visualization plug-in.

Perform the following steps to import the Sample Graph Visualizations application:

1. Download the Sample Graph Visualizations application from Oracle APEX GitHub repository.
2. Create the DBMS_GVT package if it is not already added 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).
3. 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.
   You can directly run the sample application once it is installed.

   Figure 8-2 Sample Graph Visualization Home Page

   
   Description of "Figure 8-2 Sample Graph Visualization Home Page"

   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.