Relaunching Exploring Spatial as a Single Page Web Site.

After a bit of a break from my blog, I have returned. There is a lot on the plate for work in 2015, and I need to get out ahead of that development. 2015 will be the year that we begin to introduce Leaflet to our maps, so it’s time that I returned to my exploration of Leaflet and its plugins.

Begin Again

Over the last couple of weeks, I did several things to improve Exploring Spatial. I converted the site to a single page web application, I reworked that HTML/CSS on my site to utilize more real-estate, and I made everything available on GitHub.

Bigger is Better

The CSS template I was using had a fixed height and width. I’ve expanded it to be a full page to allow for bigger maps. There are some wrapping issues that must be fixed, but overall the result was what I wanted. One of my TODO tasks is to add some JavaScript to size the height and width of the map container DIV tags from the document viewport. Some map providers don’t work well with percentage sizes, so I want to plug in the height and width in pixels and redraw the map when the browser window is resized.

“GIT”ting Better

The entire site is now available at GitHub: https://github.com/smitchell/exploringspatial. Not only can you find all the demo code there, but theoretically you can contribute your own code to the demos too.

One Page Fits All

My biggest change was to convert the entire website to be a single page app using Backbone.js. I did this for no other reason than this is the direction we are heading at work. At first, I resisted making this change because it makes the demos a little harder to follow if you are not familiar with Backbone.js.

Eventually, I decided that my website is as much a personal journal as it is a public resource, and the kind of people that might be interested in my journal are professionals who can find their way around the Backbone JavaScript files.

Enjoy the new site. You can expect a lot of activity on the Leaflet demos in 2015.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s