jqplot-canvasAxisLabelRenderer-js.html
21.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html><head><title>$.jqplot.CanvasAxisLabelRenderer</title><link rel="stylesheet" type="text/css" href="../../styles/main.css"><script language=JavaScript src="../../javascript/main.js"></script><script language=JavaScript src="../../javascript/searchdata.js"></script></head><body class="ContentPage" onLoad="NDOnLoad()"><script language=JavaScript><!--
if (browserType) {document.write("<div class=" + browserType + ">");if (browserVer) {document.write("<div class=" + browserVer + ">"); }}// --></script>
<!-- Generated by Natural Docs, version 1.4 -->
<!-- http://www.naturaldocs.org -->
<!-- saved from url=(0026)http://www.naturaldocs.org -->
<div id=Content><div class="CClass"><div class=CTopic id=MainTopic><div class="CTitle logo"><div class="nav"><a class="nav" href="../../../index.php"><span>></span>Home</a><a class="nav" href="../../../tests/"><span>></span>Examples</a><a class="nav" href="../../../docs/"><span>></span>Docs</a><a class="nav" href="http://bitbucket.org/cleonello/jqplot/downloads/"><span>></span>Download</a><a class="nav" href="../../../info.php"><span>></span>Info</a><a class="nav" href="../../../donate.php"><span>></span>Donate</a></div><a name="$.jqplot.CanvasAxisLabelRenderer"></a>$.jqplot.<wbr>CanvasAxisLabelRenderer</div><div class=CBody><p>Renderer to draw axis labels with a canvas element to support advanced featrues such as rotated text. This renderer uses a separate rendering engine to draw the text on the canvas. Two modes of rendering the text are available. If the browser has native font support for canvas fonts (currently Mozila 3.5 and Safari 4), you can enable text rendering with the canvas fillText method. You do so by setting the “enableFontSupport” option to true.</p><p>Browsers lacking native font support will have the text drawn on the canvas using the Hershey font metrics. Even if the “enableFontSupport” option is true non-supporting browsers will still render with the Hershey font.</p><!--START_ND_SUMMARY--><div class=Summary><div class=STitle>Summary</div><div class=SBorder><table border=0 cellspacing=0 cellpadding=0 class=STable><tr class="SMain"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer" >$.jqplot.<wbr>CanvasAxisLabelRenderer</a></td><td class=SDescription>Renderer to draw axis labels with a canvas element to support advanced featrues such as rotated text. </td></tr><tr class="SGroup SIndent1"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.Properties" >Properties</a></td><td class=SDescription></td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.angle" id=link1 onMouseOver="ShowTip(event, 'tt1', 'link1')" onMouseOut="HideTip('tt1')">angle</a></td><td class=SDescription>angle of text, measured clockwise from x axis.</td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.show" id=link2 onMouseOver="ShowTip(event, 'tt2', 'link2')" onMouseOut="HideTip('tt2')">show</a></td><td class=SDescription>wether or not to show the tick (mark and label).</td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.showLabel" id=link3 onMouseOver="ShowTip(event, 'tt3', 'link3')" onMouseOut="HideTip('tt3')">showLabel</a></td><td class=SDescription>wether or not to show the label.</td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.label" id=link4 onMouseOver="ShowTip(event, 'tt4', 'link4')" onMouseOut="HideTip('tt4')">label</a></td><td class=SDescription>label for the axis.</td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.fontFamily" id=link5 onMouseOver="ShowTip(event, 'tt5', 'link5')" onMouseOut="HideTip('tt5')">fontFamily</a></td><td class=SDescription>CSS spec for the font-family css attribute. </td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.fontSize" id=link6 onMouseOver="ShowTip(event, 'tt6', 'link6')" onMouseOut="HideTip('tt6')">fontSize</a></td><td class=SDescription>CSS spec for font size.</td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.fontWeight" id=link7 onMouseOver="ShowTip(event, 'tt7', 'link7')" onMouseOut="HideTip('tt7')">fontWeight</a></td><td class=SDescription></td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.fontStretch" id=link8 onMouseOver="ShowTip(event, 'tt8', 'link8')" onMouseOut="HideTip('tt8')">fontStretch</a></td><td class=SDescription>Multiplier to condense or expand font width. </td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.textColor" id=link9 onMouseOver="ShowTip(event, 'tt9', 'link9')" onMouseOut="HideTip('tt9')">textColor</a></td><td class=SDescription>css spec for the color attribute.</td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.enableFontSupport" id=link10 onMouseOver="ShowTip(event, 'tt10', 'link10')" onMouseOut="HideTip('tt10')">enableFontSupport</a></td><td class=SDescription>true to turn on native canvas font support in Mozilla 3.5+ and Safari 4+. </td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.CanvasAxisLabelRenderer.pt2px" id=link11 onMouseOver="ShowTip(event, 'tt11', 'link11')" onMouseOut="HideTip('tt11')">pt2px</a></td><td class=SDescription>Point to pixel scaling factor, used for computing height of bounding box around a label. </td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>
<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.Properties"></a>Properties</h3></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.angle"></a>angle</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.angle = 0</td></tr></table></blockquote><p>angle of text, measured clockwise from x axis.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.show"></a>show</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.show = true</td></tr></table></blockquote><p>wether or not to show the tick (mark and label).</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.showLabel"></a>showLabel</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.showLabel = true</td></tr></table></blockquote><p>wether or not to show the label.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.label"></a>label</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.label = ''</td></tr></table></blockquote><p>label for the axis.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.fontFamily"></a>fontFamily</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontFamily = '"Trebuchet MS", Arial, Helvetica, sans-serif'</td></tr></table></blockquote><p>CSS spec for the font-family css attribute. Applies only to browsers supporting native font rendering in the canvas tag. Currently Mozilla 3.5 and Safari 4.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.fontSize"></a>fontSize</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontSize = '11pt'</td></tr></table></blockquote><p>CSS spec for font size.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.fontWeight"></a>fontWeight</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontWeight = 'normal'</td></tr></table></blockquote><table border=0 cellspacing=0 cellpadding=0 class=CDescriptionList><tr><td class=CDLEntry>CSS spec for fontWeight: normal, bold, bolder, lighter or a number 100</td><td class=CDLDescription>900</td></tr></table></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.fontStretch"></a>fontStretch</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontStretch = 1.0</td></tr></table></blockquote><p>Multiplier to condense or expand font width. Applies only to browsers which don’t support canvas native font rendering.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.textColor"></a>textColor</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.textColor = '#666666'</td></tr></table></blockquote><p>css spec for the color attribute.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.enableFontSupport"></a>enableFontSupport</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.enableFontSupport = true</td></tr></table></blockquote><p>true to turn on native canvas font support in Mozilla 3.5+ and Safari 4+. If true, label will be drawn with canvas tag native support for fonts. If false, label will be drawn with Hershey font metrics.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.CanvasAxisLabelRenderer.pt2px"></a>pt2px</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.pt2px = null</td></tr></table></blockquote><p>Point to pixel scaling factor, used for computing height of bounding box around a label. The labels text renderer has a default setting of 1.4, which should be suitable for most fonts. Leave as null to use default. If tops of letters appear clipped, increase this. If bounding box seems too big, decrease. This is an issue only with the native font renderering capabilities of Mozilla 3.5 and Safari 4 since they do not provide a method to determine the font height.</p></div></div></div>
</div><!--Content-->
<div id=Footer>Copyright © 2009 - 2010 Chris Leonello · Updated November 12th, 2012 · <a href="http://www.naturaldocs.org">Generated by Natural Docs</a></div><!--Footer-->
<div id=Menu><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent1')">Usage and Options</a><div class=MGroupContent id=MGroupContent1><div class=MEntry><div class=MFile><a href="../usage-txt.html">Usage</a></div></div><div class=MEntry><div class=MFile><a href="../jqPlotOptions-txt.html">jqPlot Options</a></div></div><div class=MEntry><div class=MFile><a href="../optionsTutorial-txt.html">Options Tutorial</a></div></div><div class=MEntry><div class=MFile><a href="../jqPlotCssStyling-txt.html">jqPlot CSS Customization</a></div></div><div class=MEntry><div class=MFile><a href="../changes-txt.html">Change Log</a></div></div><div class=MEntry><div class=MLink><a href="../../tests/">Examples</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent4')">API Documentation</a><div class=MGroupContent id=MGroupContent4><div class=MEntry><div class=MFile><a href="../jqplot-core-js.html">jqPlot Charts</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent2')">Core Renderers</a><div class=MGroupContent id=MGroupContent2><div class=MEntry><div class=MFile><a href="../jqplot-axisTickRenderer-js.html">Axis Tick Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-canvasGridRenderer-js.html">Canvas Grid Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-divTitleRenderer-js.html">Div Title Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-linearAxisRenderer-js.html">Linear Axis Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-markerRenderer-js.html">Marker Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-shapeRenderer-js.html">Shape Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-shadowRenderer-js.html">Shadow Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-lineRenderer-js.html">Line Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-axisLabelRenderer-js.html">Axis Label Renderer</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-themeEngine-js.html">Theme Engine</a></div></div><div class=MEntry><div class=MFile><a href="../jqplot-toImage-js.html">fn</a></div></div></div></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent3')">Plugins</a><div class=MGroupContent id=MGroupContent3><div class=MEntry><div class=MFile><a href="jqplot-barRenderer-js.html">jqplot.<wbr>BarRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-BezierCurveRenderer-js.html">jqplot.<wbr>BezierCurveRenderer.js</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-blockRenderer-js.html">jqplot.<wbr>BlockRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-bubbleRenderer-js.html">jqplot.<wbr>BubbleRenderer</a></div></div><div class=MEntry><div class=MFile id=MSelected>jqplot.<wbr>CanvasAxisLabelRenderer</div></div><div class=MEntry><div class=MFile><a href="jqplot-canvasAxisTickRenderer-js.html">jqplot.<wbr>CanvasAxisTickRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-pyramidGridRenderer-js.html">jqplot.<wbr>CanvasGridRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-canvasOverlay-js.html">jqplot.<wbr>CanvasOverlay</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-categoryAxisRenderer-js.html">jqplot.<wbr>CategoryAxisRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-ciParser-js.html">jqplot.<wbr>ciParser</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-cursor-js.html">jqplot.<wbr>Cursor</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-dateAxisRenderer-js.html">jqplot.<wbr>DateAxisRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-donutRenderer-js.html">jqplot.<wbr>DonutRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-dragable-js.html">jqplot.<wbr>Dragable</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-enhancedLegendRenderer-js.html">jqplot.<wbr>enhancedLegendRenderer.js</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-funnelRenderer-js.html">jqplot.<wbr>FunnelRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-highlighter-js.html">jqplot.<wbr>Highlighter</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-logAxisRenderer-js.html">jqplot.<wbr>LogAxisRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-mekkoAxisRenderer-js.html">jqplot.<wbr>MekkoAxisRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-mekkoRenderer-js.html">jqplot.<wbr>MekkoRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-meterGaugeRenderer-js.html">jqplot.<wbr>MeterGaugeRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-ohlcRenderer-js.html">jqplot.<wbr>OHLCRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-pieRenderer-js.html">jqplot.<wbr>PieRenderer</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-pointLabels-js.html">jqplot.<wbr>PointLabels</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-pyramidAxisRenderer-js.html">jqplot.<wbr>pyramidAxisRenderer.js</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-pyramidRenderer-js.html">jqplot.<wbr>pyramidRenderer.js</a></div></div><div class=MEntry><div class=MFile><a href="jqplot-trendline-js.html">jqplot.<wbr>Trendline</a></div></div></div></div></div></div></div></div><div class=MEntry><div class=MFile><a href="../gpl-2-0-txt.html">GPL License</a></div></div><div class=MEntry><div class=MFile><a href="../MIT-LICENSE-txt.html">MIT License</a></div></div><div class=MEntry><div class=MGroup><a href="javascript:ToggleMenu('MGroupContent5')">Index</a><div class=MGroupContent id=MGroupContent5><div class=MEntry><div class=MIndex><a href="../../index/General.html">Everything</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Classes.html">Classes</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Properties.html">Properties</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Functions.html">Functions</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Hooks.html">Hooks</a></div></div><div class=MEntry><div class=MIndex><a href="../../index/Files.html">Files</a></div></div></div></div></div><script type="text/javascript"><!--
var searchPanel = new SearchPanel("searchPanel", "HTML", "../../search");
--></script><div id=MSearchPanel class=MSearchPanelInactive><input type=text id=MSearchField value=Search onFocus="searchPanel.OnSearchFieldFocus(true)" onBlur="searchPanel.OnSearchFieldFocus(false)" onKeyUp="searchPanel.OnSearchFieldChange()"><select id=MSearchType onFocus="searchPanel.OnSearchTypeFocus(true)" onBlur="searchPanel.OnSearchTypeFocus(false)" onChange="searchPanel.OnSearchTypeChange()"><option id=MSearchEverything selected value="General">Everything</option><option value="Classes">Classes</option><option value="Files">Files</option><option value="Functions">Functions</option><option value="Hooks">Hooks</option><option value="Properties">Properties</option></select></div><script language=JavaScript><!--
HideAllBut([3, 4], 6);// --></script></div><!--Menu-->
<!--START_ND_TOOLTIPS-->
<div class=CToolTip id="tt1"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.angle = 0</td></tr></table></blockquote>angle of text, measured clockwise from x axis.</div></div><div class=CToolTip id="tt2"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.show = true</td></tr></table></blockquote>wether or not to show the tick (mark and label).</div></div><div class=CToolTip id="tt3"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.showLabel = true</td></tr></table></blockquote>wether or not to show the label.</div></div><div class=CToolTip id="tt4"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.label = ''</td></tr></table></blockquote>label for the axis.</div></div><div class=CToolTip id="tt5"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontFamily = '"Trebuchet MS", Arial, Helvetica, sans-serif'</td></tr></table></blockquote>CSS spec for the font-family css attribute. </div></div><div class=CToolTip id="tt6"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontSize = '11pt'</td></tr></table></blockquote>CSS spec for font size.</div></div><div class=CToolTip id="tt7"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontWeight = 'normal'</td></tr></table></blockquote></div></div><div class=CToolTip id="tt8"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.fontStretch = 1.0</td></tr></table></blockquote>Multiplier to condense or expand font width. </div></div><div class=CToolTip id="tt9"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.textColor = '#666666'</td></tr></table></blockquote>css spec for the color attribute.</div></div><div class=CToolTip id="tt10"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.enableFontSupport = true</td></tr></table></blockquote>true to turn on native canvas font support in Mozilla 3.5+ and Safari 4+. </div></div><div class=CToolTip id="tt11"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.pt2px = null</td></tr></table></blockquote>Point to pixel scaling factor, used for computing height of bounding box around a label. </div></div><!--END_ND_TOOLTIPS-->
<div id=MSearchResultsWindow><iframe src="" frameborder=0 name=MSearchResults id=MSearchResults></iframe><a href="javascript:searchPanel.CloseResultsWindow()" id=MSearchResultsWindowClose>Close</a></div>
<script language=JavaScript><!--
if (browserType) {if (browserVer) {document.write("</div>"); }document.write("</div>");}// --></script></body></html>