https://admtrafic.ma/js/6345682_poly_tooltip_11.js

1
2if ( maMap != "" ){
3
4// create a constructor
5function Tooltip(options) {
6// Now initialize all properties.
7this.poly_ = options.poly;
8this.content_ = options.content;
9this.map_ = options.poly.get('map');
10this.cssClass_ = options.cssClass||null;
11// We define a property to hold the content's
12// div. We'll actually create this div
13// upon receipt of the add() method so we'll
14// leave it null for now.
15this.div_ = document.createElement('DIV');
16//Explicitly call setMap on this overlay
17this.setMap(this.map_);
18var me = this;
19// Show tooltip on mouseover event.
20google.maps.event.addListener(me.poly_, 'mouseover', function(e) {
21me.position = e.latLng;
22me.draw();
23me.show(e);
24});
25// Hide tooltip on mouseout event.
26google.maps.event.addListener(me.poly_, 'mouseout', function() {
27me.hide();
28});
29}
30// Now we extend google.maps.OverlayView()
31Tooltip.prototype = new google.maps.OverlayView();
32// We must implement three functions: onAdd, draw and onRemove, add the following lines:
33// onAdd is one of the functions that we must implement,
34// it will be called when the map is ready for the overlay to be attached.
35Tooltip.prototype.onAdd = function() {
36// Create the DIV and set some basic attributes.
37var div = document.createElement('DIV');
38div.style.position = "absolute";
39// Hide tooltip
40// div.style.visibility = "hidden";
41if(this.cssClass_)
42div.className += " "+this.cssClass_;
43//Attach content to the DIV.
44div.innerHTML = this.content_;
45// Set the overlay's div_ property to this DIV
46this.div_ = div;
47// We add an overlay to a map via one of the map's panes.
48// We'll add this overlay to the floatPane pane.
49var panes = this.getPanes();
50panes.floatPane.appendChild(this.div_);
51}
52// We here implement draw
53Tooltip.prototype.draw = function() {
54// Position the overlay. We use the position of the mouse on mouseover
55// to peg it to the correct position, just northeast of the mouse.
56// We need to retrieve the projection from this overlay to do this.
57var overlayProjection = this.getProjection();
58// Retrieve the coordinates of the mouse
59// in latlngs and convert them to pixels coordinates.
60// We'll use these coordinates to place the DIV.
61if (this.position)
62  var ne = overlayProjection.fromLatLngToDivPixel(this.position);
63else if (this.poly_.getPath && this.poly_.getPath().getAt && this.poly_.getPath().getAt(0))
64  var ne = overlayProjection.fromLatLngToDivPixel(this.poly_.getPath().getAt(0));
65// Position the DIV.
66var div = this.div_;
67div.style.left = ne.x + 'px';
68div.style.top = ne.y + 'px';
69}
70// We here implement onRemove
71Tooltip.prototype.onRemove = function() {
72this.div_.parentNode.removeChild(this.div_);
73}
74// Note that the visibility property must be a string enclosed in quotes
75Tooltip.prototype.hide = function() {
76	$("."+this.cssClass_).remove();
77}
78Tooltip.prototype.show = function(e) {
79if (this.div_) {
80this.div_.style.visibility = "visible";
81}
82}
83Tooltip.prototype.setContent = function(content) {
84  this.content_ = content;
85  this.div_.innerHTML = this.content_;
86}
87
88}