[OpenLayers-Users] Vector layer positioning problem

Todd Nemanich todd.nemanich at gmail.com
Fri Jun 6 13:28:53 EDT 2008


Hello,
        I'm having a problem with a vector layer displaying
incorrectly in IE (works fine in firefox). I have a marker and a
vector showing the path taken. In IE6, the vector is drawn in the
wrong position (the path appears correct, but in the wrong spot). The
problem appears to be related to the zoom, as the difference between
the marker and the endpoint of the vector increases as you zoom out. I
tried using the nightly build of OpenLayers.js, but that didn't fix
the vector. The map is using the mercator projection.
        I did some checking on the lists, and it sounded like it might
be related to a margin element in the CSS
http://www.nabble.com/GML-vector-layers-in-IE-to14623748.html#a14623748
I tried setting margin: 0px on the map div, but that didn't correct
the problem. When I looked into the output, it seems to pickup a
margin attribute at the group tag inside the vector layer but before
my linestring. According to IE, these are the styles on the group tag:
display: inline-block
font-family: verdana,sans-serif
font-size: 8pt
hasLayout: -1
height: 134217.727pt
margin: -1.5pt auto auto 132pt
margin-left: 132pt
margin-top: -1.5pt
position: absolute
text-align: center
visibility: visible
width: 134217.727pt

I've included below the applied stylesheets according to IE. I have no
idea how the margin, height, or width attributes are being set to
these values. Has anyone else seen this, or have any suggestions to
correct it? Thanks!



/****************************************************************************/
/* Matches for node: group id=OpenLayers.Layer.Vector_345_root */
/****************************************************************************/

/* Inline style */
{
	VISIBILITY: visible;
	WIDTH: 913px;
	HEIGHT: 500px
}

/****************************************************************************/
/* Matches for node: DIV id=OpenLayers.Layer.Vector_345_vmlRoot */
/****************************************************************************/

/* Inline style */
{
	WIDTH: 913px;
	HEIGHT: 500px
}

/****************************************************************************/
/* Matches for node: DIV class=olLayerDiv id=OpenLayers.Layer.Vector_345 */
/****************************************************************************/

/* Inline style */
{
	Z-INDEX: 340;
	LEFT: 199px;
	WIDTH: 100%;
        POSITION: absolute;
	TOP: -111px;
	HEIGHT: 100%
}

/* Rule 1 of /js/theme/default/style.css */
DIV.olLayerDiv {
	moz-user-select: none
}

/****************************************************************************/
/* Matches for node: DIV id=olmap_OpenLayers_Container */
/****************************************************************************/

/* Inline style */
{
	Z-INDEX: 749;
	LEFT: -199px;
	POSITION: absolute;
	TOP: 111px
}

/****************************************************************************/
/* Matches for node: DIV class=olMapViewport id=olmap_OpenLayers_ViewPort */
/****************************************************************************/

/* Inline style */
{
	OVERFLOW: hidden;
	WIDTH: 100%;
	POSITION: relative;
	HEIGHT: 100%
}

/****************************************************************************/
/* Matches for node: DIV id=olmap */
/****************************************************************************/

/* Inline style */
{
	WIDTH: 913px;
	HEIGHT: 500px
}

/****************************************************************************/
/* Matches for node: TD */
/****************************************************************************/

/* Inline style */
{
	BORDER-RIGHT: #000000 1px solid;
	BORDER-TOP: #000000 1px solid;
	BORDER-LEFT: #000000 1px solid;
	BORDER-BOTTOM: #000000 1px solid
}

/* Rule 9 of embedded stylesheet */
TD {
	FONT-SIZE: 8pt;
	FONT-FAMILY: verdana,sans-serif
}

/****************************************************************************/
/* Matches for node: TD */
/****************************************************************************/

/* Rule 9 of embedded stylesheet */
TD {
	FONT-SIZE: 8pt;
	FONT-FAMILY: verdana,sans-serif
}

/****************************************************************************/
/* Matches for node: TD class=frameStyle */
/****************************************************************************/

/* Inline style */
{
	PADDING-RIGHT: 5px;
	PADDING-LEFT: 5px;
	FONT-SIZE: 7pt;
	PADDING-BOTTOM: 5px;
	PADDING-TOP: 0px
}

/* Rule 21 of embedded stylesheet */
.frameStyle {
	BORDER-RIGHT: #555555 1px solid;
	PADDING-RIGHT: 5px;
	BORDER-TOP: #555555 1px solid;
	PADDING-LEFT: 5px;
	PADDING-BOTTOM: 5px;
	BORDER-LEFT: #555555 1px solid;
	PADDING-TOP: 5px;
	BORDER-BOTTOM: #555555 1px solid;
	BACKGROUND-COLOR: #f7f9f9
}

/* Rule 9 of embedded stylesheet */
TD {
	FONT-SIZE: 8pt;
	FONT-FAMILY: verdana,sans-serif
}

/****************************************************************************/
/* Matches for node: TABLE class=contentTableFrame */
/****************************************************************************/

/* Rule 20 of embedded stylesheet */
.contentTableFrame {
	MARGIN-TOP: 10px;
	WIDTH: 90%;
	HEIGHT: 600px
}

/****************************************************************************/
/* Matches for node: TD */
/****************************************************************************/

/* Inline style */
{
	HEIGHT: 100%
}

/* Rule 9 of embedded stylesheet */
TD {
	FONT-SIZE: 8pt;
	FONT-FAMILY: verdana,sans-serif
}

/****************************************************************************/
/* Matches for node: BODY */
/****************************************************************************/

/* Rule 1 of embedded stylesheet */
BODY {
	BACKGROUND-IMAGE: url(./images/background.png)
}

/* Rule 8 of embedded stylesheet */
BODY {
	FONT-SIZE: 8pt;
	FONT-FAMILY: verdana,sans-serif
}



More information about the Users mailing list