12 replies to this topic

[Matthew Hampton]

I'm working on new map tiles (designed in ArcGIS) for our agency's map service that's live now.  There is still a bit of work to do, but I wanted to share the progress of my initial foray into web mapping.

 

You can view the basemap tiles via Metro Map.  If you're curious, be sure to zoom in and see the canopy-shading.

 

 Screen shot 2013-03-20 at 1.08.40 PM.png   653.81K   7 downloads

[David Medeiros]

That looks great Matthew. That's a clean easy to use interface and good looking maps.

 

What's the workfkow (in simple terms) of how you work with ArcGIS and Leaflet? Is the entire UI built in Leaflet?

 

We are trying to get our campus base map project off the gound here and are currently using ArcGIS Viewer for Flex. It's WYSIWYG, which is good for non-progammers like us, but I know there are better ways. Might have to investigate.

 

David

[Matthew Hampton]

Thanks David.

 

I could tell you more about the cartographic workflow than the back-end workflow  .

 

But as I understand it - our talented developer (Ben Sainsbury) takes the Map Service, creates tiles with MapBox and serves them via Leaflet.

[David Medeiros]

Ahh, sorry I assumed you had done the development bit as well, but that is helpful (that's how little I know about this).

 

And the maps look great of course. I especially like the water body vignetting, not typically seen in an Arc map.

[david17tym]

Hey Matt,

I bet you're having some fun and games untangling all the under/over passes?

Nice clean design. Is the shading derived from Lidar?

[Hans van der Maarel]

Looks great Matthew! Love the tree shading and the water vignette. Very subtle.

[Matthew Hampton]

The basemap tiles were designed for thematic overlays, so tried to keep the color values subtle, however I realized that there is less room for subtly in web maps than there is for print.  There was a temptation to crank the color volume/saturation on some of the elements (similar to other basemaps) to create a stronger figure.

 

For elevation data I used a 10m at smaller scales, then blended in 15ft and 3ft for larger scales.  The canopy texture comes from highest-hit LiDAR postings.  The building footprints and stream centerlines are derived from LiDAR as well.

 

There are several aspects of this basemap still needing cartographic development including representation of over/under-passes, building outlines, and finer tuning of labeling rules so stay tuned.  I think we'll be baking tiles every quarter - simultaneously with the updates to our Regional Land Information System (RLIS).

[Adam Wilbert]

looking good. Thanks for sharing the process.

[Michael Karpovage]

An exceptional map design, Matthew! Really like the look of it and the ease of use. Fast too. Looks like a lot of work you put into this. Really like the layers option too in upper right corner giving me different map options to view. Great job.

[DaveB]

Very nice work, Matt!

I've got to get back up to Portland one of these days!

[François Goulet]

Great map!

 

I'd like to do something similar for our organization. What's serving the tiles? 

[Matthew Hampton]

Hi François,

 

Currently the tiles are being served with Tileserver.  It seems to be a rather effective and agnostic web 2.0 technology.

[Matthew Hampton]

In order to get proper looking highway shields I changed from Character Marker Symbols to Picture Marker Symbols which required the use of an .emf file (enhanced metafile). Thank goodness 10.1 supports .png's.

In either case the switch in symbol formats for 8 scale levels and ~21 highway shields required over 3,500 clicks in one hour. It almost caused carpal tunnel syndrome. If you want to watch one of the most boring 30 second videos, check out this swf video I made of the process for changing just one shield.

There must be an automated process!