waqasriaz / google-maps-utility-library-v3

Automatically exported from code.google.com/p/google-maps-utility-library-v3
Apache License 2.0
0 stars 0 forks source link

I think default direction of infobox must be up, not down #61

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago
Hello! Thank you for your extension. I have an idea:

I dont't khow how, but default infowindow do it well. Fluid size of the box 
appearing above marker. Why infobox do it above? I don't want to limit my 
bubble height.

Is it here? Right place to hack?

 if (pixPosition.x < (-iwOffsetX + padX)) {
      xOffset = pixPosition.x + iwOffsetX - padX;
    } else if ((pixPosition.x + iwWidth + iwOffsetX + padX) > mapWidth) {
      xOffset = pixPosition.x + iwWidth + iwOffsetX + padX - mapWidth;
    }
    if (pixPosition.y < (-iwOffsetY + padY)) {
      yOffset = pixPosition.y + iwOffsetY - padY;
    } else if ((pixPosition.y + iwHeight + iwOffsetY + padY) > mapHeight) {
      yOffset = pixPosition.y + iwHeight + iwOffsetY + padY - mapHeight;
    }

Original issue reported on code.google.com by IMFro...@gmail.com on 22 Dec 2010 at 3:38

GoogleCodeExporter commented 8 years ago
Sorry, I wasn't accurate. Please, read as "Why infobox do it BELOW?"

Original comment by IMFro...@gmail.com on 22 Dec 2010 at 3:40

GoogleCodeExporter commented 8 years ago
You can use the pixelOffset parameter to position the InfoBox anywhere you want 
relative to the position of the marker. For example, if you want the top of the 
box to be 200 pixels above the marker, specify pixelOffset to be            new 
google.maps.Size(0, 200)

The code segment you referred to is not related. It ensures the box appears 
wholly in the visible portion of the map.

Original comment by garylitt...@gmail.com on 22 Dec 2010 at 5:47

GoogleCodeExporter commented 8 years ago
I do not khow height of the box, so I do not khow offset, is it rare case?

Original comment by IMFro...@gmail.com on 22 Dec 2010 at 10:27

GoogleCodeExporter commented 8 years ago
Perhaps you could create an unattached DIV node containing your content, 
determine the height programmatically (yourDiv.offsetHeight), add the content 
to the InfoBox (with InfoBox.setContent()), then set the pixelOffset (with 
InfoBox.setOptons(...)) to reflect the height.

Gary

Original comment by garylitt...@gmail.com on 22 Dec 2010 at 11:05

GoogleCodeExporter commented 8 years ago
Not the best way, because real height (after applying CSS rules inside the map 
DIV) will be different than height of just content DIV appended somewhere else 
in document. Don't you agree that situation "marker at the bottom, infobox 
above" is default? Many examples (almost all, actually) looks like this.

Original comment by IMFro...@gmail.com on 27 Dec 2010 at 7:36

GoogleCodeExporter commented 8 years ago
So, that is my version (changes, that I did in 1.1.2 to draw windows in right 
direction):

line 334:
if (pixPosition.y < (iwHeight - iwOffsetY + padY)) {
line 335:
yOffset = pixPosition.y - iwHeight + iwOffsetY - padY;
line 456:
this.div_.style.top = (pixPosition.y + this.pixelOffset_.height - 
this.div_.offsetHeight) + "px";

Original comment by IMFro...@gmail.com on 27 Dec 2010 at 9:46

GoogleCodeExporter commented 8 years ago
Replased first two lines with that (works perfect):
        // shift window upwards
    if ( (iwOffsetY < 0) && (pixPosition.y < -iwOffsetY + iwHeight + padY) ) {
        yOffset = pixPosition.y + iwOffsetY - iwHeight - padY;
    }
    // shift window downwards 
    if ( (iwOffsetY > 0) && (pixPosition.y + iwOffsetY + padY > mapHeight) ) {
        yOffset = pixPosition.y + iwOffsetY - padY - iwHeight;
    }

Original comment by IMFro...@gmail.com on 28 Dec 2010 at 12:44

GoogleCodeExporter commented 8 years ago
I have now added an alignBottom property to InfoBox -- if set to true, the 
bottom left of the box DIV will be aligned with the position of the marker 
(instead of the top left). Give it a try and let me know if it solves your 
problem.

It's currently in the trunk version of InfoBox:

http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/src/infob
ox.js

Original comment by garylitt...@gmail.com on 15 Jan 2011 at 6:17

GoogleCodeExporter commented 8 years ago
Hi Gary,

Is there a way to change the pointer position to point down from the bottom of 
the box when this new alignBottom property?  I updated the image, but it 
appears that the marker still renders at the top of the infowindow.

Is there something I am missing!

Thanks for all you hard work--it is much appreciated!

Original comment by berma...@gmail.com on 20 Jan 2011 at 7:52

GoogleCodeExporter commented 8 years ago
The pointer used in the example is not part of the API. It is up to the 
programmer providing the content for the box to pass in an appropriate DIV or 
other HTML content that InfoBox displays -- this would include any arrow-like 
features. Take a look at the basic example to see how this was done for an 
upward pointing arrow at the top of the DIV. Should be pretty easy to figure 
out how to include a bottom pointing arrow at the bottom of the DIV. 

Original comment by garylitt...@gmail.com on 20 Jan 2011 at 8:06

GoogleCodeExporter commented 8 years ago
Fixed in 1.1.3 release of InfoBox.

Original comment by garylitt...@gmail.com on 20 Jan 2011 at 8:13

GoogleCodeExporter commented 8 years ago
Thanks for all the replied guys.

Original comment by jongfree...@googlemail.com on 6 Feb 2013 at 11:31

GoogleCodeExporter commented 8 years ago
[deleted comment]
GoogleCodeExporter commented 8 years ago
Hello, 
I just found this topic and it's have been very usefull to put the infobox 
above the marker but i didn't success in putting the arrow down.

As i can't know the height infobox, i can't make the image with an offset, so i 
guess i need to have it align on bottom as default....

How could i achieve that ?

Thanks in advance for your help.
Florian

Original comment by florian....@gmail.com on 25 May 2013 at 4:47