API JS ArcGIS Calculer une surface net - Esri_fr

19 Sep 2022

Message posté par : LABASTIE Marie-Amélie (marieamelie228(a)gmail.com)

----------------------------------------

Bonjour,

Je cherche à compléter un widget calculant la distance et la surface avec API JS et ArcGIS
Experience Builder en y ajoutant un outil permettant d'obtenir la surface/volume
net(te) c'est-à-dire qui calculera le bâti 3D d'une couche moins la surface
dessinée résultant du calcule de la surface. Enfaite j'aimerai avoir le même résultat
que le calcul du volume de remblais/déblais présent dans Ortho Maker (image jointe).
Avez-vous des pistes svp ? 

Je vous mets mon code : 

-----------------
	Code :
<!DOCTYPE html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no" />
    <title>Outil Mesurer : Vue 3D</title>

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

      #topbar {
        background: #fff;
        padding: 10px;
      }

      .action-button {
        font-size: 16px;
        background-color: transparent;
        border: 1px solid #d3d3d3;
        color: #6e6e6e;
        height: 32px;
        width: 32px;
        text-align: center;
        box-shadow: 0 0 1px rgba(0, 0, 0, 0.3);
      }

      .action-button:hover,
      .action-button:focus {
        background: #0079c1;
        color: #e4e4e4;
      }

      .active {
        background: #0079c1;
        color: #e4e4e4;
      }
    </style>

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

    <script>
      require([
        "esri/WebScene",
        "esri/views/SceneView",
        "esri/widgets/DirectLineMeasurement3D",
        "esri/widgets/AreaMeasurement3D",
	      "esri/config",
        "esri/geometry/geometryEngine",
        "esri/core/promiseUtils"
      ], (WebScene, SceneView, DirectLineMeasurement3D, AreaMeasurement3D, esriConfig,
promiseUtils, geometryEngine) => {
        let activeWidget = null;

        // load a webscene
        esriConfig.portalUrl ="https://arcgis.societedugrandparis.fr/portal/";

        const scene = new WebScene({
          portalItem: { // autocasts as new PortalItem()
            id: "86f994f15d6e405d8697f30359892512"  // ID of the WebScene on the
on-premise portal
        }
          });

        // create the scene view
        const view = new SceneView({
          container: "viewDiv",
          map: scene
        });

          // Find a layer with title "US Counties"
          const foundLayer = scene.allLayers.find(function(layer) {
          return layer.title === "L14";
          });

        // add the toolbar for the measurement widgets
        view.ui.add("topbar", "top-right");

document.getElementById("distanceButton").addEventListener("click",
(event) => {
          setActiveWidget(null);
          if (!event.target.classList.contains("active")) {
            setActiveWidget("distance");
          } else {
            setActiveButton(null);
          }
        });

        var distanceResultat =
document.getElementById("areaButton").addEventListener("click",
(event) => {
          setActiveWidget(null);
          if (!event.target.classList.contains("active")) {
            setActiveWidget("area");
          } else {
            setActiveButton(null);
          }
        });

        const diff = geometryEngine.difference(foundLayer, distanceResultat);

document.getElementById("espacedispoButton").addEventListener("click",
(event) => {
          setActiveWidget(null);
          if (!event.target.classList.contains("active")) {
            setActiveWidget("espacedispo");
          } else {
            setActiveButton(null);
          }
        });

        function setActiveWidget(type) {
          switch (type) {
            case "distance":
              activeWidget = new DirectLineMeasurement3D({
                view: view
              });

              // skip the initial 'new measurement' button
              activeWidget.viewModel.start().catch((error) => {
                if (promiseUtils.isAbortError(error)) {
                  return; // don't display abort errors
                }
                throw error; // throw other errors since they are of interest
              });

              view.ui.add(activeWidget, "top-right");
              setActiveButton(document.getElementById("distanceButton"));
              break;
            case "area":
              activeWidget = new AreaMeasurement3D({
                view: view
              });

              // skip the initial 'new measurement' button
              activeWidget.viewModel.start().catch((error) => {
                if (promiseUtils.isAbortError(error)) {
                  return; // don't display abort errors
                }
                throw error; // throw other errors since they are of interest
              });

              view.ui.add(activeWidget, "top-right");
              setActiveButton(document.getElementById("areaButton"));
              break;
            case null:
              if (activeWidget) {
                view.ui.remove(activeWidget);
                activeWidget.destroy();
                activeWidget = null;
              }
              break;
          }
        }

        function setActiveButton(selectedButton) {
          // focus the view to activate keyboard shortcuts for sketching
          view.focus();
          const elements = document.getElementsByClassName("active");
          for (let i = 0; i < elements.length; i++) {
            elements.classList.remove("active");
          }
          if (selectedButton) {
            selectedButton.classList.add("active");
          }
        }
      });
    </script>
  </head>

  <body>
    <div id="viewDiv"></div>
    <div id="topbar">
      <button
        class="action-button esri-icon-measure-line"
        id="distanceButton"
        type="button"
        title="Measure distance between two points"
...
 </button>       <button
class="action-button esri-icon-measure-area" id="areaButton"
type="button" title="Measure area"></button>
      <button
        class="action-button esri-icon-espacedispo"
        id="espacedispoButton"
        type="button"
        title="Measure space avaible"
...
 </button>     </div>
  </body>
</html>
-----------------

----------------------------------------

Ce message est accompagné de fichiers, pour les télécharger, suivre le lien ci-dessous.

----------------------------------------

Le message est situé https://georezo.net/forum/viewtopic.php?pid=355317#p355317
Pour y répondre : esri_fr(a)ml.georezo.net ou reply de votre messagerie
Pour vous désabonner connectez-vous sur le forum puis Profil / Abonnement

--

Association GeoRezo - le portail géomatique
https://georezo.net