Search This Blog

Sunday, July 13, 2025

How do I make the map’s tooltip display a detail page

 

Introduction
In Oracle APEX, maps are a powerful way to present location-based data visually. But what if you want to go beyond simple tooltips and allow users to drill into a full detail page directly from a map marker? By configuring your map tooltips to act as clickable links, you can guide users from a high-level overview to specific information with just one click. This blog will explain how to make your map’s tooltip open a detail page, creating a smooth and interactive experience.

How to Make the Map’s Tooltip Display a Detail Page

To configure a map in Oracle APEX so that tooltips display links to detail pages, follow these steps:

  1. Prepare Your Data Source

    • Your SQL query should return all the data needed for the marker and the link.

    • Example:

      SELECT 
        id,
        store_name AS name,
        latitude,
        longitude,
        'Click for details' AS tooltip_text,
        'f?p=&APP_ID.:50:&SESSION.::NO::P50_STORE_ID:' || id AS detail_link
      FROM store_locations
      
    • Replace 50 with the page number of your detail page, and P50_STORE_ID with the appropriate item name.

  2. Configure the Map Region

    • In Page Designer, click on the Map region.

    • Under Map Attributes, go to Marker Layer.

  3. Set Marker Tooltip

    • Set the Tooltip field to the tooltip_text column, or build it dynamically using the link.

    • To embed a hyperlink, use HTML in the tooltip:

      '<a href="' || 'f?p=&APP_ID.:50:&SESSION.::NO::P50_STORE_ID:' || id || '">View Store: ' || store_name || '</a>'
      
    • Be sure to set Escape Special Characters to No so the HTML renders.

  4. Optional: Open in Modal Dialog or New Tab

    • To open in a new tab:

      <a href="..." target="_blank">...</a>
      
    • To open in a modal dialog, use a Dynamic Action or link to a page configured as a modal.

  5. Test and Deploy

    • Run your app.

    • Hover over a map marker, confirm that the tooltip shows the correct link, and test that clicking it navigates to the right detail page. 

In this example we are going to make the tool tip “clickable and display a pre-existing detail page.

Step 1 – Go to the layer that displays the tooltip.

A screenshot of a computer

AI-generated content may be incorrect. 

Step 2- Go to the Link area and select the type of redirect that you want

A screenshot of a computer

AI-generated content may be incorrect. 

Step 3 – Set the link

A screenshot of a computer

Description automatically generated 


Step 4 -  Select

  • Type- In this case “Page in this application”

  • Page – This is the application page number. In this case is page #5.

  • Set Items

    • Name: The name of the control IN THE DESTINATION page

    • Value: The value you are passing TO the destination screen. We are passing the Identity column value.


A screenshot of a computer

AI-generated content may be incorrect.


Save your changes and browse. In this example we open a “drawer” form of the location.

A screenshot of a computer

AI-generated content may be incorrect.



 

Conclusion
Enabling users to navigate from map tooltips to detailed views adds depth and interactivity to your Oracle APEX applications. With just a few changes to your SQL and map region settings, you can create dynamic, data-driven maps that double as navigation tools. This small enhancement provides a big improvement to the user experience, helping your application feel more connected, responsive, and intuitive.

No comments:

Post a Comment

How Do I Make a Faceted Search Map Page in Oracle APEX

Combining faceted search with a map region in Oracle APEX enables users to filter data visually and spatially at the same time. This design ...