Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

google map api - always show tooltip

Posted on 2010-08-30
4
Medium Priority
?
2,475 Views
Last Modified: 2012-05-10
Hi experts,
I'm building a test web application that creates a pin in a google map.
I'm using this api http://shabdar.org/google-maps-user-control-for-asp-net-part1.html for c# .net

What I'm trying to do, but cannot reach (maybe because of my working times) is to make the tooltip of the point always visible, as a very short info window or something like that.


Any help would be really appreciated.

Thanks in advance,

REgards,

Leandro Nuñez.
0
Comment
Question by:Leandronn
  • 2
  • 2
4 Comments
 
LVL 2

Assisted Solution

by:ambientguitar
ambientguitar earned 800 total points
ID: 33568917
This may be of some help for you.

http://www.pixeldevelopment.com/pdmarker.asp
0
 
LVL 2

Assisted Solution

by:ambientguitar
ambientguitar earned 800 total points
ID: 33568968
0
 
LVL 2

Author Comment

by:Leandronn
ID: 33586372
@ambientguitar: thanks for your help.
In a moment I'm about to post my solution.
Your cooments were really helpful, they point me where to look.

Thanks a lot.
0
 
LVL 2

Accepted Solution

by:
Leandronn earned 0 total points
ID: 33596601
Using the code attached, when creating the marker just changed:

marker = new LabeledMarker(point, { icon: icon1, draggable: bDraggable, title: sTitle, labelText: sTitle });

Thanks for your help @ambientguitar
// NOTE: This code remains here for historical reasons, but it has been
// entirely superceded by the file found at:
// http://uwmike.com/maps/manhattan2/labeled_marker.js


/* Constructor for an extended Marker class */
function LabeledMarker(latlng, options) {
	this.latlng = latlng;
	this.labelText = options.labelText || "";
	this.labelClass = options.labelClass || "markerLabel";
	this.labelOffset = options.labelOffset || new GSize(0, 0);
	GMarker.apply(this, arguments);
}


/* It's a limitation of JavaScript inheritance that we can't conveniently
extend GMarker without having to run its constructor. In order for the
constructor to run, it requires some dummy GLatLng. */
LabeledMarker.prototype = new GMarker(new GLatLng(0, 0));


// Creates the text div that goes over the marker.
LabeledMarker.prototype.initialize = function (map) {
	// Do the GMarker constructor first.
	GMarker.prototype.initialize.call(this, map);

	var div = document.createElement("div");
	div.className = this.labelClass;
	//div.innerHTML = this.labelText;

	var width = this.labelText.width;
	div.innerHTML = '<div style="background-color:#ffffff;font-size:xx-small;white-space:nowrap;">' + this.labelText + '</div>';


	div.style.position = "absolute";


	map.getPane(G_MAP_MARKER_PANE).appendChild(div);

	this.map = map;
	this.div = div;
}

// Redraw the rectangle based on the current projection and zoom level
LabeledMarker.prototype.redraw = function (force) {
	GMarker.prototype.redraw.call(this, map);

	// We only need to do anything if the coordinate system has changed
	if (!force) return;

	// Calculate the DIV coordinates of two opposite corners of our bounds to
	// get the size and position of our rectangle
	var p = this.map.fromLatLngToDivPixel(this.latlng);
	var z = GOverlay.getZIndex(this.latlng.lat());

	// Now position our DIV based on the DIV coordinates of our bounds
	this.div.style.left = (p.x + this.labelOffset.width) + "px";
	this.div.style.top = (p.y + this.labelOffset.height) + "px";
	this.div.style.zIndex = z + 1; // in front of the marker
}

// Remove the main DIV from the map pane
LabeledMarker.prototype.remove = function () {
	this.div.parentNode.removeChild(this.div);
	this.div = null;
	GMarker.prototype.remove.call(this);
}

Open in new window

0

Featured Post

Ask an Anonymous Question!

Don't feel intimidated by what you don't know. Ask your question anonymously. It's easy! Learn more and upgrade.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
This article discusses how to implement server side field validation and display customized error messages to the client.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

782 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question