3 * Pure JavaScript plotting plugin using jQuery
8 * Copyright (c) 2009-2012 Chris Leonello
9 * jqPlot is currently available for use in all personal or commercial projects
10 * under both the MIT (http://www.opensource.org/licenses/mit-license.php) and GPL
11 * version 2.0 (http://www.gnu.org/licenses/gpl-2.0.html) licenses. This means that you can
12 * choose the license that best suits your project and use it accordingly.
14 * Although not required, the author would appreciate an email letting him
15 * know of any substantial use of jqPlot. You can reach the author at:
16 * chris at jqplot dot com or see http://www.jqplot.com/info.php .
18 * If you are feeling kind and generous, consider supporting the project by
19 * making a donation at: http://www.jqplot.com/donate.php .
21 * sprintf functions contained in jqplot.sprintf.js by Ash Searle:
25 * http://hexmen.com/blog/2007/03/printf-sprintf/
26 * http://hexmen.com/js/sprintf.js
27 * The author (Ash Searle) has placed this code in the public domain:
28 * "This code is unrestricted: you are free to use it however you like."
33 * Class: $.jqplot.CanvasAxisLabelRenderer
34 * Renderer to draw axis labels with a canvas element to support advanced
35 * featrues such as rotated text. This renderer uses a separate rendering engine
36 * to draw the text on the canvas. Two modes of rendering the text are available.
37 * If the browser has native font support for canvas fonts (currently Mozila 3.5
38 * and Safari 4), you can enable text rendering with the canvas fillText method.
39 * You do so by setting the "enableFontSupport" option to true.
41 * Browsers lacking native font support will have the text drawn on the canvas
42 * using the Hershey font metrics. Even if the "enableFontSupport" option is true
43 * non-supporting browsers will still render with the Hershey font.
46 $.jqplot.CanvasAxisLabelRenderer = function(options) {
50 // angle of text, measured clockwise from x axis.
52 // name of the axis associated with this tick
55 // wether or not to show the tick (mark and label).
58 // wether or not to show the label.
59 this.showLabel = true;
61 // label for the axis.
64 // CSS spec for the font-family css attribute.
65 // Applies only to browsers supporting native font rendering in the
66 // canvas tag. Currently Mozilla 3.5 and Safari 4.
67 this.fontFamily = '"Trebuchet MS", Arial, Helvetica, sans-serif';
69 // CSS spec for font size.
70 this.fontSize = '11pt';
72 // CSS spec for fontWeight: normal, bold, bolder, lighter or a number 100 - 900
73 this.fontWeight = 'normal';
75 // Multiplier to condense or expand font width.
76 // Applies only to browsers which don't support canvas native font rendering.
77 this.fontStretch = 1.0;
79 // css spec for the color attribute.
80 this.textColor = '#666666';
81 // prop: enableFontSupport
82 // true to turn on native canvas font support in Mozilla 3.5+ and Safari 4+.
83 // If true, label will be drawn with canvas tag native support for fonts.
84 // If false, label will be drawn with Hershey font metrics.
85 this.enableFontSupport = true;
87 // Point to pixel scaling factor, used for computing height of bounding box
88 // around a label. The labels text renderer has a default setting of 1.4, which
89 // should be suitable for most fonts. Leave as null to use default. If tops of
90 // letters appear clipped, increase this. If bounding box seems too big, decrease.
91 // This is an issue only with the native font renderering capabilities of Mozilla
92 // 3.5 and Safari 4 since they do not provide a method to determine the font height.
99 this._plotDimensions = {height:null, width:null};
101 $.extend(true, this, options);
103 if (options.angle == null && this.axis != 'xaxis' && this.axis != 'x2axis') {
107 var ropts = {fontSize:this.fontSize, fontWeight:this.fontWeight, fontStretch:this.fontStretch, fillStyle:this.textColor, angle:this.getAngleRad(), fontFamily:this.fontFamily};
109 ropts.pt2px = this.pt2px;
112 if (this.enableFontSupport) {
113 if ($.jqplot.support_canvas_text()) {
114 this._textRenderer = new $.jqplot.CanvasFontRenderer(ropts);
118 this._textRenderer = new $.jqplot.CanvasTextRenderer(ropts);
122 this._textRenderer = new $.jqplot.CanvasTextRenderer(ropts);
126 $.jqplot.CanvasAxisLabelRenderer.prototype.init = function(options) {
127 $.extend(true, this, options);
128 this._textRenderer.init({fontSize:this.fontSize, fontWeight:this.fontWeight, fontStretch:this.fontStretch, fillStyle:this.textColor, angle:this.getAngleRad(), fontFamily:this.fontFamily});
131 // return width along the x axis
132 // will check first to see if an element exists.
133 // if not, will return the computed text box width.
134 $.jqplot.CanvasAxisLabelRenderer.prototype.getWidth = function(ctx) {
136 return this._elem.outerWidth(true);
139 var tr = this._textRenderer;
140 var l = tr.getWidth(ctx);
141 var h = tr.getHeight(ctx);
142 var w = Math.abs(Math.sin(tr.angle)*h) + Math.abs(Math.cos(tr.angle)*l);
147 // return height along the y axis.
148 $.jqplot.CanvasAxisLabelRenderer.prototype.getHeight = function(ctx) {
150 return this._elem.outerHeight(true);
153 var tr = this._textRenderer;
154 var l = tr.getWidth(ctx);
155 var h = tr.getHeight(ctx);
156 var w = Math.abs(Math.cos(tr.angle)*h) + Math.abs(Math.sin(tr.angle)*l);
161 $.jqplot.CanvasAxisLabelRenderer.prototype.getAngleRad = function() {
162 var a = this.angle * Math.PI/180;
166 $.jqplot.CanvasAxisLabelRenderer.prototype.draw = function(ctx, plot) {
167 // Memory Leaks patch
169 if ($.jqplot.use_excanvas && window.G_vmlCanvasManager.uninitElement !== undefined) {
170 window.G_vmlCanvasManager.uninitElement(this._elem.get(0));
173 this._elem.emptyForce();
177 // create a canvas here, but can't draw on it untill it is appended
178 // to dom for IE compatability.
179 var elem = plot.canvasManager.getCanvas();
181 this._textRenderer.setText(this.label, ctx);
182 var w = this.getWidth(ctx);
183 var h = this.getHeight(ctx);
186 elem.style.width = w;
187 elem.style.height = h;
189 elem = plot.canvasManager.initCanvas(elem);
191 this._elem = $(elem);
192 this._elem.css({ position: 'absolute'});
193 this._elem.addClass('jqplot-'+this.axis+'-label');
199 $.jqplot.CanvasAxisLabelRenderer.prototype.pack = function() {
200 this._textRenderer.draw(this._elem.get(0).getContext("2d"), this.label);