nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Disable scaling feature in Editor widget

achyl

Hi, how can i disable scaling in editor widget?
I would like to disable scaling for CityFurnitureLayer when creating and updating.

const editor = new Editor({

view: view,

layerInfos: [

CityFurnitureInfos(CityFurnitureLayer, content),

VegetationInfos(VegetationLayer, content),

BaseInfos(BaseLayer, content),

PathInfos(pathLayer, content),

tooltipOptions: { enabled: true },

labelOptions: { enabled: true }

});

export const CityFurnitureInfos = (CityFurnitureLayer, content) => {

return {

layer: CityFurnitureLayer,

formTemplate: {

elements: [

{

type: 'field',

fieldName: 'TYPE',

label: content.furnitureInfos.labelType

{

type: 'field',

fieldName: 'SIZE',

label: content.furnitureInfos.labelSize,

formatter: function (value) {

return value.toFixed(2);

format: {

places: 2,

digitSeparator: true

editorType: 'number'

{

type: 'field',

fieldName: 'ROTATION',

label: content.furnitureInfos.labelRotation,

}

]

fieldInfos: [{

fieldName: 'SIZE',

label: content.furnitureInfos.labelSize,

format: {

places: 2,

digitSeparator: true

}

}]

};

Finde mehr Beiträge mit dem Tag

Accepted answers

Jan62

We have the same problem. It seems, only 4.29 is affectet under 4.28 it works fine. The the Sandbox Code.

4.28 Works as intended

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Edit features with the Editor widget | Sample | ArcGIS Maps SDK for JavaScript 4.29</title>

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

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

  </style>

  <script>
    require([
        "esri/WebMap",
        "esri/views/MapView",
        "esri/widgets/Editor"
      ], (
        WebMap, MapView,
        Editor
      ) => {

        // Create a map from the referenced webmap item id
        const webmap = new WebMap({
          portalItem: {
            id: "4793230052ed498ebf1c7bed9966bd35"
          }
        });

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

        view.when(() => {
          const editor = new Editor({
            view: view,
          });
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableRotation  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableScaling  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableZ  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.multipleSelectionEnabled = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.preserveAspectRatio  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.toggleToolOnClick = false;
          editor.viewModel.sketchViewModel.tool = "transform";
          

          // Add the widget to the view
          view.ui.add(editor, "top-right");
        });
      });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

4.29 Overrides the defaults and enables scaling

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Edit features with the Editor widget | Sample | ArcGIS Maps SDK for JavaScript 4.29</title>

  <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/Editor"
      ], (
        WebMap, MapView,
        Editor
      ) => {

        // Create a map from the referenced webmap item id
        const webmap = new WebMap({
          portalItem: {
            id: "4793230052ed498ebf1c7bed9966bd35"
          }
        });

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

        view.when(() => {
          const editor = new Editor({
            view: view,
          });
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableRotation  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableScaling  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableZ  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.multipleSelectionEnabled = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.preserveAspectRatio  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.toggleToolOnClick = false;
          editor.viewModel.sketchViewModel.tool = "transform";
          

          // Add the widget to the view
          view.ui.add(editor, "top-right");
        });
      });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

All comments

Jan62

Update:

with 4.30 now it works to override the behavior. Look at SupportingWidgetDefaults Editor | API Reference | ArcGIS Maps SDK for JavaScript 4.30 | Esri Developer

The example disables the scaling and rotation on update.

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Edit features with the Editor widget | Sample | ArcGIS Maps SDK for JavaScript 4.30</title>

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

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

  </style>

  <script>
    require([
        "esri/WebMap",
        "esri/views/MapView",
        "esri/widgets/Editor"
      ], (
        WebMap, MapView,
        Editor
      ) => {

        // Create a map from the referenced webmap item id
        const webmap = new WebMap({
          portalItem: {
            id: "4793230052ed498ebf1c7bed9966bd35"
          }
        });

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

        view.when(() => {
          const editor = new Editor({
            view: view,
            supportingWidgetDefaults:{
              sketch:{
                defaultUpdateOptions:{
                  enableRotation: false,
                  enableScaling: false
                }
              }
            }
          });
                   

          // Add the widget to the view
          view.ui.add(editor, "top-right");
        });
      });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

achyl

Thank you,
after downgrading version it works, but only for 2D objects, I can't lock the scaling of a point-3d type symbol.

Jan62

We have the same problem. It seems, only 4.29 is affectet under 4.28 it works fine. The the Sandbox Code.

4.28 Works as intended

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Edit features with the Editor widget | Sample | ArcGIS Maps SDK for JavaScript 4.29</title>

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

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

  </style>

  <script>
    require([
        "esri/WebMap",
        "esri/views/MapView",
        "esri/widgets/Editor"
      ], (
        WebMap, MapView,
        Editor
      ) => {

        // Create a map from the referenced webmap item id
        const webmap = new WebMap({
          portalItem: {
            id: "4793230052ed498ebf1c7bed9966bd35"
          }
        });

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

        view.when(() => {
          const editor = new Editor({
            view: view,
          });
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableRotation  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableScaling  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableZ  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.multipleSelectionEnabled = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.preserveAspectRatio  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.toggleToolOnClick = false;
          editor.viewModel.sketchViewModel.tool = "transform";
          

          // Add the widget to the view
          view.ui.add(editor, "top-right");
        });
      });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

4.29 Overrides the defaults and enables scaling

<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>Edit features with the Editor widget | Sample | ArcGIS Maps SDK for JavaScript 4.29</title>

  <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/Editor"
      ], (
        WebMap, MapView,
        Editor
      ) => {

        // Create a map from the referenced webmap item id
        const webmap = new WebMap({
          portalItem: {
            id: "4793230052ed498ebf1c7bed9966bd35"
          }
        });

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

        view.when(() => {
          const editor = new Editor({
            view: view,
          });
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableRotation  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableScaling  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.enableZ  = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.multipleSelectionEnabled = false;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.preserveAspectRatio  = true;
          editor.viewModel.sketchViewModel.defaultUpdateOptions.toggleToolOnClick = false;
          editor.viewModel.sketchViewModel.tool = "transform";
          

          // Add the widget to the view
          view.ui.add(editor, "top-right");
        });
      });
  </script>
</head>

<body>
  <div id="viewDiv"></div>
</body>

</html>

achyl

It didn't work,
I set this property in editor.when(), but when I create a new object, this property is overwritten

Zrzut ekranu 2024-05-28 082920.png

JoelBennett

You can disable scaling on updates like so:

editor.viewModel.sketchViewModel.defaultUpdateOptions.enableScaling = false;

Unfortunately, the defaultCreateOptions provide no such property. They do have a preserveAspectRatio property though which may be helpful, as does defaultUpdateOptions:

editor.viewModel.sketchViewModel.defaultCreateOptions.preserveAspectRatio = false;

Nimm an der Unterhaltung teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.