123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206 |
- define(function() {
-
-
- var getCSSValue = function(element, property) {
- return document.defaultView.getComputedStyle(element,null).getPropertyValue(property);
- };
-
- var measureText = function(context2D, textstring, stroke, fill) {
- var metrics = context2D.measureText(textstring),
- fontFamily = getCSSValue(context2D.canvas,"font-family"),
- fontSize = getCSSValue(context2D.canvas,"font-size").replace("px",""),
- isSpace = !(/\S/.test(textstring));
- metrics.fontsize = fontSize;
-
- var leadDiv = document.createElement("div");
- leadDiv.style.position = "absolute";
- leadDiv.style.opacity = 0;
- leadDiv.style.font = fontSize + "px " + fontFamily;
- leadDiv.innerHTML = textstring + "<br/>" + textstring;
- document.body.appendChild(leadDiv);
-
- metrics.leading = 1.2 * fontSize;
-
- var leadDivHeight = getCSSValue(leadDiv,"height");
- leadDivHeight = leadDivHeight.replace("px","");
- if (leadDivHeight >= fontSize * 2) { metrics.leading = (leadDivHeight/2) | 0; }
- document.body.removeChild(leadDiv);
-
- if (!isSpace) {
-
- var canvas = document.createElement("canvas");
- var padding = 100;
- canvas.width = metrics.width + padding;
- canvas.height = 3*fontSize;
- canvas.style.opacity = 1;
- canvas.style.fontFamily = fontFamily;
- canvas.style.fontSize = fontSize;
- var ctx = canvas.getContext("2d");
- ctx.font = fontSize + "px " + fontFamily;
- var w = canvas.width,
- h = canvas.height,
- baseline = h/2;
-
-
- ctx.fillStyle = "white";
- ctx.fillRect(-1, -1, w + 2, h + 2);
- if (stroke) {
- ctx.strokeStyle = "black";
- ctx.lineWidth = context2D.lineWidth;
- ctx.strokeText(textstring, (padding / 2), baseline);
- }
- if (fill) {
- ctx.fillStyle = "black";
- ctx.fillText(textstring, padding / 2, baseline);
- }
- var pixelData = ctx.getImageData(0, 0, w, h).data;
-
-
- var i = 0,
- w4 = w * 4,
- len = pixelData.length;
-
- while (++i < len && pixelData[i] === 255) {}
- var ascent = (i/w4)|0;
-
- i = len - 1;
- while (--i > 0 && pixelData[i] === 255) {}
- var descent = (i/w4)|0;
-
- for(i = 0; i<len && pixelData[i] === 255; ) {
- i += w4;
- if(i>=len) { i = (i-len) + 4; }}
- var minx = ((i%w4)/4) | 0;
-
- var step = 1;
- for(i = len-3; i>=0 && pixelData[i] === 255; ) {
- i -= w4;
- if(i<0) { i = (len - 3) - (step++)*4; }}
- var maxx = ((i%w4)/4) + 1 | 0;
-
- metrics.ascent = (baseline - ascent);
- metrics.descent = (descent - baseline);
- metrics.bounds = { minx: minx - (padding/2),
- maxx: maxx - (padding/2),
- miny: 0,
- maxy: descent-ascent };
- metrics.height = 1+(descent - ascent);
- }
-
- else {
-
- metrics.ascent = 0;
- metrics.descent = 0;
- metrics.bounds = { minx: 0,
- maxx: metrics.width,
- miny: 0,
- maxy: 0 };
- metrics.height = 0;
- }
- return metrics;
- };
- return measureText;
- });
|