Adding charts and graphs to note popups with HTML

On January 11, 2010, in Uncategorized, by arcgis-explorer-team

As mentioned in previous posts popups are an excellent and easy way to add content to your map.  Popups are found on notes as well as views and can be used to display a variety of information such as text, photos, web sites, videos, and more. 


Using HTML you can display formatted and non-formatted text strings, as well as more advanced things such as images and even graphs.  Suppose I’ve highlighted a section of my map with an area note that overlaps some of my own data or data coming from ArcGIS Online (census information, for example).  You may want to display a summary of that information in the note popup using HTML and a chart API. Here we’re using the Google chart API to accomplish that.



The HTML to make this note is relatively simple and looks like this:



In the first line we add the title “Gender” in bold. After adding a blank line we create our chart popup image by calling the Google chart API using the following parameters:


cht – chart type (p3 for pie chart)
chd – chart data (t is for text encoding, followed by the data to be used as percentages)
chs – chart size in pixels
chl – chart labels


Then we add a few more blank lines followed by a similar syntax for charting age.


It can be tedious to enter this information by hand, so you may find it easier to add this type of content via an Add-In.  The Query Demographics sample in the SDK Help demonstrates how to programmatically query census information from ArcGIS Online and create the chart content above.


(Submitted by: Larry Young, ArcGIS Explorer Team)

Tagged with:  

Leave a Reply