GIS in the Sciences ERTH 4750 (38031) Troubleshooting: Web maps & Joins Steve Signell, Instructor ([email protected]) Robert Poirier, TA ([email protected]) School of Science Rensselaer Polytechnic Institute Monday, April.

Download Report

Transcript GIS in the Sciences ERTH 4750 (38031) Troubleshooting: Web maps & Joins Steve Signell, Instructor ([email protected]) Robert Poirier, TA ([email protected]) School of Science Rensselaer Polytechnic Institute Monday, April.

GIS in the Sciences
ERTH 4750 (38031)
Troubleshooting:
Web maps & Joins
Steve Signell, Instructor ([email protected])
Robert Poirier, TA ([email protected])
School of Science
Rensselaer Polytechnic Institute
Monday, April 22, 2014
Group Webmaps
Good job on the webmaps!
Available here:
http://giscience.tw.rpi.edu/rpi_group_projects/
Lets have a look…
Group Webmaps
One thing they all need is some context– e.g. legends,
interpretive text, etc.
We’ll use the leaflet-sidebar plugin
leaflet-sidebar
1) Copy the sidebar folder to your website’s ‘plugin’ folder
2) Add in the references to the plugin .css and .js files in the appropriate
places:
<link href="plugins/leaflet-sidebar/L.Control.Sidebar.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="plugins/leaflet-sidebar/L.Control.Sidebar.js"></script>
3) Add a <div> for the sidebar:
<div id="sidebar">This is the sidebar content</div>
4) Add the javascript:
var sidebar = L.control.sidebar("sidebar", {
closeButton: false,
position: "left"
}).addTo(map);
//set the sidebar to show on load
sidebar.show();
Eaters Map
Add wms layer:
var stop_heatmap = new L.TileLayer.WMS("http://173.11.102.171:8080/geoserver/rpi/wms",
{
layers: 'rpi:stop_heatmap',
format: 'image/png',
transparent: true
}).addTo(map);
Add icon to legend in layerControl:
//make a layer control legend & toggle for the overlay maps
var overlays = {
"Restaurants": ratings,
"<img width='20px;' height='20px;' src='img/cdta_logo_bigger_circle.png'> Bus Stops":
stops_87_286_289,
"Bus Routes": troy_routes
};
Farmers Map
Naming consistency: file names are case-sensitive on some
servers!
Legend disappears: a code ordering issue: <div> for legend
Lets add the Sidebar and put the legend there!
Outcroppers Map
Let’s make the layerControl expanded by default:
var layerControl = L.control.layers(baseLayers, overlays, {
collapsed: false,
autoZIndex: "true"
}
).addTo(map);
Watershedders Map
Make sure the map isn’t too wide for the screen:
var layerControl = L.control.layers(baseLayers, overlays, {
collapsed: false,
autoZIndex: "true"
}
).addTo(map);
Dealing with CSVs and lots of columns
Here we have a comma separated values (CSV) file with 500+
columns:
How do we load this into PostGIS for analysis?
Dealing with CSVs and lots of columns
Q: What’s the easiest way to load data into PostGIS?
A: Shapefile import in PgAdmin/QGIS
Can we make this table into a shapefile?
This id is actually a state id (36) and a county ID put together
Dealing with CSVs and lots of columns
Here’s the steps to join this to an existing shapefile and then
import into PostGIS:
1) Download TIGER counties dataset
2) Bring into QGIS, clip to NY and reproject to UTM18N
3) Create 5 digit id to match the csv by combining state & city
FIPS codes (field calculator)
4) Bring the csv into QGIS
5) In the shapefile properties, JOIN the shapefile to the csv using
the matching fields
6) Save this as a new shapefile
7) Import shapefile into QGIS using PgAdmin (recommended) or
QGIS
BREAK
Multidimensional Data II
NetCDF: a data storage format for n-dimensional datasets.
webgl: a javascript Library for 3d visualization
ParaView
Homework
Thursday: Trip to KitWare
14