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

adding support for line breaks to SVG, SVG2 and Canvas renderers. Also adds vertical alignment support to Canvas. p=vog,fredj,me r=me (closes #2193)

Browse Source 
git-svn-id: http://svn.openlayers.org/trunk/openlayers@11838 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
ahocevar
2011-03-31 11:58:28 +00:00
parent 9d04541683
commit 174078bca9
4 changed files with 152 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/OpenLayers/Renderer/Canvas.js
+54 -22
View File
@@ -9,7 +9,7 @@
/**
* Class: OpenLayers.Renderer.Canvas
* A renderer based on the 2D 'canvas' drawing element.element
* A renderer based on the 2D 'canvas' drawing element.
*
* Inherits:
* - <OpenLayers.Renderer>
@@ -329,42 +329,61 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
labelAlign: "cm"
}, style);
var pt = this.getLocalXY(location);
this.setCanvasStyle("reset");
this.canvas.fillStyle = style.fontColor;
this.canvas.globalAlpha = style.fontOpacity || 1.0;
var fontStyle = [style.fontStyle ? style.fontStyle : "normal",
"normal", // "font-variant" not supported
style.fontWeight ? style.fontWeight : "normal",
style.fontSize ? style.fontSize : "10px",
style.fontSize ? style.fontSize : "1em",
style.fontFamily ? style.fontFamily : "sans-serif"].join(" ");
var labelRows = style.label.split('\n');
var numRows = labelRows.length;
if (this.canvas.fillText) {
// HTML5
var labelAlign =
this.canvas.font = fontStyle;
this.canvas.textAlign =
OpenLayers.Renderer.Canvas.LABEL_ALIGN[style.labelAlign[0]] ||
"center";
this.canvas.font = fontStyle;
this.canvas.textAlign = labelAlign;
this.canvas.fillText(style.label, pt[0], pt[1]);
this.canvas.textBaseline =
OpenLayers.Renderer.Canvas.LABEL_ALIGN[style.labelAlign[1]] ||
"middle";
var vfactor =
OpenLayers.Renderer.Canvas.LABEL_FACTOR[style.labelAlign[1]];
if (vfactor == null) {
vfactor = -.5;
}
var lineHeight =
this.canvas.measureText('Mg').height ||
this.canvas.measureText('xx').width;
pt[1] += lineHeight*vfactor*(numRows-1);
for (var i = 0; i < numRows; i++) {
this.canvas.fillText(labelRows[i], pt[0], pt[1] + (lineHeight*i));
}
} else if (this.canvas.mozDrawText) {
// Mozilla pre-Gecko1.9.1 (<FF3.1)
this.canvas.mozTextStyle = fontStyle;
// No built-in text alignment, so we measure and adjust the position
var len = this.canvas.mozMeasureText(style.label);
switch(style.labelAlign[0]) {
case "l":
break;
case "r":
pt[0] -= len;
break;
case "c":
default:
pt[0] -= len / 2;
var hfactor =
OpenLayers.Renderer.Canvas.LABEL_FACTOR[style.labelAlign[0]];
if (hfactor == null) {
hfactor = -.5;
}
var vfactor =
OpenLayers.Renderer.Canvas.LABEL_FACTOR[style.labelAlign[1]];
if (vfactor == null) {
vfactor = -.5;
}
var lineHeight = this.canvas.mozMeasureText('xx');
pt[1] += lineHeight*(1 + (vfactor*numRows));
for (var i = 0; i < numRows; i++) {
var x = pt[0] + (hfactor*this.canvas.mozMeasureText(labelRows[i]));
var y = pt[1] + (i*lineHeight);
this.canvas.translate(x, y);
this.canvas.mozDrawText(labelRows[i]);
this.canvas.translate(-x, -y);
}
this.canvas.translate(pt[0], pt[1]);
this.canvas.mozDrawText(style.label);
this.canvas.translate(-1*pt[0], -1*pt[1]);
}
this.setCanvasStyle("reset");
},
@@ -478,5 +497,18 @@ OpenLayers.Renderer.Canvas = OpenLayers.Class(OpenLayers.Renderer, {
*/
OpenLayers.Renderer.Canvas.LABEL_ALIGN = {
"l": "left",
"r": "right"
"r": "right",
"t": "top",
"b": "bottom"
};
/**
* Constant: OpenLayers.Renderer.Canvas.LABEL_FACTOR
* {Object}
*/
OpenLayers.Renderer.Canvas.LABEL_FACTOR = {
"l": 0,
"r": -1,
"t": 0,
"b": -1
};