{"id":1024331,"date":"2020-10-05T09:00:07","date_gmt":"2020-10-05T16:00:07","guid":{"rendered":"https:\/\/www.esri.com\/arcgis-blog\/?post_type=blog&p=1024331"},"modified":"2020-10-02T17:35:07","modified_gmt":"2020-10-03T00:35:07","slug":"visualize-electoral-swing-using-composite-symbols","status":"publish","type":"blog","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols","title":{"rendered":"Visualize electoral swing using composite symbols"},"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":[22941],"tags":[26451,717771,30111,29481],"industry":[],"product":[36831,36601],"class_list":["post-1024331","blog","type-blog","status-publish","format-standard","hentry","category-mapping","tag-cartography","tag-cim","tag-data-visualization","tag-elections","product-js-api-arcgis","product-developers"],"acf":{"short_description":"Use dynamic, scalable, composite symbols to map electoral swing in the next election.","flexible_content":[{"acf_fc_layout":"content","content":"

The U.S. presidential election is only one month away, which means we’ll see a lot of maps showing the results of polls, projections, and ultimately results. One of the most common election variables to explore is swing<\/a>.<\/p>\n

Electoral swing measures the change in votes for one or more political parties between two elections. The following map<\/a> shows a traditional swing visualization for the 2012-2016 U.S. presidential election using the ArcGIS API for JavaScript<\/a> (ArcGIS JS API).<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1029411,"id":1029411,"title":"Screen Shot 2020-10-02 at 5.03.22 PM","filename":"Screen-Shot-2020-10-02-at-5.03.22-PM.png","filesize":231389,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/screen-shot-2020-10-02-at-5-03-22-pm","alt":"Republican swing in the 2016 election. Red icons indicate counties where a higher percentage of people voted for the Republican candidate compared to 2012. Blue counties represent a decline in Republican support. Size indicates the strength of the swing.","author":"6561","description":"","caption":"Republican swing in the 2016 election. Red icons indicate counties where a higher percentage of people voted for the Republican candidate compared to 2012. Blue counties represent a decline in Republican support. Size indicates the strength of the swing.","name":"screen-shot-2020-10-02-at-5-03-22-pm","status":"inherit","uploaded_to":1024331,"date":"2020-10-03 00:05:10","modified":"2020-10-03 00:05:54","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":1510,"height":814,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","medium-width":464,"medium-height":250,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","medium_large-width":768,"medium_large-height":414,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","large-width":1510,"large-height":814,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","1536x1536-width":1510,"1536x1536-height":814,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","2048x2048-width":1510,"2048x2048-height":814,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM-826x445.png","card_image-width":826,"card_image-height":445,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2020\/10\/Screen-Shot-2020-10-02-at-5.03.22-PM.png","wide_image-width":1510,"wide_image-height":814}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/codepen.io\/kekenes\/full\/rNegRbQ"},{"acf_fc_layout":"content","content":"

\nExpand to view the Arcade expression used to create this map<\/strong><\/summary>\n
var<\/span> rep12 = $feature.PRS_REP_12;\r\nvar<\/span> rep16 = $feature.PRS_REP_16;\r\nvar<\/span> dem12 = $feature.PRS_DEM_12;\r\nvar<\/span> dem16 = $feature.PRS_DEM_16;\r\nvar<\/span> oth12 = $feature.PRS_OTH_12;\r\nvar<\/span> oth16 = $feature.PRS_OTH_16;\r\nvar<\/span> all12 = Sum(rep12, dem12, oth12);\r\nvar<\/span> all16 = Sum(rep16, dem16, oth16);\r\n\r\nvar<\/span> rep12Share = (rep12\/all12) * 100<\/span>;\r\nvar<\/span> rep16Share = (rep16\/all16) * 100<\/span>;\r\nreturn<\/span> rep16Share - rep12Share;\r\n<\/code><\/pre>\n<\/details>\n
While this map is interesting, it fails to provide context to the swing. For example, there was a significant decrease in Republican support in Utah and Idaho, but those states still overwhelmingly voted Republican in 2016. Did they swing more democratic or did third party votes play a more significant role in the outcome of the election? <\/p>\n
Electoral swing for each party in one map<\/h2>\n"},{"acf_fc_layout":"image","image":{"ID":1024561,"id":1024561,"title":"swing-cim-overview","filename":"swing-cim-overview.png","filesize":137997,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/swing-cim-overview","alt":"Electoral swing in the 2016 U.S. presidential election by state. Solid symbols indicate a growth in support for a party. Hollow symbols indicate a decrease in votes for the party.","author":"6561","description":"","caption":"Electoral swing in the 2016 U.S. presidential election by state. Solid symbols indicate a growth in support for a party. Hollow symbols indicate a decrease in votes for the party.","name":"swing-cim-overview","status":"inherit","uploaded_to":1024331,"date":"2020-09-29 20:05:17","modified":"2020-09-29 20:06: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":1600,"height":797,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview.png","medium-width":464,"medium-height":231,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview.png","medium_large-width":768,"medium_large-height":383,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview.png","large-width":1600,"large-height":797,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview-1536x765.png","1536x1536-width":1536,"1536x1536-height":765,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview.png","2048x2048-width":1600,"2048x2048-height":797,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview-826x411.png","card_image-width":826,"card_image-height":411,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swing-cim-overview.png","wide_image-width":1600,"wide_image-height":797}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/election-2016\/"},{"acf_fc_layout":"content","content":"
Each state and county in this map is assigned a composite (i.e. multi-part) symbol with three symbol layers: a red circle or ring for Republican votes, a blue circle or ring for Democrat votes, and a yellow circle or ring for other votes. <\/p>\n
A filled in circle represents an increase in votes. A ring, or hollow circle, represents a decrease in votes from the previous election.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1026511,"id":1026511,"title":"Screen Shot 2020-09-30 at 9.51.06 AM","filename":"Screen-Shot-2020-09-30-at-9.51.06-AM.png","filesize":8946,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/screen-shot-2020-09-30-at-9-51-06-am","alt":"Legend describing each component of a multipart symbol visualizing electoral swing.","author":"6561","description":"","caption":"","name":"screen-shot-2020-09-30-at-9-51-06-am","status":"inherit","uploaded_to":1024331,"date":"2020-09-30 16:51:27","modified":"2020-09-30 16:51: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":457,"height":125,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM-213x125.png","thumbnail-width":213,"thumbnail-height":125,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","medium-width":457,"medium-height":125,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","medium_large-width":457,"medium_large-height":125,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","large-width":457,"large-height":125,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","1536x1536-width":457,"1536x1536-height":125,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","2048x2048-width":457,"2048x2048-height":125,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","card_image-width":457,"card_image-height":125,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/Screen-Shot-2020-09-30-at-9.51.06-AM.png","wide_image-width":457,"wide_image-height":125}},"image_position":"center","orientation":"horizontal","hyperlink":""},{"acf_fc_layout":"content","content":"
As you zoom in, a label will appear next to each symbol layer indicating the actual change in votes represented by the symbol. At a glance, you immediately see where gains in one party coincide with losses in another.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1024571,"id":1024571,"title":"states-labels","filename":"states-labels.png","filesize":74838,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/states-labels","alt":"Electoral swing in the midwestern states for the 2016 U.S. presidential election.","author":"6561","description":"","caption":"Electoral swing in the midwestern states for the 2016 U.S. presidential election.","name":"states-labels","status":"inherit","uploaded_to":1024331,"date":"2020-09-29 20:08:49","modified":"2020-09-29 20:09: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":996,"height":642,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","medium-width":405,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","medium_large-width":768,"medium_large-height":495,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","large-width":996,"large-height":642,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","1536x1536-width":996,"1536x1536-height":642,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","2048x2048-width":996,"2048x2048-height":642,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels-721x465.png","card_image-width":721,"card_image-height":465,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/states-labels.png","wide_image-width":996,"wide_image-height":642}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/election-2016\/"},{"acf_fc_layout":"content","content":"
For example, Utah County, Utah shows a significant decrease in Republican votes and a significant increase in third party votes, with a slight increase in Democratic votes from 2012-2016.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1024621,"id":1024621,"title":"ut-county-change","filename":"ut-county-change.png","filesize":7636,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/ut-county-change","alt":"Electoral swing in Utah County, Utah in the 2016 U.S. presidential election","author":"6561","description":"","caption":"","name":"ut-county-change","status":"inherit","uploaded_to":1024331,"date":"2020-09-29 20:12:43","modified":"2020-09-29 20:13:16","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":332,"height":169,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change-213x169.png","thumbnail-width":213,"thumbnail-height":169,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","medium-width":332,"medium-height":169,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","medium_large-width":332,"medium_large-height":169,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","large-width":332,"large-height":169,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","1536x1536-width":332,"1536x1536-height":169,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","2048x2048-width":332,"2048x2048-height":169,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","card_image-width":332,"card_image-height":169,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png","wide_image-width":332,"wide_image-height":169}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-county-change.png"},{"acf_fc_layout":"content","content":"
The swing here appears to be significant. Interestingly, this county didn’t shift from right to left as the first map in this article suggests. Rather, it shows a shift from right to center. But how much did that swing matter?<\/p>\n
Add context with swipe<\/h2>\n
I added a Swipe<\/a> widget to allow the user to explore two views of this data. <\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1024671,"id":1024671,"title":"swipe","filename":"swipe.gif","filesize":189368,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/swipe-6","alt":"animation showing the swipe widget provide context to the final election results compared to the change in votes.","author":"6561","description":"","caption":"","name":"swipe-6","status":"inherit","uploaded_to":1024331,"date":"2020-09-29 20:29:18","modified":"2020-09-29 20:29:54","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":600,"height":365,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe-213x200.gif","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","medium-width":429,"medium-height":261,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","medium_large-width":600,"medium_large-height":365,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","large-width":600,"large-height":365,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","1536x1536-width":600,"1536x1536-height":365,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","2048x2048-width":600,"2048x2048-height":365,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","card_image-width":600,"card_image-height":365,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/swipe.gif","wide_image-width":600,"wide_image-height":365}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/election-2016\/"},{"acf_fc_layout":"content","content":"
The left view shows the change between both elections, and the right view shows the actual results. This allows people to view electoral swing in the context of how much that swing actually resulted in a shift in electoral votes.<\/p>\n
While the change in Utah County was large, the third party votes didn’t result in flipping the state, let alone the county because support for the Republican party is so strong there.<\/p>\n"},{"acf_fc_layout":"image","image":{"ID":1024681,"id":1024681,"title":"ut-compare","filename":"ut-compare.png","filesize":63670,"url":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare.png","link":"https:\/\/www.esri.com\/arcgis-blog\/products\/js-api-arcgis\/mapping\/visualize-electoral-swing-using-composite-symbols\/ut-compare","alt":"","author":"6561","description":"","caption":"On the left: Change in votes for each party between the 2012 and 2016 U.S. presidential elections in Utah County, Utah. On the right: voting results per party in the 2016 U.S. presidential election in Utah County, Utah.","name":"ut-compare","status":"inherit","uploaded_to":1024331,"date":"2020-09-29 20:32:46","modified":"2020-09-29 20:34:41","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":1600,"height":695,"sizes":{"thumbnail":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare-213x200.png","thumbnail-width":213,"thumbnail-height":200,"medium":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare.png","medium-width":464,"medium-height":202,"medium_large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare.png","medium_large-width":768,"medium_large-height":334,"large":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare.png","large-width":1600,"large-height":695,"1536x1536":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare-1536x667.png","1536x1536-width":1536,"1536x1536-height":667,"2048x2048":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare.png","2048x2048-width":1600,"2048x2048-height":695,"card_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare-826x359.png","card_image-width":826,"card_image-height":359,"wide_image":"https:\/\/www.esri.com\/arcgis-blog\/app\/uploads\/2021\/10\/ut-compare.png","wide_image-width":1600,"wide_image-height":695}},"image_position":"center","orientation":"horizontal","hyperlink":"https:\/\/ekenes.github.io\/election-2016\/"},{"acf_fc_layout":"content","content":"
Download or clone the code<\/a> used to create this app to try this technique with your own data. <\/p>\n
The remainder of this post explores some of the data and provides details on how this map was made.<\/p>\n
These questions led to the creation of the following app<\/a>, which visualizes the swing, or change in votes for each party, on a state and county level.<\/p>\n