topic Re: Jagged polygons at large scales - how to smooth them out? in ArcGIS JavaScript Maps SDK Questions

Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Fri, 13 Jan 2012 15:35:17 GMT

Are the concepts that are presented in the generalize and performance samples under feature layers going to solve the problem of jagged edges at large scales?

I have one featurelayer (150 mb featureclass) that displays 1-4 features at a time at most. At large scales I get really jagged edges. The source data, as viewed in ArcMap, is more detailed. I have included the maxAllowableOffset parameter as described in the generalize features sample. This does help with the speed of initially displaying some of the larger features based on what I am seeing in firebug. However, I'm struggling to make sense of the two samples and how I should implement the code in my own application.

It seems that the code in the generalize sample might be all I need:

    var maxOffset = function maxOffset(map, pixelTolerance) {
      return Math.floor(map.extent.getWidth() / map.width) * pixelTolerance;
    };

but the performance sample uses a different calculation:

function calcOffset() {
        return (globals.map.extent.getWidth() / globals.map.width);
        // console.log('extent changed...maxOffset: ', globals.maxOffset);
      }

I'm not sure what to do or whether it will fix this problem.

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Fri, 13 Jan 2012 15:50:55 GMT

The performance sample is a simplified version of the code from the generalize sample. The performance sample assumes you don't want to display more than one vertex per pixel (anything more than that is wasted effort) so there's not pixel tolerance parameter. In other words, pixel tolerance is always 1. This is effectively the same as the generalize sample as the generalize sample always uses 1 for pixel tolerance.

Regarding your question about jagged edges, yes, max offset should be able to address this for you. The key is to generate the correct value. Two things would help get to the bottom of this:
-post a screen shot of your geometry in ArcMap as well as in your JS app
-post the code your using to generate max offset as well as the code that sets up the event listener to calculate max offset

The second point is relevant because it's possible that you're calculating max offset based on an old scale rather than the map's current scale.

Re: Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Sat, 11 Dec 2021 20:07:37 GMT

[ATTACH=CONFIG]11168[/ATTACH][ATTACH=CONFIG]11169[/ATTACH]

Thanks for your help.

This is inside my init function:

dojo.connect(map, 'onLoad', function (theMap) {
                    //resize the map when the browser resizes
                    dojo.connect(dijit.byId('mapDiv'), 'resize', map, map.resize);
                    var maxOffset = function maxOffset(map, pixelTolerance) {
                            return Math.floor(map.extent.getWidth() / map.width) * pixelTolerance;
                        };
                });

This is a function that I use to query my feature and then add the graphic(s) to the map:

function zoomToEFH_Feature(name) {
  
                //set up maxOffset for performance
                var maxOffset = function maxOffset(map, pixelTolerance) {
                        return Math.floor(map.extent.getWidth() / map.width) * pixelTolerance;
                    };

                //create feature layer   
                var efhLayer = new esri.layers.FeatureLayer("http://<internal server>/ArcGIS/rest/services/NMFS/EFH_MapperData/MapServer/6", {
                    maxAllowableOffset: maxOffset(map, 1),
                    outFields: ["*"],
                    opacity: 0.75,
                    id: "efhL"
                });
                efhLayer.setDefinitionExpression("TYPE='EFH'");

                //initialize query
                EFH_Fquery = new esri.tasks.Query();
                EFH_Fquery.where = "DDBOX = '" + name + "' AND FMC = '" + regionName + "'";
                //console.log(EFH_Fquery.where);
    //execute query
                efhLayer.queryFeatures(EFH_Fquery, function showResults(featureSet) {
                    //console.log('inside show Results for EFH query');
                    map.graphics.clear();
                    var symbol = new esri.symbol.SimpleFillSymbol(esri.symbol.SimpleFillSymbol.STYLE_SOLID).setColor(new dojo.Color([255, 255, 0, 0.5]));
                    
                    //console.log(featureSet.features.length);
      var legendcode = '<table border=0 cellspacing="5" cellpadding="5"><caption>Lifestages</caption>';
     //Loop through features in the featureSet and add them to the map.
                    for (var i = 0, il = featureSet.features.length; i < il; i++) {
                        //Get the current feature from the featureSet.
                        //Feature is a graphic
                        var graphic = featureSet.features;
                        graphic.setSymbol(symbol);
                        var featureextent = graphic.geometry.getExtent();
                        map.setExtent(featureextent, true);
                        //Add graphic to the map graphics layer.
                        map.graphics.add(graphic);   })  
            }

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Fri, 13 Jan 2012 16:12:03 GMT

Thanks. When is zoomToEFH_Feature called?

To make sure you're using the correct scale when you calculate max offset, I recommend re-caculating it each time onZoomEnd fires and storing that value in an app wide variable. This is what is done in the performance sample.

Re: Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Sat, 11 Dec 2021 20:07:40 GMT

"When is zoomToEFH_Feature called?" - it is called from a select box on a form. The user chooses an item and it calls this function.

I do have maxOffset set as a global variable.

I was looking at my code again after your last response and I noticed that I used this twice:

var maxOffset = function maxOffset(map, pixelTolerance) {
                            return Math.floor(map.extent.getWidth() / map.width) * pixelTolerance;
                        };

once in the init function and once in the zoomtoEFH_Feature function. Is that right?

I also noticed that I am not using the setMaxAllowableOffset anywhere. Should I put that inside the zoomtoEFH_Feature function?

  dojo.connect(efhLayer, "onLoad", function() {
     dojo.connect(map, "onZoomEnd", function() {
     efhLayer.setMaxAllowableOffset(maxOffset(map,1));
     });
    });

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Sat, 11 Dec 2021 20:07:43 GMT

When you re-calculate max offset, you should also set it on your feature layer. This is shown in the performance sample:

dojo.connect(globals.map, 'onZoomEnd', function() {
  globals.maxOffset = calcOffset();
  dojo.forEach(globals.featureLayers, function(fl) {
    fl.setMaxAllowableOffset(globals.maxOffset);
  });
});

Re: Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Fri, 13 Jan 2012 18:49:43 GMT

I'm having a hard time understanding how to solve this. Although I'm sure the answer is right in front of me. 🙂

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Fri, 13 Jan 2012 20:11:26 GMT

I'm having a hard time understanding how to solve this. Although I'm sure the answer is right in front of me. 🙂

Yep :). You need to set up an event listener for onZoomEnd. When that event fires, calculate a value for maxAllowableOffset and then pass it to your feature layer's setMaxAllowableOffset method. The feature layer will then update with new geometries that are appropriate for the map's new scale.

