Mapping With Drupal - Alan Palazzolo [11]
NOTE
Despite the limitations of not having deep integration with spatial databases, Drupal can handle most mapping storage and calculations. The main limitation is doing calculations with complex shapes. Calculating what places are within a rectangle or circle is possible, but determining what falls within an arbitrary shape is more difficult. Similarly, calculating whether a shape that a user draws on a map overlaps with another shape (such as a voting district) is beyond the current capabilities of mapping in Drupal 7.
Given the lack of support for spatial databases in Drupal 7, most mapping applications in Drupal just use a standard MySQL database. This is suitable in most cases, but creates some challenges.
Challenges of Web-Based Mapping
The difficulties of making a map to be used online can be grouped into a couple of areas: there are limits to how much data a web browser can display on a typical interactive map, and there are usability problems when trying to display large amounts of information on a map.
Browser Capabilities
Most interactive maps use JavaScript very heavily. The image tiles that make up the map are loaded using JavaScript as the user zooms in and out and moves around the map. The points, lines, and polygons displayed on the map are added with JavaScript (usually interacting with HTML Canvas or SVG). Even modern web browsers have a point at which they get overwhelmed and become unresponsive because the client cannot handle all of the processing. A good rule of thumb for the limitation of points (including vertices in a polygon) is around 200–500. But, as this is client-side processing, performance varies depending on the user’s browser and hardware, so you should take into account your audience when determining these limitations.
NOTE
There is no hard limitation, as the limitation comes from the client (the browser and hardware of the user’s computer, phone, tablet, etc.). Modern browsers, such as Chrome, can handle upwards of 10,000 points, while Internet Explorer 7 is more like 300. Unfortunately, there have been no benchmarks for this, as there are so many variables to consider.
Client-side clustering
One approach to lessen the load on the client is to use a form of clustering. If there are a large number of points in close proximity, they will be grouped together, and this grouping will normally be represented by a different style of marker. What happens when this “group” marker is clicked depends on the clustering tool. Either the map may zoom in to show all the separate points in that area, or the group marker may load a pop up displaying a list of all the points that it contains. This helps the browser not have to render all the markers or features, and it will save some resources. However the clustering is done by JavaScript in the browser, so this will not lead to a huge increase in performance.
Library size
A second approach is to use less demanding JavaScript. By lessening the amount of JavaScript that the client has to download, and minimizing the amount of processing on the client in order for you to achieve the map you want, you can squeeze some more performance out of your maps.
One example is Modest Maps. This is a very lightweight JavaScript API for displaying map tiles. By focusing on displaying map tiles and not providing any default markers or buttons for navigating the map, the Modest Maps JavaScript file is 28 KB, compared to over 700 KB for the OpenLayers JavaScript and around 150 KB for the Google Maps JavaScript API. However, the trade off is that you do not have a very full-featured