{"id":1621232,"date":"2022-06-23T13:36:01","date_gmt":"2022-06-23T20:36:01","guid":{"rendered":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&#038;p=1621232"},"modified":"2024-04-12T03:39:27","modified_gmt":"2024-04-12T10:39:27","slug":"heat-maps-now-render-faster-and-smoother-in-the-browser","status":"publish","type":"blog","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser","title":{"rendered":"Heat maps now render faster and smoother in the browser"},"author":6561,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"_searchwp_excluded":""},"categories":[738191,22941],"tags":[758301,761092,765772,34641,765092],"industry":[],"product":[761642,36831,36601],"class_list":["post-1621232","blog","type-blog","status-publish","format-standard","hentry","category-developers","category-mapping","tag-data-viz","tag-heat-map","tag-heatmap","tag-webgl","tag-whats-new-june-2022","product-platform","product-js-api-arcgis","product-developers"],"acf":{"short_description":"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.","flexible_content":[{"acf_fc_layout":"content","content":"<p><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/visualization\/high-density-data\/heatmap\/\">Heat maps<\/a> in the <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/\">ArcGIS API for JavaScript<\/a> (JS API) are now faster, smoother, and can render more data in the browser than ever before.<\/p>\n<p>A heat map is a visualization style that renders point data as a continuous raster surface. The surface typically visualizes &#8220;hot&#8221; areas with bright colors in areas where point data is more dense. Heat maps are particularly useful for visualizing a large number of points, where many points may overlap. For example, the heat map below shows the density of oil and gas wells in Kansas.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1622382,"id":1622382,"title":"Screen Shot 2022-06-21 at 3.11.33 PM","filename":"Screen-Shot-2022-06-21-at-3.11.33-PM.png","filesize":69877,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/screen-shot-2022-06-21-at-3-11-33-pm","alt":"Density of oil and gas wells in Kansas. Heat maps communicate spatial patterns and densities more clearly than simple point renderers.","author":"6561","description":"","caption":"Density of oil and gas wells in Kansas. Heat maps communicate spatial patterns and densities more clearly than simple point renderers.","name":"screen-shot-2022-06-21-at-3-11-33-pm","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 22:16:55","modified":"2022-06-21 22:23:23","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":1067,"height":511,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","medium-width":464,"medium-height":222,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","medium_large-width":768,"medium_large-height":368,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","large-width":1067,"large-height":511,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","1536x1536-width":1067,"1536x1536-height":511,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","2048x2048-width":1067,"2048x2048-height":511,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM-826x396.png","card_image-width":826,"card_image-height":396,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.11.33-PM.png","wide_image-width":1067,"wide_image-height":511}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"<p>Conversely, if I represented each well as a point, it would be nearly impossible to know which areas have more wells than others.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1622412,"id":1622412,"title":"Screen Shot 2022-06-21 at 3.18.33 PM","filename":"Screen-Shot-2022-06-21-at-3.18.33-PM.png","filesize":473360,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/screen-shot-2022-06-21-at-3-18-33-pm","alt":"Oil and gas wells represented individually as points. It is nearly impossible to see the spatial distribution of wells when they are represented this way.","author":"6561","description":"","caption":"Oil and gas wells represented individually as points. It is nearly impossible to see the spatial distribution of wells when they are represented this way.","name":"screen-shot-2022-06-21-at-3-18-33-pm","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 22:20:45","modified":"2022-06-21 22:24:26","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":1090,"height":522,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","medium-width":464,"medium-height":222,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","medium_large-width":768,"medium_large-height":368,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","large-width":1090,"large-height":522,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","1536x1536-width":1090,"1536x1536-height":522,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","2048x2048-width":1090,"2048x2048-height":522,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM-826x396.png","card_image-width":826,"card_image-height":396,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-3.18.33-PM.png","wide_image-width":1090,"wide_image-height":522}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"<p><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/release-notes\/\">Version 4.24<\/a> (June 2022) of the JS API upgraded <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-renderers-HeatmapRenderer.html\">HeatmapRenderer<\/a> to render with WebGL. This update introduces the following improvements:<\/p>\n<ul>\n<li>More data can be rendered with the HeatmapRenderer than before.<\/li>\n<li>Significant performance updates, which make the experience of navigating layers with HeatmapRenderer more smooth.<\/li>\n<li>Data rendered with the HeatmapRenderer can now be filtered client-side, with FeatureFilter and FeatureEffect.<\/li>\n<li>Added popup and hitTest support.<\/li>\n<li>Added labeling support.<\/li>\n<\/ul>\n<p>Prior to this release, the JS API&#8217;s rendering engine used <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Canvas_API\">Canvas<\/a> to render heat maps. This latest update makes it the last renderer in the JS API to <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/4.10\/#improved-drawing-performance-in-2d\">migrate to WebGL<\/a>.<\/p>\n<h2>Examples<\/h2>\n<p>The following app shows a heatmap of earthquakes where only earthquakes magnitude 5.0 or larger are labeled. I also added a popup so you can click any point in the map to view information about each earthquake in that area.<\/p>\n<p><strong>Labels<\/strong><\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1621522,"id":1621522,"title":"labels","filename":"labels.png","filesize":38142,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/labels-11","alt":"The underlying points of a layer rendered with HeatmapRenderer can now be labeled. In this earthquakes heat map, labels only display for earthquakes of magnitude 5.0 or larger.","author":"6561","description":"","caption":"The underlying points of a layer rendered with HeatmapRenderer can now be labeled. In this earthquakes heat map, labels only display for earthquakes of magnitude 5.0 or larger. ","name":"labels-11","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 19:03:12","modified":"2022-06-21 19:06:52","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":834,"height":514,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","medium-width":423,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","medium_large-width":768,"medium_large-height":473,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","large-width":834,"large-height":514,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","1536x1536-width":834,"1536x1536-height":514,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","2048x2048-width":834,"2048x2048-height":514,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels-754x465.png","card_image-width":754,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/labels.png","wide_image-width":834,"wide_image-height":514}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/heatmap-experiments\/demo-apps\/labels-popups.html"},{"acf_fc_layout":"content","content":"<p><strong>Popups<\/strong><\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1621552,"id":1621552,"title":"popup","filename":"popup.png","filesize":36445,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/popup-31","alt":"Starting at version 4.24, clicking a heatmap will open the popup for all features in proximity of the click.","author":"6561","description":"","caption":"Starting at version 4.24, clicking a heatmap will open the popup for all features in proximity of the click.","name":"popup-31","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 19:03:26","modified":"2022-06-21 19:08:15","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":798,"height":518,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","medium-width":402,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","medium_large-width":768,"medium_large-height":499,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","large-width":798,"large-height":518,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","1536x1536-width":798,"1536x1536-height":518,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","2048x2048-width":798,"2048x2048-height":518,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup-716x465.png","card_image-width":716,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/popup.png","wide_image-width":798,"wide_image-height":518}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/heatmap-experiments\/demo-apps\/labels-popups.html"},{"acf_fc_layout":"content","content":"<p>Prior to 4.24, you could not filter data rendered with HeatmapRenderer client-side. By association, that meant Heatmaps did not filter or update on time-enabled layers hooked up to a <a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-widgets-TimeSlider.html\">TimeSlider<\/a>. Now, you can filter heat maps as you would if the layer had any other renderer assigned to it.<\/p>\n<p><strong>Filters and effects<\/strong><\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1622222,"id":1622222,"title":"Screen Shot 2022-06-21 at 2.13.40 PM","filename":"Screen-Shot-2022-06-21-at-2.13.40-PM.png","filesize":39806,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/screen-shot-2022-06-21-at-2-13-40-pm","alt":"Earthquake density filtered by magnitude. Areas with a high density of small earthquakes are visualized in the full color ramp. Areas with a high density of large earthquakes are rendered in grayscale.","author":"6561","description":"","caption":"Earthquake density filtered by magnitude. Areas with a high density of small earthquakes are visualized in the full color ramp. Areas with a high density of large earthquakes are rendered in grayscale.","name":"screen-shot-2022-06-21-at-2-13-40-pm","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 21:15:50","modified":"2022-06-21 21:40:01","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":950,"height":544,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","medium-width":456,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","medium_large-width":768,"medium_large-height":440,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","large-width":950,"large-height":544,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","1536x1536-width":950,"1536x1536-height":544,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","2048x2048-width":950,"2048x2048-height":544,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM-812x465.png","card_image-width":812,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.13.40-PM.png","wide_image-width":950,"wide_image-height":544}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/heatmap-experiments\/demo-apps\/filter-effect.html"},{"acf_fc_layout":"image","image":{"ID":1621592,"id":1621592,"title":"time-heatmap-short","filename":"time-heatmap-short.gif","filesize":887065,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/time-heatmap-short","alt":"Heat map representing density of car crashes in New York City (2020). Notice how crash density decreased dramatically after March 2020.","author":"6561","description":"","caption":"Heat map representing density of car crashes in New York City (2020). Notice how crash density decreased dramatically after March 2020.","name":"time-heatmap-short","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 19:03:54","modified":"2022-06-21 20:46:25","menu_order":0,"mime_type":"image\/gif","type":"image","subtype":"gif","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":800,"height":450,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short-213x200.gif","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","medium-width":464,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","medium_large-width":768,"medium_large-height":432,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","large-width":800,"large-height":450,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","1536x1536-width":800,"1536x1536-height":450,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","2048x2048-width":800,"2048x2048-height":450,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","card_image-width":800,"card_image-height":450,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/time-heatmap-short.gif","wide_image-width":800,"wide_image-height":450}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/heatmap-experiments\/demo-apps\/time-slider.html"},{"acf_fc_layout":"content","content":"<h2>Heat maps now use kernel density<\/h2>\n<p>The underlying strategy for calculating density in HeatmapRenderer changed from <a href=\"https:\/\/en.wikipedia.org\/wiki\/Gaussian_blur\">Gaussian blur<\/a> to <a href=\"https:\/\/pro.arcgis.com\/en\/pro-app\/latest\/tool-reference\/spatial-analyst\/how-kernel-density-works.htm\">kernel density<\/a> at version 4.24.<\/p>\n<p>This was motivated by an effort to make JS API heat maps render more consistently in future versions of ArcGIS Pro. The JS API introduced the following new properties specific to the kernel density formula:<\/p>\n<ul>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-renderers-HeatmapRenderer.html#radius\">radius<\/a> replaced <code>blurRadius<\/code>.<\/li>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-renderers-HeatmapRenderer.html#minDensity\">minDensity<\/a> replaced <code>minPixelIntensity<\/code>.<\/li>\n<li><a href=\"https:\/\/developers.arcgis.com\/javascript\/latest\/api-reference\/esri-renderers-HeatmapRenderer.html#maxDensity\">maxDensity<\/a> replaced <code>maxPixelIntensity<\/code>.<\/li>\n<\/ul>\n<p>This is a soft update, so you don&#8217;t have to worry about HeatmapRenderer breaking when you upgrade API versions.<\/p>\n<p>For example, if you update an app to version 4.24 that originally authored a HeatmapRenderer in any prior API version, the heat map will render consistently as it did in the prior versions. No code updates required! The JS API&#8217;s rendering engine internally reads the old Gaussian blur values, and converts them to their equivalent kernel density values. The heat map essentially renders as it did before even if you had no knowledge of the new API properties.<\/p>\n<p><em>Click the image below to view a larger version of it.<\/em><\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1622292,"id":1622292,"title":"Screen Shot 2022-06-21 at 2.53.32 PM","filename":"Screen-Shot-2022-06-21-at-2.53.32-PM.png","filesize":151454,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/screen-shot-2022-06-21-at-2-53-32-pm","alt":"Heat map of car crashes in Los Angeles rendered using Gaussian blur (left). Heat map of the same variable rendered using kernel density (right). Internally, the JS API will attempt to keep the look and feel of heat maps consistent when upgrading to 4.24, even though it uses a different algorithm (kernel density) than prior versions (Gaussian blur).","author":"6561","description":"","caption":"Heat map of car crashes in Los Angeles rendered using Gaussian blur (left). Heat map of the same variable rendered using kernel density (right). Internally, the JS API will attempt to keep the look and feel of heat maps consistent when upgrading to 4.24, even though it uses a different algorithm (kernel density) than prior versions (Gaussian blur).","name":"screen-shot-2022-06-21-at-2-53-32-pm","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 21:54:41","modified":"2022-06-21 21:57:50","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":1909,"height":366,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png","medium-width":464,"medium-height":89,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png","medium_large-width":768,"medium_large-height":147,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png","large-width":1909,"large-height":366,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM-1536x294.png","1536x1536-width":1536,"1536x1536-height":294,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png","2048x2048-width":1909,"2048x2048-height":366,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM-826x158.png","card_image-width":826,"card_image-height":158,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png","wide_image-width":1909,"wide_image-height":366}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/Screen-Shot-2022-06-21-at-2.53.32-PM.png"},{"acf_fc_layout":"content","content":"<p>However, when you update to version 4.24 you will begin to see a console message, warning you to use the new kernel density properties. This message reports the values the new properties should use if you want to maintain a consistent visualization with the old property values.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1621512,"id":1621512,"title":"console-warnings","filename":"console-warnings.png","filesize":43238,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\/console-warnings","alt":"When you update to 4.24 version 4.24, HeatmapRenderer will suggest you use the new kernel density properties. The messages provide suggested values to maintain a similar-looking heat map.","author":"6561","description":"","caption":"When you update to 4.24 version 4.24, HeatmapRenderer will suggest you use the new kernel density properties. The messages provide suggested values to maintain a similar-looking heat map.","name":"console-warnings","status":"inherit","uploaded_to":1621232,"date":"2022-06-21 19:03:07","modified":"2022-06-21 22:01:01","menu_order":0,"mime_type":"image\/png","type":"image","subtype":"png","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":638,"height":204,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","medium-width":464,"medium-height":148,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","medium_large-width":638,"medium_large-height":204,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","large-width":638,"large-height":204,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","1536x1536-width":638,"1536x1536-height":204,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","2048x2048-width":638,"2048x2048-height":204,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","card_image-width":638,"card_image-height":204,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/console-warnings.png","wide_image-width":638,"wide_image-height":204}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"<p>Heat maps authored in Map Viewer Classic (3.x JS API) will also consistently render in newer web apps.<\/p>\n<h2>Conclusion<\/h2>\n<p>These updates allow us to bring feature parity to layers rendered with HeatmapRenderer, while fixing several bugs reported over the last few years. Check out this post by my colleague Mark Harrower, which discusses related heat map updates to the Smart Mapping UI in the Map Viewer.<\/p>\n"}],"authors":[{"ID":6561,"user_firstname":"Kristian","user_lastname":"Ekenes","nickname":"Kristian Ekenes","user_nicename":"kekenes","display_name":"Kristian Ekenes","user_email":"KEkenes@esri.com","user_url":"https:\/\/github.com\/ekenes","user_registered":"2018-03-02 00:18:32","user_description":"Kristian Ekenes is a Principal Product Engineer at Esri specializing in data visualization on the web. He works on the ArcGIS Maps SDK for JavaScript, ArcGIS Arcade, and Map Viewer in ArcGIS Online. Kristian's work focuses on researching and developing new and innovative data visualization capabilities of geospatial data in web maps, Arcade integration in web maps, and applications of generative AI assistants in web maps. Prior to joining Esri, he worked as a GIS Specialist for an environmental consulting company. Kristian has degrees from Brigham Young University and Arizona State University.","user_avatar":"<img data-del=\"avatar\" src='https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png' class='avatar pp-user-avatar avatar-96 photo ' height='96' width='96'\/>"}],"related_articles":[{"ID":1617762,"post_author":"6331","post_date":"2022-06-22 21:35:09","post_date_gmt":"2022-06-23 04:35:09","post_content":"","post_title":"Next-Generation Heat Maps in Map Viewer: Better, faster, smoother, stronger","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"next-generation-heat-maps-mapviewer","to_ping":"","pinged":"","post_modified":"2022-06-22 21:41:51","post_modified_gmt":"2022-06-23 04:41:51","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&#038;p=1617762","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"2","filter":"raw"},{"ID":1622562,"post_author":"6561","post_date":"2022-06-27 09:10:12","post_date_gmt":"2022-06-27 16:10:12","post_content":"","post_title":"How to create heat maps that work at all scales","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"how-to-create-heat-maps-that-work-at-all-scales","to_ping":"","pinged":"","post_modified":"2024-04-12 03:39:16","post_modified_gmt":"2024-04-12 10:39:16","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&#038;p=1622562","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"0","filter":"raw"},{"ID":1615042,"post_author":"4271","post_date":"2022-06-23 13:03:29","post_date_gmt":"2022-06-23 20:03:29","post_content":"","post_title":"What's new in ArcGIS API for JavaScript (version 4.24)","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"whats-new-in-arcgis-api-for-javascript-version-4-24","to_ping":"","pinged":"","post_modified":"2022-11-21 01:46:11","post_modified_gmt":"2022-11-21 09:46:11","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&#038;p=1615042","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"0","filter":"raw"}],"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/card-heatmaps.jpg","wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/banner-heatmaps.jpg"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.9 (Yoast SEO v25.9) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Heat maps now render faster and smoother in the browser<\/title>\n<meta name=\"description\" content=\"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Heat maps now render faster and smoother in the browser\" \/>\n<meta property=\"og:description\" content=\"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\" \/>\n<meta property=\"og:site_name\" content=\"ArcGIS Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/esrigis\/\" \/>\n<meta property=\"article:modified_time\" content=\"2024-04-12T10:39:27+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@ESRI\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":[\"Article\",\"BlogPosting\"],\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\"},\"author\":{\"name\":\"Kristian Ekenes\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b\"},\"headline\":\"Heat maps now render faster and smoother in the browser\",\"datePublished\":\"2022-06-23T20:36:01+00:00\",\"dateModified\":\"2024-04-12T10:39:27+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\"},\"wordCount\":10,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"keywords\":[\"data viz\",\"heat map\",\"heatmap\",\"WebGL\",\"what's new june 2022\"],\"articleSection\":[\"Developers\",\"Mapping\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\",\"name\":\"Heat maps now render faster and smoother in the browser\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\"},\"datePublished\":\"2022-06-23T20:36:01+00:00\",\"dateModified\":\"2024-04-12T10:39:27+00:00\",\"description\":\"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.esri.com\/arcgis-blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Heat maps now render faster and smoother in the browser\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/\",\"name\":\"ArcGIS Blog\",\"description\":\"Get insider info from Esri product teams\",\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.esri.com\/arcgis-blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\",\"name\":\"Esri\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png\",\"width\":400,\"height\":400,\"caption\":\"Esri\"},\"image\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/esrigis\/\",\"https:\/\/x.com\/ESRI\",\"https:\/\/www.linkedin.com\/company\/5311\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b\",\"name\":\"Kristian Ekenes\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png\",\"caption\":\"Kristian Ekenes\"},\"description\":\"Kristian Ekenes is a Principal Product Engineer at Esri specializing in data visualization on the web. He works on the ArcGIS Maps SDK for JavaScript, ArcGIS Arcade, and Map Viewer in ArcGIS Online. Kristian's work focuses on researching and developing new and innovative data visualization capabilities of geospatial data in web maps, Arcade integration in web maps, and applications of generative AI assistants in web maps. Prior to joining Esri, he worked as a GIS Specialist for an environmental consulting company. Kristian has degrees from Brigham Young University and Arizona State University.\",\"sameAs\":[\"https:\/\/github.com\/ekenes\",\"https:\/\/www.linkedin.com\/in\/kristian-ekenes\/\",\"https:\/\/x.com\/kekenes\"],\"gender\":\"male\",\"jobTitle\":\"Principal Product Engineer\",\"worksFor\":\"Esri\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Heat maps now render faster and smoother in the browser","description":"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser","og_locale":"en_US","og_type":"article","og_title":"Heat maps now render faster and smoother in the browser","og_description":"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.","og_url":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser","og_site_name":"ArcGIS Blog","article_publisher":"https:\/\/www.facebook.com\/esrigis\/","article_modified_time":"2024-04-12T10:39:27+00:00","twitter_card":"summary_large_image","twitter_site":"@ESRI","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["Article","BlogPosting"],"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#article","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser"},"author":{"name":"Kristian Ekenes","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b"},"headline":"Heat maps now render faster and smoother in the browser","datePublished":"2022-06-23T20:36:01+00:00","dateModified":"2024-04-12T10:39:27+00:00","mainEntityOfPage":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser"},"wordCount":10,"commentCount":0,"publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"keywords":["data viz","heat map","heatmap","WebGL","what's new june 2022"],"articleSection":["Developers","Mapping"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser","url":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser","name":"Heat maps now render faster and smoother in the browser","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#website"},"datePublished":"2022-06-23T20:36:01+00:00","dateModified":"2024-04-12T10:39:27+00:00","description":"Heat maps in the ArcGIS API for JavaScript are now faster, smoother, and can render more data in the browser than ever before.","breadcrumb":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/heat-maps-now-render-faster-and-smoother-in-the-browser#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.esri.com\/arcgis-blog\/"},{"@type":"ListItem","position":2,"name":"Heat maps now render faster and smoother in the browser"}]},{"@type":"WebSite","@id":"https:\/\/www.esri.com\/arcgis-blog\/#website","url":"https:\/\/www.esri.com\/arcgis-blog\/","name":"ArcGIS Blog","description":"Get insider info from Esri product teams","publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.esri.com\/arcgis-blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization","name":"Esri","url":"https:\/\/www.esri.com\/arcgis-blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2018\/04\/Esri.png","width":400,"height":400,"caption":"Esri"},"image":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/esrigis\/","https:\/\/x.com\/ESRI","https:\/\/www.linkedin.com\/company\/5311\/"]},{"@type":"Person","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b","name":"Kristian Ekenes","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/image\/","url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ekenes-zurich-213x200.png","caption":"Kristian Ekenes"},"description":"Kristian Ekenes is a Principal Product Engineer at Esri specializing in data visualization on the web. He works on the ArcGIS Maps SDK for JavaScript, ArcGIS Arcade, and Map Viewer in ArcGIS Online. Kristian's work focuses on researching and developing new and innovative data visualization capabilities of geospatial data in web maps, Arcade integration in web maps, and applications of generative AI assistants in web maps. Prior to joining Esri, he worked as a GIS Specialist for an environmental consulting company. Kristian has degrees from Brigham Young University and Arizona State University.","sameAs":["https:\/\/github.com\/ekenes","https:\/\/www.linkedin.com\/in\/kristian-ekenes\/","https:\/\/x.com\/kekenes"],"gender":"male","jobTitle":"Principal Product Engineer","worksFor":"Esri","url":"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes"}]}},"text_date":"June 23, 2022","author_name":"Kristian Ekenes","author_page":"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes","custom_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/06\/banner-heatmaps.jpg","primary_product":"ArcGIS Maps SDK for JavaScript","tag_data":[{"term_id":758301,"name":"data viz","slug":"data-viz","term_group":0,"term_taxonomy_id":758301,"taxonomy":"post_tag","description":"","parent":0,"count":9,"filter":"raw"},{"term_id":761092,"name":"heat map","slug":"heat-map","term_group":0,"term_taxonomy_id":761092,"taxonomy":"post_tag","description":"","parent":0,"count":4,"filter":"raw"},{"term_id":765772,"name":"heatmap","slug":"heatmap","term_group":0,"term_taxonomy_id":765772,"taxonomy":"post_tag","description":"","parent":0,"count":3,"filter":"raw"},{"term_id":34641,"name":"WebGL","slug":"webgl","term_group":0,"term_taxonomy_id":34641,"taxonomy":"post_tag","description":"","parent":0,"count":3,"filter":"raw"},{"term_id":765092,"name":"what's new june 2022","slug":"whats-new-june-2022","term_group":0,"term_taxonomy_id":765092,"taxonomy":"post_tag","description":"","parent":0,"count":27,"filter":"raw"}],"category_data":[{"term_id":738191,"name":"Developers","slug":"developers","term_group":0,"term_taxonomy_id":738191,"taxonomy":"category","description":"","parent":0,"count":423,"filter":"raw"},{"term_id":22941,"name":"Mapping","slug":"mapping","term_group":0,"term_taxonomy_id":22941,"taxonomy":"category","description":"","parent":0,"count":2692,"filter":"raw"}],"product_data":[{"term_id":761642,"name":"ArcGIS Location Platform","slug":"platform","term_group":0,"term_taxonomy_id":761642,"taxonomy":"product","description":"","parent":36601,"count":214,"filter":"raw"},{"term_id":36831,"name":"ArcGIS Maps SDK for JavaScript","slug":"js-api-arcgis","term_group":0,"term_taxonomy_id":36831,"taxonomy":"product","description":"","parent":36601,"count":363,"filter":"raw"},{"term_id":36601,"name":"Developers","slug":"developers","term_group":0,"term_taxonomy_id":36601,"taxonomy":"product","description":"","parent":0,"count":763,"filter":"raw"}],"primary_product_link":"https:\/\/www.esri.com\/arcgis-blog\/?s=#&products=js-api-arcgis","_links":{"self":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/1621232","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog"}],"about":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/types\/blog"}],"author":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/users\/6561"}],"replies":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/comments?post=1621232"}],"version-history":[{"count":0,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/1621232\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/media?parent=1621232"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/categories?post=1621232"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/tags?post=1621232"},{"taxonomy":"industry","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/industry?post=1621232"},{"taxonomy":"product","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/product?post=1621232"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}