Tag Archives: HTML
As the administrator of your organization, you can create a compelling and attractive home page using easy-to-configure settings. And with a little bit of HTML know-how you can do even more. In this post we’ll take a closer look at how to enhance your organization’s home both visually and functionally.
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)
Popups are an easy way to add lots of different content to your map, and are found with notes as well as views. Here we’ll cover the basics of popups, and how you can display text, photos, Web sites, and more.
First, we’ll start with a very basic example. Here we’ve added a note, and typed a string into the popup (in popup edit mode).
Now when we show the popup, the results are pretty obvious and exactly as you’d expect.
Now let’s spruce things up a bit and add some inline HTML to add some bold and italic text.
And here’s how the popup looks now. A nice little improvement.
Want to show a photo in the popup? It’s easy. Just enter the path to the photo.
And here’s the photo displayed in the poup.
But remember that local paths are not accessible to others if you want to share your note or map. You could put the photo on a common location that’s accessible to others within your company, but a Web location that anybody can access might be a better approach. Here’s the same photo, but now it’s been published from the ESRI Web site. Instead of a pathname we’re using the URL to display the photo in the popup. Since the URL is public, everyone will see the same popup contents if we share our note or map.
And here’s how it looks. It’s a large photo, and one taken of the new ESRI HQ building here on campus.
Likewise we can enter a URL if we want to open a Web site in the popup. Here we’ve entered the URL to the ESRI home page.
And here’s the Web page opened in the popup.
Now, let’s put all these together. When you enter a string in the popup ArcGIS Explorer does its best to figure out what to do with it. If just text, it will display the text. If a path or URL, it will display the target. But to create a popup that includes a little bit of everything, we’ll need to use a little HTML.
Here’s the HTML to display both formatted and non-formatted text strings (like in our first two examples above), a picture from a local source (the third example), and links to a Web site and photo on the Web (the last two examples).
Here’s how our popup looks now:
Doing interesting things in popups is easy. Just experiment with a little HTML.
For more information see the HTML markup for notes Help topic.