Recline.js tutorial example comes up blank. Perhaps related to Leaflet IE bug?

Question

I'm working through this simple example of making a map from a dataset using Recline.js :: http://okfnlabs.org/recline/docs/tutorial-views.html

When I duplicate the steps, I get a white screen of death.

My code is hosted here: http://theplaceisnow.aedileworks.com/mappings/recline/TimeToRecline.html

I've checked the links of all the dependencies.

Chrome tells me that there are errors in the Leaflet.js and that the tiles will not load. I haven't found anyone else with the same error, but it's possible it's related to a correction made for an IE bug (although I'm using FF and Chrome): github.com/ckan/ckan/issues/1202

Any insights or suggestions would be appreciated

========================================================

Update :

I tried switching to Leaflet 0.4.4 which did not change the problem.

A friend suggested that the problem might be the body tag. I moved the body tag to before the script and that allowed Leaflet to run.

Tiles still don't load locally in a browser but when uploaded to a server, the map loads properly.

Answer 1

Your code shows you are using leaflet 0.7.3 while the tutorial you are quoting uses leaflet 0.4.4.

This should solve your problem.

If you look at recline project, you can see they added support to leaflet 0.7.3 very recently.

They have not yet updated their website which is hosted on github: https://github.com/okfn/recline/tree/gh-pages

Answer 2

Recline could not detect leaflet. If I disable recline.js and slickgrid, it detects any version of leaflet.