You are here: Home / FAQ / About graphs / Embedding a static graph on your web site

Embedding a static graph on your web site

How do I embed a graph of your current streamflow conditions for a site onto my web page?

The URL which retrieves the graph must follow the following syntax:

http://waterdata.usgs.gov/nwisweb/graph?<args>

where <args> should be limited to:

  • agency_cd = Agency code for site (if omitted default = USGS)
  • site_no =  USGS site number to match (required argument, error if omitted)
  • parm_cd = USGS time-series parameter code (required argument, error if omitted)
  • period =  Include data for the previous "period" days (if omitted, default = 7)
  • startDt = A date to begin showing plots on the graph in the format YYYY-MM-DD. Use with endDt but do not use with period.
  • endDt = A data to end showing plots on the graph in the format YYYY-MM-DD. endDt should be equal to or greater than startDt. Use with startDt but do not use use period.
  • help        Displays help text

Arguments may be specified in any order and must be separated by a &.

Example URL:

http://waterdata.usgs.gov/nwisweb/graph?agency_cd=USGS&site_no=06025500&parm_cd=00060&period=7

To embed a graph inside a web page, the <img> tag must be used with the src attribute set to the URL of the graph and placed in the desired spot of your HTML. All images are 576x400 pixels. To speed your page's rendering time, it is recommended that these values be specified in the width and height attributes of the <img> tag.

Here is an example:

<img  src="http://waterdata.usgs.gov/nwisweb/graph?site_no=06025500&parm_cd=00060"  width="576" height="400" alt="USGS Water-data graph for site 06025500"  /> 

Most sites report measurements hourly. Consequently, there is no point in retrieving data more than hourly. We would appreciate it if you would be kind to our servers by marking up your HTML or passing a proper HTTP header so the browser does not attempt to refresh the page more than once an hour. Here is an example of markup that would do this when placed in the <head> section of your HTML:

<meta http-equiv="refresh" content="3600" />