Introduction to Web Mapping Technologies
By Ahmad Aburizaiza Data Services Lab - GMU Content
What is GIS?
What is Web Mapping?
Web Map Components
Proprietary Vs. Open Source
Data Formats
Mapbox 2 CartoDB
Conclusion What is GIS?
GIS definition
Store data Visualize data Query/analyze data geospatially to see the unseen
GIS main usage
Finding best location Explaining data trend
Navigation 3 What is GIS? GIS data models
Data model name Vector Raster
Definition Discrete objects with discrete boundaries and Continuous data → values in pixels shapes → points, lines, or polygons 2 0 0 0 0 5
0 0 0 0 0 5
0 0 0 5 5 5
0 0 0 0 0 0
7 7 0 0 0 0
7 7 0 0 0 2
Examples Temperature, and vegetation
Restaurants → points Streets → lines Buildings → polygons
4 What is GIS?
Layering → separating homogeneous objects into layers
● A layer is basically a table of attributes and each row is attached to a location explained in a separate column ● Each layer can be either points, lines, or polygons ● Layering is used mainly for analysis, and it is also used for better data management and organization ● All layers in one map should have the same coordinate system, explained on next slide ● The bottom layer is referred to as the basemap
5 What is GIS?
Coordinate system → a reference to locations of objects on the map
● Coordinate systems are created through map projection ● Location can be presented in latitude and longitude, metric, or feet based ● For web mapping, the Web Mercator coordinate system is the most common and it uses latitude and longitude
6 What is Web Mapping?
It is simply using an interactive map in a website. The map can cover the whole HTML body or part of it.
It can be used only for visualization or for visualization and geospatial analysis.
Most web maps requires programming skills but some offer specific tools for non-programmers to build web maps.
7 Web Map Components
JavaScript’s Map Object
Basemap
Thematic Layers
Interactive Objects
8 Proprietary Vs. Open Source
9 Programmable objects Data Formats 1. GeoJSON 2. marker 3. polyline 4. polygon
Database tables File based
1. PostGIS/PostgreSQL 1. KML 2. MongoDB geospatial collection 2. GML 3. MySQL Spatial 3. GeoJSON/TopoJSON 4. SpatiaLite 4. OSM 5. Oracle Spatial 5. WKT 6. ArcGIS GeoDB 6. shapefiles
Geospatial Web services
1. WMS 2. WFS 3. WPS 4. WCS 10 Mapbox
MapBox is a mapping platform.
They are very famous of their beautiful map tiles.
You can build web maps using MapBox either with programming or no-programming.
Exercise 1:
1. Go to MapBox and create your own account by clicking “Sign Up”
2. Navigate the website by following the instructor
3. Go to geojson.io to create sample geojson data and download it to desktop, also download kml
4. Create a new project in MapBox and select a basemap 11 5. Drag the downloaded geojson file to the browser
6. Select “Data” tab and add more data
7. Save your work and then click the “Project” tab
8. You can share the map link or embed it in a website CartoDB
CartoDB is another mapping platform.
They have both map and data views.
You can also build web maps either with programming or no-programming.
Exercise 1:
1. Go to CartoDB and create your own account by clicking “Sign Up”
2. Navigate the website by following the instructor
3. Drag the downloaded data from geojson.io to your browser
4. Follow with the instructor on how to visualize and manipulate the data 12 5. Create a new map and then click “Export Image”
6. After that, click on “publish” to share a link similarly to MapBox either full map or embedded
7. Experiment with the other options such as “Change basemap” and “Options” Conclusion
There are more web mapping technologies and packages out there.
Choosing one depends on the user’s needs and skills.
It is possible to mash up two or more technologies together.
Programming gives you the ability for further customization of a web map and its components.
Thank you for listening 13