ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix initial offset and visibility issues in VML renderer; also make sure that all floats are converted to integers (previously using toFixed(), now using (num | 0)). p=tschaub,me, r=tschaub,me (closes #2465)

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@10039 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
ahocevar
2010-02-10 07:04:31 +00:00
parent b19261d417
commit 6811dc3745
2 changed files with 43 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
lib/OpenLayers/Renderer/VML.js
View File

@@ -11,7 +11,7 @@
* Render vector features in browsers with VML capability. Construct a new
* VML renderer with the <OpenLayers.Renderer.VML> constructor.
*
* Note that for all calculations in this class, we use toFixed() to round a
* Note that for all calculations in this class, we use (num | 0) to truncate a
* float value to an integer. This is done because it seems that VML doesn't
* support float values.
*
@@ -63,7 +63,6 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
OpenLayers.Renderer.Elements.prototype.initialize.apply(this,
arguments);
this.offset = {x: 0, y: 0};
},
/**
@@ -102,9 +101,9 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
arguments);
var resolution = this.getResolution();
var left = extent.left/resolution;
var top = extent.top/resolution - this.size.h;
if (resolutionChanged) {
var left = (extent.left/resolution) | 0;
var top = (extent.top/resolution - this.size.h) | 0;
if (resolutionChanged || !this.offset) {
this.offset = {x: left, y: top};
left = 0;
top = 0;
@@ -233,8 +232,8 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
var yOffset = (style.graphicYOffset != undefined) ?
style.graphicYOffset : -(0.5 * height);
node.style.left = ((geometry.x/resolution - this.offset.x)+xOffset).toFixed();
node.style.top = ((geometry.y/resolution - this.offset.y)-(yOffset+height)).toFixed();
node.style.left = (((geometry.x/resolution - this.offset.x)+xOffset) | 0) + "px";
node.style.top = (((geometry.y/resolution - this.offset.y)-(yOffset+height)) | 0) + "px";
node.style.width = width + "px";
node.style.height = height + "px";
node.style.flip = "y";
@@ -445,10 +444,13 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
/**
* Method: postDraw
* Some versions of Internet Explorer seem to be unable to set fillcolor
* and strokecolor to "none" correctly before the fill node is appended to
* a visible vml node. This method takes care of that and sets fillcolor
* and strokecolor again if needed.
* Does some node postprocessing to work around browser issues:
* - Some versions of Internet Explorer seem to be unable to set fillcolor
* and strokecolor to "none" correctly before the fill node is appended
* to a visible vml node. This method takes care of that and sets
* fillcolor and strokecolor again if needed.
* - In some cases, a node won't become visible after being drawn. Setting
* style.visibility to "visible" works around that.
*
* Parameters:
* node - {DOMElement}
@@ -464,6 +466,7 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
node.strokecolor != strokeColor) {
node.strokecolor = strokeColor;
}
node.style.visibility = "visible";
},
@@ -483,10 +486,10 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
var resolution = this.getResolution();
var scaledBox =
new OpenLayers.Bounds((bbox.left/resolution - this.offset.x).toFixed(),
(bbox.bottom/resolution - this.offset.y).toFixed(),
(bbox.right/resolution - this.offset.x).toFixed(),
(bbox.top/resolution - this.offset.y).toFixed());
new OpenLayers.Bounds((bbox.left/resolution - this.offset.x) | 0,
(bbox.bottom/resolution - this.offset.y) | 0,
(bbox.right/resolution - this.offset.x) | 0,
(bbox.top/resolution - this.offset.y) | 0);
// Set the internal coordinate system to draw the path
node.style.left = scaledBox.left + "px";
@@ -652,8 +655,8 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
if(!isNaN(geometry.x)&& !isNaN(geometry.y)) {
var resolution = this.getResolution();
node.style.left = ((geometry.x /resolution - this.offset.x).toFixed() - radius) + "px";
node.style.top = ((geometry.y /resolution - this.offset.y).toFixed() - radius) + "px";
node.style.left = (((geometry.x /resolution - this.offset.x) | 0) - radius) + "px";
node.style.top = (((geometry.y /resolution - this.offset.y) | 0) - radius) + "px";
var diameter = radius * 2;
@@ -718,9 +721,9 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
var comp, x, y;
for (var i = 0; i < numComponents; i++) {
comp = geometry.components[i];
x = (comp.x/resolution - this.offset.x);
y = (comp.y/resolution - this.offset.y);
parts[i] = " " + x.toFixed() + "," + y.toFixed() + " l ";
x = (comp.x/resolution - this.offset.x) | 0;
y = (comp.y/resolution - this.offset.y) | 0;
parts[i] = " " + x + "," + y + " l ";
}
var end = (closeLine) ? " x e" : " e";
node.path = "m" + parts.join("") + end;
@@ -751,9 +754,9 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
path.push("m");
for (i=0, ilen=linearRing.components.length; i<ilen; i++) {
comp = linearRing.components[i];
x = comp.x / resolution - this.offset.x;
y = comp.y / resolution - this.offset.y;
path.push(" " + x.toFixed() + "," + y.toFixed());
x = (comp.x / resolution - this.offset.x) | 0;
y = (comp.y / resolution - this.offset.y) | 0;
path.push(" " + x + "," + y);
if (i==0) {
path.push(" l");
}
@@ -779,10 +782,10 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
drawRectangle: function(node, geometry) {
var resolution = this.getResolution();
node.style.left = (geometry.x/resolution - this.offset.x) + "px";
node.style.top = (geometry.y/resolution - this.offset.y) + "px";
node.style.width = geometry.width/resolution + "px";
node.style.height = geometry.height/resolution + "px";
node.style.left = ((geometry.x/resolution - this.offset.x) | 0) + "px";
node.style.top = ((geometry.y/resolution - this.offset.y) | 0) + "px";
node.style.width = ((geometry.width/resolution) | 0) + "px";
node.style.height = ((geometry.height/resolution) | 0) + "px";
return node;
},
@@ -801,8 +804,8 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
var textbox = this.nodeFactory(featureId + this.LABEL_ID_SUFFIX + "_textbox", "olv:textbox");
var resolution = this.getResolution();
label.style.left = (location.x/resolution - this.offset.x).toFixed() + "px";
label.style.top = (location.y/resolution - this.offset.y).toFixed() + "px";
label.style.left = ((location.x/resolution - this.offset.x) | 0) + "px";
label.style.top = ((location.y/resolution - this.offset.y) | 0) + "px";
label.style.flip = "y";
textbox.innerText = style.label;
@@ -869,8 +872,8 @@ OpenLayers.Renderer.VML = OpenLayers.Class(OpenLayers.Renderer.Elements, {
var comp, x, y;
for (var i=0, len=geometry.components.length; i<len; i++) {
comp = geometry.components[i];
x = comp.x / resolution - this.offset.x;
y = comp.y / resolution - this.offset.y;
x = (comp.x / resolution - this.offset.x) | 0;
y = (comp.y / resolution - this.offset.y) | 0;
if ((i%3)==0 && (i/3)==0) {
path.push("m");
} else if ((i%3)==1) {

11
tests/Renderer/VML.html
View File

@@ -48,7 +48,7 @@
return;
}
t.plan(3);
t.plan(4);
OpenLayers.Renderer.Elements.prototype._setExtent =
OpenLayers.Renderer.Elements.prototype.setExtent;
@@ -71,8 +71,9 @@
t.eq(g_SetExtent, true, "Elements.setExtent() called");
t.ok(r.root.coordorigin == "2,4", "coordorigin is correct");
t.ok(r.root.coordorigin == "0,0", "coordorigin is correct");
t.ok(r.root.coordsize == "4,4", "coordsize is correct");
t.eq(r.offset, {x:2, y:4}, "offset is correct");
OpenLayers.Renderer.Elements.prototype.setExtent =
OpenLayers.Renderer.Elements.prototype._setExtent;
@@ -106,6 +107,7 @@
t.plan(2);
var r = new OpenLayers.Renderer.VML(document.body);
r.offset = {x: 0, y: 0};
r.LABEL_ID_SUFFIX = "";
r.getResolution = function() {
@@ -155,6 +157,7 @@
t.plan(4);
var r = new OpenLayers.Renderer.VML(document.body);
r.offset = {x: 0, y: 0};
r.resolution = 0.5;
var node = document.createElement('div');
@@ -182,6 +185,7 @@
t.plan(6);
var r = new OpenLayers.Renderer.VML(document.body);
r.offset = {x: 0, y: 0};
r.resolution = 1;
var node = document.createElement('div');
@@ -263,6 +267,7 @@
t.plan(8);
var r = new OpenLayers.Renderer.VML(document.body);
r.offset = {x: 0, y: 0};
r.resolution = 0.5;
var node = document.createElement('div');
@@ -303,6 +308,7 @@
t.plan(2);
var r = new OpenLayers.Renderer.VML(document.body);
r.offset = {x: 0, y: 0};
r.resolution = 0.5;
g_SetNodeDimension = false;
@@ -347,6 +353,7 @@
t.plan(4);
var r = new OpenLayers.Renderer.VML(document.body);
r.offset = {x: 0, y: 0};
r.resolution = 0.5;
var node = document.createElement('div');