It's my fourth program ever so be nice. On Github I took the Views Gallerific module and mapped it (no pun intended) to use the jMapping jQuery plugin.
I think that using the jquery.data method is an efficient way to add geographic information to a Views row for populating a map. Each row of the View has an element with a data attribute that contains the nid of the row which is used by querying it with the data() method. Because of this I'll be able to add an event listener that updates the map when an Ajax call is returned very easily.
I also have a mumble jumble of hacked together modules based on Addressfield, Location, Geofield, and Geolocation Field. I would like to at some point create a module from them that hooks into Addressfield and Geofield by simply adding a pure jQuery client side geocoder that is implemented though a form alter hook. It basically does nothing except geocode the address found in the Addressfield modules's fields and populates the Geofield by pressing a button or adding a reversed geocoded address to Addressfield module's fields based on the input in the Geofield module's field. This would also include my porting of proximity and distance filters from the Location module to Geofield.
Comments
Converting from location to
Converting from location to geofield & addressfield sounds ideal. Geocoders are probably the only things really holding back the development of geo-sites & your solution for this would be a great.
Freedom Isn't Free
Can't get JMapping to Work in Page
I'm trying to get the JMapping plugin to work in a Drupal page by following the example on the JMapping Usage page: http://vigetlabs.github.com/jmapping/usage.html
But I can't get a map to appear. Here's what I'm putting in a Drupal page using the PHP filter
<?php
drupal_add_js('sites/default/files/scripts/jquery.jmapping-2.1.0/jquery.jmapping.js');
drupal_add_js('sites/default/files/scripts/markermanager.js');
drupal_add_js('sites/default/files/scripts/jquery.metadata.2.1/jquery.metadata.js');
drupal_add_js('sites/default/files/scripts/StyledMarker.js');
drupal_set_html_head('<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3.3&sensor=false"></script>');
drupal_set_html_head('<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>');
drupal_add_js('$(document).ready(function(){
$("#map").jMapping();
});','inline');
?>
<div id="map"></div>
<div id="map-side-bar">
<div class="map-location" data-jmapping="{id: 5, point: {lat: 35.925, lng: -79.053}, category: 'Gas'}">
<a href="#" class="map-link">Some Place</a>
<div class="info-box">
<p>Some thing for the info box.</p>
</div>
</div>
<div class="map-location" data-jmapping="{id: 8, point: {lat: 35.935, lng: -79.024}, category: 'Food'}">
<a href="#" class="map-link">Another Place</a>
<div class="info-box">
<p>Example Text.</p>
</div>
</div>
</div>
Any ideas on what it is that I'm doing wrong?
Needed to add height/width to #map
Just figured out that all I needed to do was add height & width to the #map div. I hadn't included the stylesheet from JMapping's example.