How do I add an achored, autosized, popup (or marker with label) to an OpenLayers map?

I can add markers. I can add popups. But when it comes to markers with labels (not requiring clicking), or markers + anchored popups that autosize (behaving like markers with labels)... no dice.

Any idea on how to make this work? e.g. a marker with a label "House 1" that shows up to the right of it? I don't need a full working example, but short snippets would be AWESOME. :)

Thanks,
LVL 10
UltrusAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

TripplebeamCommented:
popup = new OpenLayers.Popup("chicken",
                   new OpenLayers.LonLat(5,40),
                   new OpenLayers.Size(200,200),
                   "example popup",
                   true);

map.addPopup(popup);


CHECK HERE FOR MORE INFO:
http://dev.openlayers.org/docs/files/OpenLayers/Popup-js.html
0
UltrusAuthor Commented:
Hello Tripplebeam,
Thanks for the input. I'm actually starting from that point. The problem is that the Popup is 200x200 pixels with a close image, not "autosized" to the "example popup" text. Removing the close image is easy, but the following is not working for me quite yet (attached code).

Any thoughts?
popup = new OpenLayers.Popup("testPopup",
                   new OpenLayers.LonLat(0,0),
                   new OpenLayers.Size(200,200),
                   "example popup",
                   false);
			
			popup.autosize = true;

			map.addPopup(popup);

Open in new window

0
UltrusAuthor Commented:
Ohhhhh goodness. It was right in front of me

map.addPopup(popup);
popup.updateSize();

Delete the popup.autosize = true;

I guess for extra credit, would you know how to strip or redefine the popup styles that are showing? Example output attached.
<div id="testPopup" class="olPopup" style="border: 0px none ; overflow: hidden; position: absolute; left: 630px; top: 265px; width: 93px; height: 20px; background-color: white; opacity: 1; z-index: 751;">
<div id="testPopup_GroupDiv" style="overflow: hidden; position: relative;">
<div id="testPopup_contentDiv" class="olPopupContent" style="overflow: auto; width: 93px; height: 20px; position: relative;">example popup</div>
</div>
</div>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.