Tag Archives: Web Map

Leaflet.js with Floating DIVs and onclick()

10 Dec
My simple Map Website

My simple Map Website

I am not a web designer, I make maps. I thought it might be cool to make a website that’s a map. I started by disabling the scrolling and zooming on leaflet. But that’s boring, all you get is an image with popups. Most people wouldn’t think it was a real map. so what I did was place some icons in <div>’s and float them on my map. When you click one, I change the map.setView() and add a marker and openPopup. This is a very simple example just to test how a map website might work. It is a single page – haven’t thought about how to display large amounts of information ad I have no need for that yet. Works great on iPhone too. Here is the live site.

CTRL-U in Firefox to see the code.

Advertisements

OpenLayers and Revit

16 Jul

In a previous post, I showed how OpenLayers could display Autocad Files. OpenLayers, using an Image Layer, can also display an Ortho of your model. While I would prefer a 3D PDF, this may have its uses.

Here is the Revit model as a web map.

I took 3 shots of a Revit model and added two points. I used a blank white image as the background, a full model layer – which is active at the start, a layer with no walls, and a frame layer. By clicking down the layers, you can remove pieces of the building. I did not fix resolutions in my code, but the images can be more crisp. Here is a shot with the Frame Layer turned on.

To see the map live go to my website:
http://educationalfacilityplanning.com/3DOpenLayers.html