1 Maps on the web Computer Networks GIS on the Web Dr. Jim Graham15 years as computer engineer and manager with HP If you use an HP ScanJet scanner you are using software I worked on 4 years running a Web-GIS company 5 years at CSU Research Scientist:

2 Computer Networks 2 or more computers connected together Typically a:Client: requests and receives data Server: receives requests and serves data

3 Requesting a Page Client sends an http request with a URL to a serverServer find the file based on the URL and returns it Can also request: mpeg, jpeg, gif, etc. Request with URL HTML Page

4 Dissecting a URL http://www.google.comhttp: hypertext transfer protocol = server address Important: You need a server to put anything on the web

5 How Web Servers Work Client Server Browser Web Server HTML FileInternet Server Browser URL Web Server HTML File HTML File Image File Image File

6 Dissecting URLs /cwis438/websites/niiss/home.php File to load ?WebsiteID=1 Parameter Parameters can be hidden

7 GIS on the Web PDF Files HTML files with image maps Zipped GIS FilesKML/KMZ Files for GoogleEarth GIS Web Servers GoogleMaps ArcOnline

8 Portable Document FormatAcrobat Writer lets you write PDF files from virtually any application by “printing” to a PDF Acrobat Pro will maintain links Maintains print quality

9 GeoPDF GeoPDF by TerraGo Allows Georeferenced dataVery new format (Crashed IE!) Examples: Can’t get the spatial data back out!

10 Zipped Files for Data Raster file formats: Vector file formats:TIFF or IMAGINE JPEG compression for continuous tone only Vector file formats: Shapefiles CSV and TXT Maybe: zipped Geodatabases Not: mxds, layers, etc. Not KML/KMZ (no georeferencing)

11 KML/KMZ File format for GoogleEarth KMZ is a “zipped” KMLNot a GIS data format (no georeferencing) Being reviewed for potential standardization Adding georeferencing Easy to provide for users: Export to KML in ArcGIS (includes layer) Add to a web site with a link to download

12 Approaches Page of links: Search engine for links:Example: Humboldt County Search engine for links: Examples: National Park Service, HDH Map selection for searching Example: EarthExplorer Custom downloads: Select: Area, File format Spatial Reference Example: National Map

13 Image Maps Embedded in a web page (HTML)Fixed array of coordinates for known map

14 File formats for DisplayRaster PNG, GIF: Spot color and continuous JPEG: Continuous tone Keep to 500x500 pixels or less Vector SVG: Performance problems HTML 5 is coming! KML/KMZ PNG works for everything

15 Web Formats & LanguagesDirect Browser Support: HTML JavaScript Images: GIF, PNG, JPEG Plug-ins (going away?): Flash PDF AJAX (JavaScript to Server) XML

16 XML-Type Languages Extensible Markup LanguageSingle tag: Tag with attributes: Tag with content: Includes: HTML, KML, and many more

17 HTML Hyper Text Markup Language Some text that will appear on the page

18 Hyperlinks GoogleMy Page

19 Images in HTML

20 Accessibility AttributesDreamWeaver will ask you for attributes for those with disabilities Provides text that will be spoken for those with impaired vision. Don’t worry about this for this assignment

21 Image Maps Create background image in ArcGISCreate a map that looks good on the screen Export or Screen Capture Define polygonal areas as “image maps” in DreamWeaver Circles for points Simple polygons for polygons Polygons for polylines? Good for 10 to 20 areas

22 Image Maps

23

24 Can also have… Paragraphs

Horizontal rules