Skip to Main Content

APEX

Announcement

For appeals, questions and feedback about Oracle Forums, please email oracle-forums-moderators_us@oracle.com. Technical questions should be asked in the appropriate category. Thank you!

How to add Esri viewer(ArcGIS Maps SDK for JavaScript) into an Apex Page

ofv7600Mar 27 2024 — edited Mar 27 2024

Hi,

Hi would like to know if someone have successfuly integrated ArcGis viewer ino an apex page ?

By example the esri have some tutorial like FloorFilter widget | Sample Code | ArcGIS Maps SDK for JavaScript 4.29 | ArcGIS Developers.

the js <script src="https://js.arcgis.com/4.29/"></script>

I have created into apex a simple page to try esri sample

with a static region with the static id=viewDiv.

Into this satic region on property -→ source → HTML Code

i added the following code

<link rel="stylesheet" href="https://js.arcgis.com/4.29/esri/themes/light/main.css" />
    <script src="https://js.arcgis.com/4.29/"></script>

    <style>
      html,
      body,
      #viewDiv {
        padding: 0;
        margin: 0;
        height: 100%;
        width: 100%;
      }
    </style>

    <script>
      require([
        "esri/WebMap",
        "esri/views/MapView",
        "esri/widgets/FloorFilter"
      ], function(
        WebMap,
        MapView,
        FloorFilter
      ) {
        const webmap = new WebMap({
          portalItem: {
            id: "f133a698536f44c8884ad81f80b6cfc7"
          }
        });

        const view = new MapView({
          container: "viewDiv",
          map: webmap
        });

        view.when(() => {
          // Initialize the FloorFilter widget
          const floorFilter = new FloorFilter({
            view: view
          });

          // Add the FloorFilter to the view
          view.ui.add(floorFilter, "top-trailing");
        });
      });
    </script>

But running my page it display a white page ? How to integrate correctly Esri Map viewer ?

Comments
Post Details
Added on Mar 27 2024
1 comment
523 views