Maps

Here is a short history of my involvement with campus maps. 

From 2001-2012, the online version of the campus map was a clickable web page that dropped the user into various grids or closeups of the map. Associated parking maps were hyperlinked to these detail pages. This was a project managed by my colleague Susan Willats. I had been involved in helping with providing a server, log management, etc. At some point I showed her what we could do with Drupal that would enhance this service used by visitors and the community at large.

A simple ExpressJS app that includes a Leaflet example. This is a modified lesson from a Udemyclass I was taking. It uses the jade templating language and pulls in Bootstrap and Mapbox libraries. Here's the description README from github.

Project Objectives

One of my objectives with migrating data out of Drupal and into a MEAN stack app is for easier management of downstream requests for JSON data. We want to take advantage of the built in functionality of the MeanJS stack, and here's a simple exaple.

In this use case we wish to expose articles to some other app who will make a HTTP GET request for all the articles or just one.

In app/controllers/articles.server.routes.js, we need to add entries for the two functions we'll allow via GET.

app.route('/api/articles')

.get(articles.list);

Created a norcal.cities.geojson file via geojson.io site.

In this tutorial we will load a small data set into MongoDB and build a simple map that adds a marker to a map. There is some preparation for this tutorial, so you will need the following:

- a working MeanJS environment

- created an Article in your working environment

- be prepared to do some find / replace in the GeoJSON data file attached to this tutorial

- be able to run commands from the terminal to load data into MongoDB via mongoimport and install angular-leaflet-directive

Well, I'm no expert but here's a tip that might save you some time. I have a Drupal databae outputting valid GeoJSON data. Our data looks like this:

{

"type": "Feature",

"geometry": {

"type": "Point",

"coordinates": [

-122.0570486784,

36.99607280576

]

},

"properties": {

"name": "Dean of Students Office",

"description": null,

"Food Type": "",

Update 5/1/15 - On a different instance of Mongo, I had run the command noted below and got errors. However, this worked:

mongoimport --db mean-dev -c points --file "points.geojson" --jsonArray

Let me save you the hours lost in trying to figure out getting GeoJSON features into individual documents in a collection versus one document with nested features.

MongoDB 3.0.2. Valid GeoJSON file full of 809 features.

Using this code:

mongoimport --db test --type json --file ./'mobilemaps.geojson' 

I'm still getting up to speed with SmartOS. Here are some notes I took while trying to get PostgreSQL on SmartOS to parse OpenStreetMap (osm) files. My intent is to use Mapbox Studio to do some custom styling for OSM as we develop some "single purpose" maps.

Here's the summary I wrote at LAX when I came home from MMWCON down at UCLA in September 2014.

I was ultimately successful in getting data parsed in the VM and can use Mapbox Studio to connect and style the maps. Now to find some time to finish that little project...

June 10, 2014 

Updated August 2015

Here are some rough notes on the process for getting a mapbox.com served set of tiles for the http://mobilemaps.ucsc.edu site (discontinued in June 2015).

I got turned on to Yeoman back at the Modern Mobile Conference back in September.

In October, I started working with Yeoman to build up a small mobile Bootstrap based site of a dozen pages or so. My objective is to use a team of students to help with development, keep the app as browser-based and make it work on mobile devices. 

The plan is to integrate some simple features. These include:

• leaflet
• leaflet-hash
• leaflet-locatecontrol
• touchSwipe
• handlebars

Here's some notes on how this project is progressing.