This document explains how to migrate from the previous version of the PG Maps API to version "2.0". The interface is in the main backward compatible, but there are some changes as described here.

The only obligatory change is the name of the Javascript file which has changed from "pgMap.js" to "pgMap2.js". The other changes are only required if you use that piece of functionality.

The main change is to the name of the Javascript file to include in your page. The name has been changed from "pgMap.js" to "pgMap2.js" so your code should look like this:

<script src="http://api.visual.paginegialle.it/tcolnew/mapsapi/pgMap2.js?id=abc" 
type="text/javascript"></script>
        

Events relating to the API are now handled by an external Event Handler instead of being attached to the actual map object itself. As a result the mouse events and associated function calls are no longer passed as parameters to the PGMappy object, by are created separately after the map object has been created and using the new PGEvent object. If the event is assigned to a variable then it can be removed at a later date e.g:

  map1 = new PGMappy({nameContainer: 'mapcontainer'});
  
  ev1 = PGEvent.addListener(map1, 'mousedownbefore', function(data) {alert('mdb');});
  PGEvent.removeListener(ev1);        
        

For a full list of the available Events see the PG Maps API 2 Events page.

The way that the dynamic HTML gets passed to the API has changed. Previously a call was made to the openBig method. This is no longer the case - instead, the onOpen function just returns the HTML to be used.

function myOpened(params) {
  var html = '<div style="width:150px; height:150px; background:yellow; 
  border:2px solid #000;">' + params.city + '</div>';
  point1.openBig(html);
}
        

function myOpened(params) {
  return '<div style="width:150px; height:150px; background:yellow; 
  border:2px solid #000;">' + params.city + '</div>';
}