Data, Maps, Usability, and Performance

API canvas d3 data geo GeoJSON html5 image JavaScript json maps mysql PHP WordPress

Results for tag: openlayers

OpenLayers with Flickr and Panoraimo APIs

OpenLayers Bounding Box BBOX

OpenLayers has a cool example of using Flickr API to pull photos for a bounding box. When I saw this example, I right away thought about making it better by adding Panoramio photos as well with their API. This example of using Panoramio API with OpenLayers was helpful and I made a quick demo of Flickr and Panoramio Photos with OpenLayers. I have used Bing tiles and limited the zoom but than I noticed “Uncaught TypeError” errors in the console on page load. In Chrome it was Uncaught TypeError: Object #Object has no method ‘c1′ and FireFox gave me TypeError: OpenLayers.Protocol.Script.registry.c1 is not a function.
Read more

OpenLayers jsFiddle Examples

jsFiddle OpenLayers Examples

It has been a while since my last jsFiddle canvas examples post and I want to do these more frequently. JSfiddle is a great resource for learning as you can quickly visualize all pieces of the code (CSS, JavaScript, and HTML). It is also very popular, so you can often find some great demos and examples which can help you with your work. This time around, I am going to focus on OpenLayers examples in jsFiddle:
Read more

OpenLayers with Various Data Sets and Tiles

Compare Data Sets Visually with OpenLayers

In my last post, I dived into OpenLayers and created a demo that uses different data sets, layers, and tooltips. Today, I am creating something very similar but serving a different purpose: visually comparing something with different data sets of geographical points. That sounds confusing, but I am referring to a concept like airports and grabbing data about airport locations from various sources and visualizing the differences between the sources. You can just look at the size of the data source and determine that it is larger and has more airports but plotting geo locations on a map and seeing it with your eyes can bring more insight.
Read more

OpenLayers Map with Tooltips

OpenLayers Multiple Layers on World Map

OpenLayers Demo with Multiple Layers of Data
Same OpenLayers Demo with Custom Tooltips

There has been a lot of development into JavaScript mapping libraries and after playing around with D3 and Raphael, I wanted to try something more map specific. I briefly looked into Google Maps, Leaflet, ESRI, Cloudmate, Polymaps, ModestMaps and many others but I decided on OpenLayers. After reading several good threads on comparing client side map libraries I felt that OpenLayers got the highest overall vote. The OpenLayers API documentation also seems very promising. So, today, I am going to find some interesting geographical data, extract and convert it into a good geo format, and use OpenLayers to visualize the data on the map.
Read more