Re: Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Thu, 09 Feb 2012 18:39:00 GMT

Yep :). You need to set up an event listener for onZoomEnd. When that event fires, calculate a value for maxAllowableOffset and then pass it to your feature layer's setMaxAllowableOffset method. The feature layer will then update with new geometries that are appropriate for the map's new scale.

I have this partially solved. When I can get the feature to display and I zoom in/out for more/less detail my shapes are not jagged anymore (Yea!). However, if the feature is large it won't draw at all and I get a script error

Error: timeout exceeded
http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.6
Line 14

plus a "script too large" error.

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Thu, 09 Feb 2012 18:48:23 GMT

if the feature is large it won't draw at all and I get a script error

Error: timeout exceeded
http://serverapi.arcgisonline.com/jsapi/arcgis/?v=2.6
Line 14

plus a "script too large" error.

Post your code? Is your server endpoint public?

Re: Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Thu, 09 Feb 2012 18:59:50 GMT

Post your code? Is your server endpoint public?

I'm hoping to have the endpoint public next week. And, when jsfiddle is back up I will post my code there. Until then I thought you might have another idea I could try.

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Thu, 09 Feb 2012 19:08:17 GMT

Do you see this in all browsers?

Re: Jagged polygons at large scales - how to smooth them out?

MikeOnzay — Thu, 09 Feb 2012 19:31:56 GMT

Do you see this in all browsers?

Firefox 9.01, 10 - yes;
Chrome 17.0.963.46 m - it does draw but it is really slow
IE 7,8 - I get a popup with "out of memory at line: 48" (the console shows this as line 48 in the javascript api). This is new. My app usually loads and brings in the interface and the basemap in IE. I had not checked IE for a while so it is possible that something I did the other day is causing this problem.

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Thu, 09 Feb 2012 20:19:03 GMT

Sounds like you're trying to push too much data to the client. It would be helpful to see exactly how you're setting maxAllowableOffset. Also, are you drawing especially large features (features that are much larger than the extent of the map that's viewed at one time)? You might want to explore setting up scale dependencies if that's the case because large features can sometimes overwhelm older browsers even when maxOffset is used correctly.

Re: Jagged polygons at large scales - how to smooth them out?

DonCaviness — Sat, 11 Dec 2021 20:07:45 GMT

I have been trying to implement this functionality myself without any luck. I am adding a county polygon layer that has 82 features in the layer. The features get generalized when they are loaded but not when the map is zoomed. The onZoomEnd event listener is getting called but the setMaxAllowableOffset for the feature layer is not getting recalculated. What am I missing here?

Here is the code I am using.


               var maxOffset = function maxOffset(map, pixelTolerance) {
          return Math.floor(map.extent.getWidth() / map.width) * pixelTolerance;
        };

               var highlightCountyLayer = new esri.layers.FeatureLayer("countyURL", {
           mode: esri.layers.FeatureLayer.MODE_SNAPSHOT,
    maxAllowableOffset: maxOffset(map,1) 
         });
 
  dojo.connect(highlightCountyLayer, "onLoad", function() {
       dojo.connect(map, "onZoomEnd", function() {
   console.log('onZoomEnd highlightCountyLayer')
       highlightCountyLayer.setMaxAllowableOffset(maxOffset(map,1));
       });
  });
     
  map.addLayer(highlightCountyLayer);

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Thu, 01 Mar 2012 15:01:57 GMT

Hi Don,

At 2.7, we do this by default for feature layers in ONDEMAND mode so you no longer listen for onZoomEnd and update your features. Can you move to 2.7?

Re: Jagged polygons at large scales - how to smooth them out?

DonCaviness — Thu, 01 Mar 2012 17:36:15 GMT

Hi Don,

At 2.7, we do this by default for feature layers in ONDEMAND mode so you no longer listen for onZoomEnd and update your features. Can you move to 2.7?

Thanks Derek! I was using version 2.6. Using 2.7 solves the issue i was having. If i were to use SNAPSHOT mode, would I need to use the onZoomEnd method for recalculating?

Re: Jagged polygons at large scales - how to smooth them out?

derekswingley1 — Thu, 01 Mar 2012 17:54:37 GMT

Thanks Derek! I was using version 2.6. Using 2.7 solves the issue i was having.

Nice.

If i were to use SNAPSHOT mode, would I need to use the onZoomEnd method for recalculating?

SNAPSHOT pulls all features to the client when the layer is added to the map. Since you have all the features, you don't need to continuously update maxOffset.