topic Re: Esri/heatmap-layer-js won't display across dateline in ArcGIS JavaScript Maps SDK Questions

Esri/heatmap-layer-js won't display across dateline

Anonymous User — Tue, 29 Jul 2014 12:50:06 GMT

I'm using the Esri/heatmap-layer-js by Matt Driscoll and have noticed that it does not render across the international dateline.

To see this behavior in the sample, zoom out from San Francisco to the world and pan west or east across the dateline and continue to San Francisco. In Firebug I can see the data is being queried, but it simply is not being rendered.

Is this expected behavior? In my use case I have world wide data (v.s. a small area like San Francisco) so need to have continuous display across the dateline.

Re: Esri/heatmap-layer-js won't display across dateline

Anonymous User — Tue, 19 Aug 2014 13:27:05 GMT

I see the same behavior, (i.e. not displaying data outside the original world extent when panning west or east), with the cluster layer in the Summary Viewer. I see from the GitHub page (by Kelly Hutchins and Sajit Thomas) for ClusterLayer.js that it inherits from GraphicsLayer.

To see this behavior zoom out to a global scale. The cluster points display:

Next, pan West or East, and the cluster points are no longer displayed:

This problem is stopping me using either HeatmapLayer and ClusterLayerfrom in my own apps. Neither the FeatureLayers or GraphicsLayers I'm using exhibit this behavior.

Re: Esri/heatmap-layer-js won't display across dateline

MattDriscoll — Tue, 19 Aug 2014 23:08:13 GMT

Hey Martin,

Thanks for the notice. I got the layer working across the dateline by normalizing each point and the map's extent. Let me know if the code is working for you now.

heatmap.js ArcGIS JavaScript API Heatmap Layer‌

I am guessing the same issue is occurring with the cluster layer. The points probably just need to be normalized so that they display across the dateline.

Also, there's been a new release of heatmap.js so I'll likely be writing some code to support the latest version.

Re: Esri/heatmap-layer-js won't display across dateline

Anonymous User — Wed, 20 Aug 2014 12:48:10 GMT

Hi Matt,

Yes I see you fixed it, thanks!

In an attempt to figure this out myself, I actually started down the road of normalizing the extent, but didn't know about the (private) _normalize() method on esri/geometry/Extent, nor the normalize() method on esri/Geometry/Point. As an aside, a search in the API docs for 'normalize' only returns esri/geometry/normalizeUtils, so that's what I was experimenting with.

I'll try to copy your approach with the ClusterLayer, and do a GitHub fork/pull (for the first time) if it isn't fixed before I get to it.

Re: Esri/heatmap-layer-js won't display across dateline

Anonymous User — Wed, 20 Aug 2014 15:13:32 GMT

Matt, I just read about heatmap.js version 2. It says "stronger, to handle even more datapoints (40k+)". Is 40k points doable with the ArcGIS JS API?

Re: Esri/heatmap-layer-js won't display across dateline

MattDriscoll — Wed, 20 Aug 2014 16:31:40 GMT

We'll see. It should be the same.

Re: Esri/heatmap-layer-js won't display across dateline

MattDriscoll — Wed, 20 Aug 2014 16:33:26 GMT

Yes, we'll see if we can make a public function out of that _normalize(). Let me know if you have success with the clusterlayer.

Re: Esri/heatmap-layer-js won't display across dateline

Anonymous User — Wed, 20 Aug 2014 19:18:11 GMT

Hmmm, spoke too soon. When I zoom out and pan to include the dateline, this "c.getWidth is not a function" error comes up. I'm fairly certain that it occurs on line 122 in the convertHeatMapData function of HeatmapLayer.js:

screenGeometry = screenUtils.toScreenGeometry(normalizedExtent, this.get("map").width, this.get("map").height, parsedData.data[xParsed][yParsed].dataPoint);

Re: Esri/heatmap-layer-js won't display across dateline

Anonymous User — Thu, 21 Aug 2014 13:21:32 GMT

I think something goes wrong when getHeight() and getWidth() are called on a normalized Extent. The following code, a modified sample in the ArcGIS API for JavaScript Sandbox, displays an alert box with the values returned from these functions on the map extent-change event. Its seems that while panning around, when the normalized extent includes the int'l dateline these two functions do not return anything.

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  <title>Home Extent</title>
  <link rel="stylesheet" type="text/css" href="http://js.arcgis.com/3.10/js/esri/css/esri.css">
  <style>
    html, body, #map {
      padding:0;
      margin:0;
      height:100%;
    }
    #HomeButton {
      position: absolute;
      top: 95px;
      left: 20px;
      z-index: 50;
    }
  </style>
  <script src="//js.arcgis.com/3.10/"></script>
  <script>

    require([
      "esri/map", 
      "esri/dijit/HomeButton",
      "dojo/on",
      "dojo/domReady!"
    ], function(
      Map, HomeButton,on
    )  {

      var map = new Map("map", {
        center: [-56.049, 38.485],
        zoom: 3,
        basemap: "streets"
      });
            
      var home = new HomeButton({
        map: map
      }, "HomeButton");
      home.startup();
      
      on(map,"extent-change", function(a,b,c,d){
        var w = map.extent._normalize().getWidth();
        var h = map.extent._normalize().getHeight();
        alert(w + "," + h);
      })

    });
  </script>
</head>
<body>
  <div id="map" class="map">
    <div id="HomeButton"></div>
  </div>
</body>
</html>

Re: Esri/heatmap-layer-js won't display across dateline

KenBuja — Thu, 21 Aug 2014 13:33:39 GMT

I'm wondering if this is the same issue that shows up in this problem with the dateline when changing basemaps. Although the link to my example didn't make it through the forum migration, it's located here. John Gravois‌ started looking into it but never did report on his findings.

Re: Esri/heatmap-layer-js won't display across dateline

Anonymous User — Fri, 22 Aug 2014 16:09:04 GMT

Yes, I think the failure to normalize the extent is playing a part in both situations.

I've noticed that the esri/geometry/webMercatorUtils module can be used to normalize geometries by converting them from web mercator to geographic and then back again. Normalization appears to be included.

topic Re: Esri/heatmap-layer-js won't display across dateline in ArcGIS JavaScript Maps SDK Questions

Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

Re: Esri/heatmap-layer-js won't display across dateline

webMercatorUtils.geographicToWebMercator((webMercatorUtils.webMercatorToGeographic(map.extent)));