{"id":1204052,"date":"2021-04-22T10:21:37","date_gmt":"2021-04-22T17:21:37","guid":{"rendered":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1204052"},"modified":"2024-04-12T04:02:48","modified_gmt":"2024-04-12T11:02:48","slug":"data-visualization-in-the-arcgis-api-for-javascript","status":"publish","type":"blog","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript","title":{"rendered":"Data visualization in the ArcGIS API for JavaScript"},"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":[37101,738191,22941],"tags":[30111,758301,759312],"industry":[],"product":[761642,36831,36601],"class_list":["post-1204052","blog","type-blog","status-publish","format-standard","hentry","category-announcements","category-developers","category-mapping","tag-data-visualization","tag-data-viz","tag-whats-new-april-2021","product-platform","product-js-api-arcgis","product-developers"],"acf":{"short_description":"Detailed conceptual guides are now available in the ArcGIS API for JavaScript documentation.","flexible_content":[{"acf_fc_layout":"content","content":"

In addition to the new features released in April 2021<\/a>, the ArcGIS API for JavaScript<\/a> (ArcGIS JS API) published a new set of documentation pages focused on data visualization. These guides can be found under the Visualization<\/a> folder on the ArcGIS JS API home page.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1204132,"id":1204132,"title":"home-page","filename":"home-page.png","filesize":516152,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\/home-page-3","alt":"The data visualization home page in the ArcGIS JS API documentation.","author":"6561","description":"","caption":"","name":"home-page-3","status":"inherit","uploaded_to":1204052,"date":"2021-04-20 00:58:24","modified":"2021-04-20 00:59:18","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":2754,"height":1646,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page.png","medium-width":437,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page.png","medium_large-width":768,"medium_large-height":459,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page.png","large-width":1807,"large-height":1080,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page-1536x918.png","1536x1536-width":1536,"1536x1536-height":918,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page-2048x1224.png","2048x2048-width":2048,"2048x2048-height":1224,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page-778x465.png","card_image-width":778,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page-1807x1080.png","wide_image-width":1807,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/home-page.png"},{"acf_fc_layout":"content","content":"

The Visualization<\/em> folder contains four sections, each consisting of several short pages that provide definitions, best practices, live examples, and code snippets for each topic.<\/p>\n

Let’s explore each of these sections.<\/p>\n

Data-driven styles<\/a> | 3D visualization<\/a> | Techniques and best practices<\/a> | Symbols and color ramps<\/a><\/p>\n

<\/a><\/p>\n

Data-driven styles<\/h2>\n"},{"acf_fc_layout":"image","image":{"ID":1204892,"id":1204892,"title":"styles 3","filename":"styles-3.jpg","filesize":548434,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3.jpg","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\/styles-3","alt":"Various styles in the ArcGIS API for JavaScript","author":"6561","description":"","caption":"The data-driven styles folder contains examples of how to create various styles, such as dot density, relationship, and predominance maps.","name":"styles-3","status":"inherit","uploaded_to":1204052,"date":"2021-04-20 16:18:36","modified":"2021-04-20 16:27:40","menu_order":0,"mime_type":"image\/jpeg","type":"image","subtype":"jpeg","icon":"https:\/\/www.esri.com\/arcgis-blog\/wp-includes\/images\/media\/default.png","width":2012,"height":1162,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3-213x200.jpg","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3.jpg","medium-width":452,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3.jpg","medium_large-width":768,"medium_large-height":444,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3.jpg","large-width":1870,"large-height":1080,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3-1536x887.jpg","1536x1536-width":1536,"1536x1536-height":887,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3.jpg","2048x2048-width":2012,"2048x2048-height":1162,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3-805x465.jpg","card_image-width":805,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/styles-3-1870x1080.jpg","wide_image-width":1870,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/developers.arcgis.com\/javascript\/latest\/visualization\/data-driven-styles\/"},{"acf_fc_layout":"content","content":"

Data-driven styles<\/a> summarizes the various ways you can style layers based on data values whether they come from fields in a layer or an Arcade<\/a> expression.<\/p>\n

Each page in this folder defines a style and when to use it. The definition is followed by a How it works<\/em> section that details the steps to follow for creating the style, including the required renderer and the minimum properties needed for an effective visualization.<\/p>\n

Finally, each page contains a series of examples with live demonstrations that you can open and modify in CodePen<\/a>. Each demo also has a code snippet highlighting key portions of the code.<\/p>\n

Below are direct links to the styles discussed in this chapter.<\/p>\n

Introduction<\/a> | Unique types<\/a> | Class breaks<\/a>| Visual variables<\/a> | Time<\/a> | Multivariate<\/a> | Predominance<\/a> | Dot density<\/a> | Relationship<\/a> | Smart Mapping<\/a><\/p>\n

<\/a><\/p>\n

3D visualization<\/h2>\n"},{"acf_fc_layout":"image","image":{"ID":1204172,"id":1204172,"title":"3d-visualization","filename":"3d-visualization.png","filesize":362909,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\/3d-visualization","alt":"3D visualization home page","author":"6561","description":"","caption":"","name":"3d-visualization","status":"inherit","uploaded_to":1204052,"date":"2021-04-20 01:22:15","modified":"2021-04-20 01:24:11","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":1952,"height":1428,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization.png","medium-width":357,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization.png","medium_large-width":768,"medium_large-height":562,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization.png","large-width":1476,"large-height":1080,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization-1536x1124.png","1536x1536-width":1536,"1536x1536-height":1124,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization.png","2048x2048-width":1952,"2048x2048-height":1428,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization-636x465.png","card_image-width":636,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/3d-visualization-1476x1080.png","wide_image-width":1476,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/developers.arcgis.com\/javascript\/latest\/visualization\/3d-visualization\/"},{"acf_fc_layout":"content","content":"

3D visualization<\/a> shows examples and tips for visualizing data in 3D scenes. It covers topics including how to create a global vs. local scene, how to visualize terrain, and effective ways to display buildings and other objects in city visualizations. Explore these topics by clicking the links below:<\/p>\n

Introduction<\/a> | Globes and local scenes<\/a> | Terrain rendering<\/a> | Cities in 3D<\/a> | Visualizing points with 3D symbols<\/a><\/p>\n

<\/a><\/p>\n

Techniques and best practices<\/h2>\n"},{"acf_fc_layout":"image","image":{"ID":1204192,"id":1204192,"title":"techniques-and-best-practices","filename":"techniques-and-best-practices.png","filesize":265618,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\/techniques-and-best-practices","alt":"Techniques and best practices home page","author":"6561","description":"","caption":"","name":"techniques-and-best-practices","status":"inherit","uploaded_to":1204052,"date":"2021-04-20 01:22:41","modified":"2021-04-20 01:24:42","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":2294,"height":1382,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices.png","medium-width":433,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices.png","medium_large-width":768,"medium_large-height":463,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices.png","large-width":1793,"large-height":1080,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices-1536x925.png","1536x1536-width":1536,"1536x1536-height":925,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices-2048x1234.png","2048x2048-width":2048,"2048x2048-height":1234,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices-772x465.png","card_image-width":772,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/techniques-and-best-practices-1793x1080.png","wide_image-width":1793,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/developers.arcgis.com\/javascript\/latest\/visualization\/best-practices\/"},{"acf_fc_layout":"content","content":"

Techniques and best practices<\/a> contains pages that provide guidelines for creating any visualization. These topics include working with Arcade expressions, how to account for scale, guidance on how to choose a color ramp for your data, and suggestions on when to use a classified color scheme versus a continuous color gradient (unclassified method).<\/p>\n

We’ll continue to add pages to this folder in the coming weeks and months. See the initial list of topics below:<\/p>\n

Introduction<\/a> | Arcade<\/a> | Scale-aware visualizations<\/a> | Choosing a color ramp<\/a> | Class breaks vs. continuous color<\/a><\/p>\n

<\/a><\/p>\n

Symbols and color ramps<\/h2>\n"},{"acf_fc_layout":"image","image":{"ID":694102,"id":694102,"title":"color-ramps2","filename":"color-ramps2.png","filesize":25066,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/better-colors-for-better-mapping\/color-ramps2","alt":"The Esri color ramps page displaying several color ramps that can be easily copied to the clipboard.","author":"6561","description":"","caption":"The Esri color ramps page allows you to browse and filter hundreds of colorblind-friendly color ramps to copy\/paste directly into your apps.","name":"color-ramps2","status":"inherit","uploaded_to":694072,"date":"2020-01-04 00:24:22","modified":"2021-04-20 17:02:02","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":865,"height":423,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","medium-width":464,"medium-height":227,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","medium_large-width":768,"medium_large-height":376,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","large-width":865,"large-height":423,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","1536x1536-width":865,"1536x1536-height":423,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","2048x2048-width":865,"2048x2048-height":423,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2-826x404.png","card_image-width":826,"card_image-height":404,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/01\/color-ramps2.png","wide_image-width":865,"wide_image-height":423}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/developers.arcgis.com\/javascript\/latest\/visualization\/symbols-color-ramps\/"},{"acf_fc_layout":"content","content":"

The Symbols and color ramps<\/a> folder contains pages that have already existed in the ArcGIS JS API documentation for some time. These pages provide resources you can easily copy\/paste into your code, such as 2D and 3D web style symbols, hundreds of color ramps, and an app for building your own CIM symbol (custom vector marker symbols) from scratch.<\/p>\n

The following links are worth bookmarking as they could be a valuable resource when authoring your ArcGIS JS API based web application.<\/p>\n

Introduction<\/a> | color ramps<\/a> | 2D web style symbols<\/a> | 3D web style symbols<\/a> | CIM Symbol Builder<\/a><\/p>\n"},{"acf_fc_layout":"content","content":"

Conclusion<\/h2>\n

We hope the newly added topics on visualization will assist you to make your maps more meaningful and attractive. Please feel free to contact me via email for any feedback or suggestions on topics that you would like covered.<\/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":""}],"related_articles":[{"ID":1206032,"post_author":"4271","post_date":"2021-04-22 11:17:22","post_date_gmt":"2021-04-22 18:17:22","post_content":"","post_title":"What's New in ArcGIS API for JavaScript (version 4.19)","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"whats-new-in-arcgis-api-for-javascript-version-4-19","to_ping":"","pinged":"","post_modified":"2024-04-12 04:02:30","post_modified_gmt":"2024-04-12 11:02:30","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1206032","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"0","filter":"raw"},{"ID":694072,"post_author":"6561","post_date":"2020-01-14 08:30:12","post_date_gmt":"2020-01-14 16:30:12","post_content":"","post_title":"Better colors for better mapping","post_excerpt":"","post_status":"publish","comment_status":"closed","ping_status":"closed","post_password":"","post_name":"better-colors-for-better-mapping","to_ping":"","pinged":"","post_modified":"2024-06-20 12:16:24","post_modified_gmt":"2024-06-20 19:16:24","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=694072","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"0","filter":"raw"},{"ID":1058481,"post_author":"8402","post_date":"2021-09-22 14:35:40","post_date_gmt":"2021-09-22 21:35:40","post_content":"","post_title":"CIM Symbol Builder","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"cim-symbol-builder","to_ping":"","pinged":"","post_modified":"2024-04-12 03:59:00","post_modified_gmt":"2024-04-12 10:59:00","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1058481","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"1","filter":"raw"}],"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/card-3.jpg","wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/banner-4.jpg"},"yoast_head":"\nData visualization in the ArcGIS API for JavaScript<\/title>\n<meta name=\"description\" content=\"Learn about and explore the data visualization guides avaialable in the ArcGIS API for JavaScript documentation.\" \/>\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\/developers\/data-visualization-in-the-arcgis-api-for-javascript\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Data visualization in the ArcGIS API for JavaScript\" \/>\n<meta property=\"og:description\" content=\"Learn about and explore the data visualization guides avaialable in the ArcGIS API for JavaScript documentation.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\" \/>\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-12T11:02:48+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\/developers\/data-visualization-in-the-arcgis-api-for-javascript#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\"},\"author\":{\"name\":\"Kristian Ekenes\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b\"},\"headline\":\"Data visualization in the ArcGIS API for JavaScript\",\"datePublished\":\"2021-04-22T17:21:37+00:00\",\"dateModified\":\"2024-04-12T11:02:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\"},\"wordCount\":8,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"keywords\":[\"data visualization\",\"data viz\",\"what's new april 2021\"],\"articleSection\":[\"Announcements\",\"Developers\",\"Mapping\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\",\"name\":\"Data visualization in the ArcGIS API for JavaScript\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\"},\"datePublished\":\"2021-04-22T17:21:37+00:00\",\"dateModified\":\"2024-04-12T11:02:48+00:00\",\"description\":\"Learn about and explore the data visualization guides avaialable in the ArcGIS API for JavaScript documentation.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.esri.com\/arcgis-blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Data visualization in the ArcGIS API for JavaScript\"}]},{\"@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":"Data visualization in the ArcGIS API for JavaScript","description":"Learn about and explore the data visualization guides avaialable in the ArcGIS API for JavaScript documentation.","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\/developers\/data-visualization-in-the-arcgis-api-for-javascript","og_locale":"en_US","og_type":"article","og_title":"Data visualization in the ArcGIS API for JavaScript","og_description":"Learn about and explore the data visualization guides avaialable in the ArcGIS API for JavaScript documentation.","og_url":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript","og_site_name":"ArcGIS Blog","article_publisher":"https:\/\/www.facebook.com\/esrigis\/","article_modified_time":"2024-04-12T11:02:48+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\/developers\/data-visualization-in-the-arcgis-api-for-javascript#article","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript"},"author":{"name":"Kristian Ekenes","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/5469f723fbfb78138efbb1da56e6aa9b"},"headline":"Data visualization in the ArcGIS API for JavaScript","datePublished":"2021-04-22T17:21:37+00:00","dateModified":"2024-04-12T11:02:48+00:00","mainEntityOfPage":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript"},"wordCount":8,"commentCount":0,"publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"keywords":["data visualization","data viz","what's new april 2021"],"articleSection":["Announcements","Developers","Mapping"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript","url":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript","name":"Data visualization in the ArcGIS API for JavaScript","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#website"},"datePublished":"2021-04-22T17:21:37+00:00","dateModified":"2024-04-12T11:02:48+00:00","description":"Learn about and explore the data visualization guides avaialable in the ArcGIS API for JavaScript documentation.","breadcrumb":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/developers\/data-visualization-in-the-arcgis-api-for-javascript#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.esri.com\/arcgis-blog\/"},{"@type":"ListItem","position":2,"name":"Data visualization in the ArcGIS API for JavaScript"}]},{"@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":"April 22, 2021","author_name":"Kristian Ekenes","author_page":"https:\/\/www.esri.com\/arcgis-blog\/author\/kekenes","custom_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/04\/banner-4.jpg","primary_product":"ArcGIS Maps SDK for JavaScript","tag_data":[{"term_id":30111,"name":"data visualization","slug":"data-visualization","term_group":0,"term_taxonomy_id":30111,"taxonomy":"post_tag","description":"","parent":0,"count":97,"filter":"raw"},{"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":759312,"name":"what's new april 2021","slug":"whats-new-april-2021","term_group":0,"term_taxonomy_id":759312,"taxonomy":"post_tag","description":"","parent":0,"count":18,"filter":"raw"}],"category_data":[{"term_id":37101,"name":"Announcements","slug":"announcements","term_group":0,"term_taxonomy_id":37101,"taxonomy":"category","description":"","parent":0,"count":1962,"filter":"raw"},{"term_id":738191,"name":"Developers","slug":"developers","term_group":0,"term_taxonomy_id":738191,"taxonomy":"category","description":"","parent":0,"count":422,"filter":"raw"},{"term_id":22941,"name":"Mapping","slug":"mapping","term_group":0,"term_taxonomy_id":22941,"taxonomy":"category","description":"","parent":0,"count":2690,"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":362,"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\/1204052","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=1204052"}],"version-history":[{"count":0,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/1204052\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/media?parent=1204052"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/categories?post=1204052"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/tags?post=1204052"},{"taxonomy":"industry","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/industry?post=1204052"},{"taxonomy":"product","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/product?post=1204052"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}