{"id":1524382,"date":"2022-03-29T13:46:56","date_gmt":"2022-03-29T20:46:56","guid":{"rendered":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1524382"},"modified":"2025-04-02T09:27:05","modified_gmt":"2025-04-02T16:27:05","slug":"preparing-your-data-for-use-with-the-flowrenderer","status":"publish","type":"blog","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer","title":{"rendered":"Preparing your data for use with the FlowRenderer"},"author":10062,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","format":"standard","meta":{"_acf_changed":false,"_searchwp_excluded":""},"categories":[22941],"tags":[763242,760312,127982,29991,764082],"industry":[],"product":[36831,36551],"class_list":["post-1524382","blog","type-blog","status-publish","format-standard","hentry","category-mapping","tag-animated-flow","tag-arcgis-image-for-arcgis-online","tag-jsapi","tag-raster-analysis","tag-whats-new-march-2022","product-js-api-arcgis","product-arcgis-online"],"acf":{"short_description":"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for flow visualization. ","flexible_content":[{"acf_fc_layout":"content","content":"

In the March release of Map Viewer<\/a> and the ArcGIS API for JavaScript<\/a>, we introduced an exciting new flow style to visualize magnitude and direction in imagery layers.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1524432,"id":1524432,"title":"flow-with-vv2","filename":"flow-with-vv2.gif","filesize":2442194,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/flow-with-vv2","alt":"FlowRenderer","author":"10062","description":"","caption":"Wind flow, visualized with the FlowRenderer.","name":"flow-with-vv2","status":"inherit","uploaded_to":1524382,"date":"2022-03-22 20:28:49","modified":"2022-03-22 20:29:41","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":750,"height":375,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2-213x200.gif","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","medium-width":464,"medium-height":232,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","medium_large-width":750,"medium_large-height":375,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","large-width":750,"large-height":375,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","1536x1536-width":750,"1536x1536-height":375,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","2048x2048-width":750,"2048x2048-height":375,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","card_image-width":750,"card_image-height":375,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-with-vv2.gif","wide_image-width":750,"wide_image-height":375}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/developers.arcgis.com\/javascript\/latest\/sample-code\/layers-imagery-afrenderer\/"},{"acf_fc_layout":"content","content":"

While we do provide some layers that work well with this new style in the Living Atlas, you probably want to know how you can use this new style with your own data. If so, you’ve come to the right place! Today, I’m going to walk you through how you can publish data and prepare it for use with the Flow style, all within ArcGIS Online.<\/p>\n

Step 1: Get the data<\/h2>\n

To create a flow visualization, your raster data must be comprised of either a pairing of magnitude\/direction<\/strong> or U\/V<\/strong> where U and V represent the horizontal and vertical components of a vector respectively. As long as the data has fields representing magnitude and direction or U and V, then the dataset can be used to visualize flow.<\/strong><\/p>\n

This dataset\u00a0from the North American Land Data Assimilation System<\/a> contains U and V fields representing wind speed at an hourly time period over the past 43 years.<\/p>\n

To download the data, first create an Earthdata account<\/a>. Then, click Subset \/ Get data<\/code>. Since we don\u2019t want to download all the data (there\u2019s so much data – it would take a long time to download everything!), select download method Get file subsets<\/code>, specify the date range you want, and select UGRD<\/code> and VGRD<\/code>, which will be used to calculate magnitude and velocity. Then, select netCDF<\/code> as the output format.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1524582,"id":1524582,"title":"Screen Shot 2022-03-22 at 2.06.19 PM","filename":"Screen-Shot-2022-03-22-at-2.06.19-PM.png","filesize":89896,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-22-at-2-06-19-pm","alt":"downloading NLDAS data","author":"10062","description":"","caption":"Downloading NLDAS data for August 30th, 2021. Notice how the U and V variables are selected.","name":"screen-shot-2022-03-22-at-2-06-19-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-22 21:07:19","modified":"2022-03-22 21:08: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":923,"height":921,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","medium-width":262,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","medium_large-width":768,"medium_large-height":766,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","large-width":923,"large-height":921,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","1536x1536-width":923,"1536x1536-height":921,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","2048x2048-width":923,"2048x2048-height":921,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM-466x465.png","card_image-width":466,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-2.06.19-PM.png","wide_image-width":923,"wide_image-height":921}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/disc.gsfc.nasa.gov\/datasets\/NLDAS_FORA0125_H_002\/summary?keywords=NLDAS"},{"acf_fc_layout":"content","content":"

Click Get data<\/code> and use the links provided to download the data. Since this is hourly data, a link will be provided for each hour in the date range you selected. If you just want to show the data at one slice in time, you only need to download one of the links.<\/p>\n

Step 2: Publish the data<\/h2>\n

Now that you have your data, the next step is to publish it as a dynamic imagery or tiled imagery layer. Log in to ArcGIS Online or your portal instance, and go to the Content<\/code> tab. Use the Add Item<\/code> button to start the process of publishing your data.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1525062,"id":1525062,"title":"Screen Shot 2022-03-22 at 3.15.39 PM","filename":"Screen-Shot-2022-03-22-at-3.15.39-PM.png","filesize":207981,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-22-at-3-15-39-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-22-at-3-15-39-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-22 22:18:09","modified":"2022-03-22 22:18:09","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":386,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM.png","medium-width":464,"medium-height":78,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM.png","medium_large-width":768,"medium_large-height":129,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM.png","large-width":1920,"large-height":323,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM-1536x258.png","1536x1536-width":1536,"1536x1536-height":258,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM-2048x345.png","2048x2048-width":2048,"2048x2048-height":345,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM-826x139.png","card_image-width":826,"card_image-height":139,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.15.39-PM-1920x323.png","wide_image-width":1920,"wide_image-height":323}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/www.arcgis.com\/home\/content.html"},{"acf_fc_layout":"content","content":"

In the New item menu that appears, select Imagery layer<\/code>.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1525192,"id":1525192,"title":"Screen Shot 2022-03-22 at 3.32.27 PM","filename":"Screen-Shot-2022-03-22-at-3.32.27-PM.png","filesize":127111,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-22-at-3-32-27-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-22-at-3-32-27-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-22 22:33:09","modified":"2022-03-22 22:33:09","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":2148,"height":1372,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM.png","medium-width":409,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM.png","medium_large-width":768,"medium_large-height":491,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM.png","large-width":1691,"large-height":1080,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM-1536x981.png","1536x1536-width":1536,"1536x1536-height":981,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM-2048x1308.png","2048x2048-width":2048,"2048x2048-height":1308,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM-728x465.png","card_image-width":728,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-3.32.27-PM-1691x1080.png","wide_image-width":1691,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"sidebar","content":"

To host imagery in\u00a0ArcGIS Online<\/span>, you\u2019ll need an\u00a0ArcGIS Image for ArcGIS Online<\/span>\u00a0user type extension<\/a>\u00a0for your\u00a0ArcGIS Online<\/span>\u00a0organization. The organization administrator can then enable imagery layer creation (or imagery analysis) privileges for individual users.<\/p>\n","image_reference":false,"layout":"standard","image_reference_figure":"","snippet":"","spotlight_name":"","section_title":"","position":"Center","spotlight_image":false},{"acf_fc_layout":"content","content":"

Then, complete the following steps.<\/p>\n

    \n
  1. Select layer type:<\/strong> Tiled Imagery Layer or Dynamic Imagery Layer. Both layer types work with the FlowRenderer, but the Tiled Imagery Layer will give you faster performance<\/strong>.<\/li>\n
  2. Configure layer:<\/strong>\u00a0Choose One Image<\/strong> if the data is stored in a single file, or choose One Mosaicked Image<\/strong> if the data is stored in multiple files.<\/li>\n
  3. Define imagery:\u00a0<\/strong>Choose the raster type that describes the imagery files, then add image files to the Select input imagery box.<\/li>\n
  4. Set item details:\u00a0<\/strong>Give the layer a name and description and select Create<\/code> to publish it.<\/li>\n<\/ol>\n

    Once publishing has completed, you should be able to view the item’s page that contains information about the data you’ve just published – here’s mine<\/a>.<\/p>\n"},{"acf_fc_layout":"content","content":"

    Step 3: Process the data<\/h2>\n

    The FlowRenderer only supports ImageryLayers or ImageryTileLayers with a source type of Vector-MagDir<\/code> or Vector-UV<\/code>. The layer we just published has a source type of Scientific<\/code> – so we need to do some image processing before we can use this data with the Flow style.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1532422,"id":1532422,"title":"Screen Shot 2022-03-25 at 10.15.48 AM","filename":"Screen-Shot-2022-03-25-at-10.15.48-AM.png","filesize":107431,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-25-at-10-15-48-am","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-25-at-10-15-48-am","status":"inherit","uploaded_to":1524382,"date":"2022-03-25 17:17:42","modified":"2022-03-25 17:17: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":1228,"height":748,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","medium-width":428,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","medium_large-width":768,"medium_large-height":468,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","large-width":1228,"large-height":748,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","1536x1536-width":1228,"1536x1536-height":748,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","2048x2048-width":1228,"2048x2048-height":748,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM-763x465.png","card_image-width":763,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-25-at-10.15.48-AM.png","wide_image-width":1228,"wide_image-height":748}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    I\u2019m going to walk through how to process data in ArcGIS Online using the raster analysis capabilities in Map Viewer Classic. Check out Visualize raster using a vector field in ArcGIS<\/a>\u00a0for more information about the different options for processing data in ArcGIS Pro and ArcGIS Online.<\/p>\n

    Open the layer in Map Viewer Classic. Since this is an ImageryTileLayer, only the variables on the client will be available for analysis. To work around this, make a copy of the layer, and update the variable selected in the Multidimensional Filter<\/code>. One layer should be displaying ugrd<\/code> and the other should be displaying vgrd<\/code>. If you are using a dynamic imagery layer, you can skip this step.<\/p>\n

    Now we are ready to perform the analysis. Get started by selecting the Analysis<\/code> tab.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1525582,"id":1525582,"title":"Screen Shot 2022-03-22 at 4.29.35 PM","filename":"Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","filesize":43637,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-22-at-4-29-35-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-22-at-4-29-35-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-22 23:30:15","modified":"2022-03-22 23:30: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":400,"height":307,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","medium-width":340,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","medium_large-width":400,"medium_large-height":307,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","large-width":400,"large-height":307,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","1536x1536-width":400,"1536x1536-height":307,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","2048x2048-width":400,"2048x2048-height":307,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-606x465.png","card_image-width":606,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-22-at-4.29.35-PM-e1647993259620.png","wide_image-width":400,"wide_image-height":307}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    Select Raster Analysis<\/code>. We need to convert our Scientific<\/code> imagery layer to the supported Vector-MagDir<\/code> source type. To do this, we need to create a new raster function by clicking on the Raster Function Editor<\/code> button shown in the red circle below.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1528652,"id":1528652,"title":"Screen Shot 2022-03-23 at 11.53.19 AM","filename":"Screen-Shot-2022-03-23-at-11.53.19-AM.png","filesize":16395,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-23-at-11-53-19-am","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-23-at-11-53-19-am","status":"inherit","uploaded_to":1524382,"date":"2022-03-23 18:56:15","modified":"2022-03-23 18:56: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":400,"height":346,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","medium-width":302,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","medium_large-width":400,"medium_large-height":346,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","large-width":400,"large-height":346,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","1536x1536-width":400,"1536x1536-height":346,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","2048x2048-width":400,"2048x2048-height":346,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","card_image-width":400,"card_image-height":346,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-11.53.19-AM.png","wide_image-width":400,"wide_image-height":346}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    Search for Multidimensional Filter<\/code> and Vector Field<\/code> in the panel on the left. We are going to pass each variable (U<\/code> and V<\/code>) through a multidimensional filter, then output it as a vector field. In the top right, click the Add Raster Variable<\/code> button to add two raster variables to your template. Then chain these together, similar to the image below.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1528992,"id":1528992,"title":"Screen Shot 2022-03-23 at 1.26.10 PM","filename":"Screen-Shot-2022-03-23-at-1.26.10-PM.png","filesize":79875,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-23-at-1-26-10-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-23-at-1-26-10-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-23 20:27:56","modified":"2022-03-23 20:27:56","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":2398,"height":1300,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM.png","medium-width":464,"medium-height":252,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM.png","medium_large-width":768,"medium_large-height":416,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM.png","large-width":1920,"large-height":1041,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM-1536x833.png","1536x1536-width":1536,"1536x1536-height":833,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM-2048x1110.png","2048x2048-width":2048,"2048x2048-height":1110,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM-826x448.png","card_image-width":826,"card_image-height":448,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-1.26.10-PM-1920x1041.png","wide_image-width":1920,"wide_image-height":1041}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    You can save the raster function template using the Save As<\/code> button to allow for easier configuration in the future. Click OK<\/code> to continue and prepare for raster analysis.<\/p>\n

    When selecting your input data, point one raster to your original layer and the second raster to your copied layer. This will allow you to select both your ugrd<\/code> and vgrd<\/code> variables. If using a dynamic imagery layer, you can use the same layer as your raster both times, but make sure to select a variable representing U<\/code> or Magnitude<\/code> for one, and V<\/code> or Direction<\/code> for the other.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1529512,"id":1529512,"title":"Screen Shot 2022-03-23 at 5.05.43 PM","filename":"Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","filesize":62186,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-23-at-5-05-43-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-23-at-5-05-43-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-24 00:06:57","modified":"2022-03-24 00:15:19","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":400,"height":605,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","medium-width":173,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","medium_large-width":400,"medium_large-height":605,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","large-width":400,"large-height":605,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","1536x1536-width":400,"1536x1536-height":605,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-e1648080916583.png","2048x2048-width":400,"2048x2048-height":605,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-308x465.png","card_image-width":308,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.05.43-PM-714x1080.png","wide_image-width":714,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    Since we are providing UV<\/code> variables, I am going to select U-V<\/code> as my input data type. For my output data type, I will select Magnitude-Direction<\/code>.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1529522,"id":1529522,"title":"Screen Shot 2022-03-23 at 5.10.12 PM","filename":"Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","filesize":15859,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-23-at-5-10-12-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-23-at-5-10-12-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-24 00:10:27","modified":"2022-03-24 00:15:04","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":400,"height":193,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","medium-width":400,"medium-height":193,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","medium_large-width":400,"medium_large-height":193,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","large-width":400,"large-height":193,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","1536x1536-width":400,"1536x1536-height":193,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","2048x2048-width":400,"2048x2048-height":193,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","card_image-width":400,"card_image-height":193,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-23-at-5.10.12-PM-e1648080895811.png","wide_image-width":400,"wide_image-height":193}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    Finally we can give the resulting layer a name, and run the analysis. A new layer<\/a> will be created with a source type of Vector-MagDir<\/code>. We can now use this layer with the FlowRenderer in either the Map Viewer or the ArcGIS API for JavaScript.<\/p>\n

    Step 4: Visualize the data<\/h2>\n

    Flow style in the Map Viewer<\/h3>\n

    From your new layer\u2019s item page, select\u00a0Open in Map Viewer<\/code>. You should see the layer displayed in the map with vector field arrows displayed initially. To update the style, click the Styles<\/code>\u00a0button (\"\") in the action bar on the right. This will open a panel of styles to choose from. Select\u00a0Flow<\/code> and the layer will update in the map.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1530832,"id":1530832,"title":"Screen Shot 2022-03-24 at 12.29.17 PM","filename":"Screen-Shot-2022-03-24-at-12.29.17-PM-scaled.png","filesize":3722181,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-scaled.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-24-at-12-29-17-pm","alt":"","author":"10062","description":"","caption":"","name":"screen-shot-2022-03-24-at-12-29-17-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-24 19:29:32","modified":"2022-03-24 19:29:32","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":2560,"height":1394,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-scaled.png","medium-width":464,"medium-height":253,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-scaled.png","medium_large-width":768,"medium_large-height":418,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-scaled.png","large-width":1920,"large-height":1046,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-1536x836.png","1536x1536-width":1536,"1536x1536-height":836,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-2048x1115.png","2048x2048-width":2048,"2048x2048-height":1115,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-826x450.png","card_image-width":826,"card_image-height":450,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-12.29.17-PM-1920x1045.png","wide_image-width":1920,"wide_image-height":1045}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"

    Style options<\/code>\u00a0allows you to change the theme, speed, density, length, width, color, and direction of the flow. Play around with these settings and add some layer effects until you have\u00a0your desired visualization.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1530852,"id":1530852,"title":"flow-mapviewer","filename":"flow-mapviewer.gif","filesize":5108029,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/flow-mapviewer","alt":"","author":"10062","description":"","caption":"","name":"flow-mapviewer","status":"inherit","uploaded_to":1524382,"date":"2022-03-24 20:02:43","modified":"2022-03-24 20:02:43","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":1001,"height":468,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer-213x200.gif","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","medium-width":464,"medium-height":217,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","medium_large-width":768,"medium_large-height":359,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","large-width":1001,"large-height":468,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","1536x1536-width":1001,"1536x1536-height":468,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","2048x2048-width":1001,"2048x2048-height":468,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer-826x386.gif","card_image-width":826,"card_image-height":386,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/flow-mapviewer.gif","wide_image-width":1001,"wide_image-height":468}},"image_position":"center","orientation":"horizontal","hyperlink":"http:\/\/arcgis.com\/apps\/mapviewer\/index.html?webmap=47e30466f8a241b2a5a8dd765a83fad9"},{"acf_fc_layout":"content","content":"

    You can use the TimeSlider (\"\") to explore the data at different time slices. When the TimeSlider is not shown, the layer will display data at the first time slice by default.<\/p>\n

    To learn more about the new Flow style in the Map Viewer, check out Map Viewer introduces animated Flow renderer<\/a>.<\/p>\n

    FlowRenderer in the ArcGIS API for JavaScript<\/h3>\n

    We can also visualize the layer we created earlier using the FlowRenderer<\/a> in the ArcGIS API for JavaScript. To do so, we need to load the layer as an ImageryTileLayer<\/a>, apply the FlowRenderer, and add it to the map.<\/p>\n

    \r\nrequire<\/span>([\"esri\/layers\/ImageryTileLayer\"<\/span>, \"esri\/renderers\/FlowRenderer\"<\/span>],\r\n  function<\/span>(ImageryTileLayer, FlowRenderer) { \r\n     let<\/span> layer = new<\/span> ImageryTileLayer({\r\n        portalItem: {\r\n          \/\/ portal item id can be found in url of item page\r\n          id: \"e400c62a545249c4bf80e7fe32b8b3c8\"<\/span>,\r\n        },\r\n        renderer: new<\/span> FlowRenderer() \r\n     });\r\n     map.add(layer);\r\n  });\r\n<\/code><\/pre>\n
    To learn more about the different properties you can set on FlowRenderer, check out this blog post on how to Create an animated flow visualization with the ArcGIS API for JavaScript<\/a>. There are also a couple of FlowRenderer samples<\/a> in the JS API documentation where you can learn more. Happy mapping! ?<\/p>\n"}],"authors":[{"ID":10062,"user_firstname":"Anne","user_lastname":"Fitz","nickname":"Anne Fitz","user_nicename":"afitz","display_name":"Anne Fitz","user_email":"afitz@esri.com","user_url":"","user_registered":"2019-10-15 00:07:57","user_description":"Anne Fitz is a Senior Product Engineer at Esri, working on the ArcGIS Maps SDK for JavaScript and ArcGIS Arcade. Her expertise primarily focuses on dynamic vector symbology (CIM symbols), data visualization, animation, ArcGIS Arcade integration, and widgets.  Anne\u2019s primary goal is to help developers succeed in building geospatial applications, providing them with the tools and knowledge they need to bring their ideas to life. She has been with Esri for over five years.","user_avatar":""}],"related_articles":[{"ID":1424422,"post_author":"10062","post_date":"2022-03-23 10:00:22","post_date_gmt":"2022-03-23 17:00:22","post_content":"","post_title":"Create an animated flow visualization with the ArcGIS API for JavaScript","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"create-an-animated-flow-visualization-with-the-arcgis-api-for-javascript","to_ping":"","pinged":"","post_modified":"2022-03-23 11:12:30","post_modified_gmt":"2022-03-23 18:12:30","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1424422","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"0","filter":"raw"},{"ID":1502612,"post_author":"6331","post_date":"2022-03-22 21:50:22","post_date_gmt":"2022-03-23 04:50:22","post_content":"","post_title":"Map Viewer introduces animated Flow renderer","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"flow-renderer","to_ping":"","pinged":"","post_modified":"2022-03-22 21:55:40","post_modified_gmt":"2022-03-23 04:55:40","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1502612","menu_order":0,"post_type":"blog","post_mime_type":"","comment_count":"0","filter":"raw"},{"ID":1519642,"post_author":"4271","post_date":"2022-03-23 10:10:51","post_date_gmt":"2022-03-23 17:10:51","post_content":"","post_title":"What's new in ArcGIS API for JavaScript (4.23)","post_excerpt":"","post_status":"publish","comment_status":"open","ping_status":"closed","post_password":"","post_name":"whats-new-in-arcgis-api-for-javascript-4-23","to_ping":"","pinged":"","post_modified":"2022-11-21 01:48:30","post_modified_gmt":"2022-11-21 09:48:30","post_content_filtered":"","post_parent":0,"guid":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1519642","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\/03\/Screen-Shot-2022-03-24-at-4.42.54-PM.png","wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.37.40-PM.png","show_article_image":false},"yoast_head":"\nPreparing your data for use with the FlowRenderer<\/title>\n<meta name=\"description\" content=\"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for visualization with the FlowRenderer.\" \/>\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\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Preparing your data for use with the FlowRenderer\" \/>\n<meta property=\"og:description\" content=\"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for visualization with the FlowRenderer.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\" \/>\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=\"2025-04-02T16:27:05+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@ESRI\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"9 minutes\" \/>\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\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#article\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\"},\"author\":{\"name\":\"Anne Fitz\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/bee793ed8139187e84c18559765490fa\"},\"headline\":\"Preparing your data for use with the FlowRenderer\",\"datePublished\":\"2022-03-29T20:46:56+00:00\",\"dateModified\":\"2025-04-02T16:27:05+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\"},\"wordCount\":8,\"commentCount\":3,\"publisher\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#organization\"},\"keywords\":[\"animated flow\",\"ArcGIS Image for ArcGIS Online\",\"jsapi\",\"raster analysis\",\"whats new march 2022\"],\"articleSection\":[\"Mapping\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\",\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\",\"name\":\"Preparing your data for use with the FlowRenderer\",\"isPartOf\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/#website\"},\"datePublished\":\"2022-03-29T20:46:56+00:00\",\"dateModified\":\"2025-04-02T16:27:05+00:00\",\"description\":\"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for visualization with the FlowRenderer.\",\"breadcrumb\":{\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.esri.com\/arcgis-blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Preparing your data for use with the FlowRenderer\"}]},{\"@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\/bee793ed8139187e84c18559765490fa\",\"name\":\"Anne Fitz\",\"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\/2023\/03\/2B6A1033-465x465.jpg\",\"contentUrl\":\"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2023\/03\/2B6A1033-465x465.jpg\",\"caption\":\"Anne Fitz\"},\"description\":\"Anne Fitz is a Senior Product Engineer at Esri, working on the ArcGIS Maps SDK for JavaScript and ArcGIS Arcade. Her expertise primarily focuses on dynamic vector symbology (CIM symbols), data visualization, animation, ArcGIS Arcade integration, and widgets. Anne\u2019s primary goal is to help developers succeed in building geospatial applications, providing them with the tools and knowledge they need to bring their ideas to life. She has been with Esri for over five years.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/anne-fitz\"],\"url\":\"https:\/\/www.esri.com\/arcgis-blog\/author\/afitz\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Preparing your data for use with the FlowRenderer","description":"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for visualization with the FlowRenderer.","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\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer","og_locale":"en_US","og_type":"article","og_title":"Preparing your data for use with the FlowRenderer","og_description":"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for visualization with the FlowRenderer.","og_url":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer","og_site_name":"ArcGIS Blog","article_publisher":"https:\/\/www.facebook.com\/esrigis\/","article_modified_time":"2025-04-02T16:27:05+00:00","twitter_card":"summary_large_image","twitter_site":"@ESRI","twitter_misc":{"Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["Article","BlogPosting"],"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#article","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer"},"author":{"name":"Anne Fitz","@id":"https:\/\/www.esri.com\/arcgis-blog\/#\/schema\/person\/bee793ed8139187e84c18559765490fa"},"headline":"Preparing your data for use with the FlowRenderer","datePublished":"2022-03-29T20:46:56+00:00","dateModified":"2025-04-02T16:27:05+00:00","mainEntityOfPage":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer"},"wordCount":8,"commentCount":3,"publisher":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#organization"},"keywords":["animated flow","ArcGIS Image for ArcGIS Online","jsapi","raster analysis","whats new march 2022"],"articleSection":["Mapping"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer","url":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer","name":"Preparing your data for use with the FlowRenderer","isPartOf":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/#website"},"datePublished":"2022-03-29T20:46:56+00:00","dateModified":"2025-04-02T16:27:05+00:00","description":"The FlowRenderer uses raster layers with magnitude and direction to visualize flow. Learn how to prepare your data for visualization with the FlowRenderer.","breadcrumb":{"@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.esri.com\/arcgis-blog\/"},{"@type":"ListItem","position":2,"name":"Preparing your data for use with the FlowRenderer"}]},{"@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\/bee793ed8139187e84c18559765490fa","name":"Anne Fitz","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\/2023\/03\/2B6A1033-465x465.jpg","contentUrl":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2023\/03\/2B6A1033-465x465.jpg","caption":"Anne Fitz"},"description":"Anne Fitz is a Senior Product Engineer at Esri, working on the ArcGIS Maps SDK for JavaScript and ArcGIS Arcade. Her expertise primarily focuses on dynamic vector symbology (CIM symbols), data visualization, animation, ArcGIS Arcade integration, and widgets. Anne\u2019s primary goal is to help developers succeed in building geospatial applications, providing them with the tools and knowledge they need to bring their ideas to life. She has been with Esri for over five years.","sameAs":["https:\/\/www.linkedin.com\/in\/anne-fitz"],"url":"https:\/\/www.esri.com\/arcgis-blog\/author\/afitz"}]}},"text_date":"March 29, 2022","author_name":"Anne Fitz","author_page":"https:\/\/www.esri.com\/arcgis-blog\/author\/afitz","custom_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.37.40-PM.png","primary_product":"ArcGIS Online","tag_data":[{"term_id":763242,"name":"animated flow","slug":"animated-flow","term_group":0,"term_taxonomy_id":763242,"taxonomy":"post_tag","description":"","parent":0,"count":2,"filter":"raw"},{"term_id":760312,"name":"ArcGIS Image for ArcGIS Online","slug":"arcgis-image-for-arcgis-online","term_group":0,"term_taxonomy_id":760312,"taxonomy":"post_tag","description":"","parent":0,"count":15,"filter":"raw"},{"term_id":127982,"name":"jsapi","slug":"jsapi","term_group":0,"term_taxonomy_id":127982,"taxonomy":"post_tag","description":"","parent":0,"count":7,"filter":"raw"},{"term_id":29991,"name":"raster analysis","slug":"raster-analysis","term_group":0,"term_taxonomy_id":29991,"taxonomy":"post_tag","description":"","parent":0,"count":58,"filter":"raw"},{"term_id":764082,"name":"whats new march 2022","slug":"whats-new-march-2022","term_group":0,"term_taxonomy_id":764082,"taxonomy":"post_tag","description":"","parent":0,"count":27,"filter":"raw"}],"category_data":[{"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":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":36551,"name":"ArcGIS Online","slug":"arcgis-online","term_group":0,"term_taxonomy_id":36551,"taxonomy":"product","description":"","parent":0,"count":2428,"filter":"raw"}],"primary_product_link":"https:\/\/www.esri.com\/arcgis-blog\/?s=#&products=arcgis-online","_links":{"self":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/1524382","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\/10062"}],"replies":[{"embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/comments?post=1524382"}],"version-history":[{"count":0,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/blog\/1524382\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/media?parent=1524382"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/categories?post=1524382"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/tags?post=1524382"},{"taxonomy":"industry","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/industry?post=1524382"},{"taxonomy":"product","embeddable":true,"href":"https:\/\/www.esri.com\/arcgis-blog\/wp-json\/wp\/v2\/product?post=1524382"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
    This will apply the FlowRenderer to the layer with default rendering at the first time slice available in the layer. Use the TimeSlider<\/a> or update the multidimensionalDefinition<\/a> of your layer to view the data at a different time slice.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1531222,"id":1531222,"title":"Screen Shot 2022-03-24 at 4.17.47 PM","filename":"Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506.png","filesize":3920598,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/arcgis-online\/mapping\/preparing-your-data-for-use-with-the-flowrenderer\/screen-shot-2022-03-24-at-4-17-47-pm","alt":"","author":"10062","description":"","caption":"FlowRenderer with default rendering applied in the ArcGIS API for JavaScript.","name":"screen-shot-2022-03-24-at-4-17-47-pm","status":"inherit","uploaded_to":1524382,"date":"2022-03-24 23:18:22","modified":"2022-03-24 23:18:45","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":2369,"height":1578,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-392x261.png","medium-width":392,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-768x512.png","medium_large-width":768,"medium_large-height":512,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-1621x1080.png","large-width":1621,"large-height":1080,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-1536x1023.png","1536x1536-width":1536,"1536x1536-height":1023,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-2048x1364.png","2048x2048-width":2048,"2048x2048-height":1364,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-698x465.png","card_image-width":698,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2022\/03\/Screen-Shot-2022-03-24-at-4.17.47-PM-e1648165499506-1621x1080.png","wide_image-width":1621,"wide_image-height":1080}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"