jqplot-blockRenderer-js.html
16.9 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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html><head><title>$.jqplot.BlockRenderer</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.BlockRenderer"></a>$.jqplot.<wbr>BlockRenderer</div><div class=CBody><p>Plugin renderer to draw a x-y block chart. A Block chart has data points displayed as colored squares with a text label inside. Data must be supplied in the form:</p><blockquote><pre>[[x1, y1, "label 1", {css}], [x2, y2, "label 2", {css}], ...]</pre></blockquote><p>The label and css object are optional. If the label is ommitted, the box will collapse unless a css height and/or width is specified.</p><p>The css object is an object specifying css properties such as:</p><blockquote><pre>{background:'#4f98a5', border:'3px solid gray', padding:'1px'}</pre></blockquote><p>Note that css properties specified with the data point override defaults specified with the series.</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.BlockRenderer" >$.jqplot.<wbr>BlockRenderer</a></td><td class=SDescription>Plugin renderer to draw a x-y block chart. </td></tr><tr class="SGroup SIndent1"><td class=SEntry><a href="#$.jqplot.BlockRenderer.Properties" >Properties</a></td><td class=SDescription></td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.BlockRenderer.css" id=link1 onMouseOver="ShowTip(event, 'tt1', 'link1')" onMouseOut="HideTip('tt1')">css</a></td><td class=SDescription>default css styles that will be applied to all data blocks. </td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.BlockRenderer.escapeHtml" id=link2 onMouseOver="ShowTip(event, 'tt2', 'link2')" onMouseOut="HideTip('tt2')">escapeHtml</a></td><td class=SDescription>true to escape html in the box label.</td></tr><tr class="SProperty SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.BlockRenderer.insertBreaks" id=link3 onMouseOver="ShowTip(event, 'tt3', 'link3')" onMouseOut="HideTip('tt3')">insertBreaks</a></td><td class=SDescription>true to turn spaces in data block label into html breaks <br />.</td></tr><tr class="SProperty SIndent2"><td class=SEntry><a href="#$.jqplot.BlockRenderer.varyBlockColors" id=link4 onMouseOver="ShowTip(event, 'tt4', 'link4')" onMouseOut="HideTip('tt4')">varyBlockColors</a></td><td class=SDescription>true to vary the color of each block in this series according to the seriesColors array. </td></tr><tr class="SGroup SIndent1"><td class=SEntry><a href="#$.jqplot.BlockRenderer.Methods" >Methods</a></td><td class=SDescription></td></tr><tr class="SFunction SIndent2 SMarked"><td class=SEntry><a href="#$.jqplot.BlockRenderer.moveBlock" id=link5 onMouseOver="ShowTip(event, 'tt5', 'link5')" onMouseOut="HideTip('tt5')">moveBlock</a></td><td class=SDescription>Moves an individual block. </td></tr></table></div></div><!--END_ND_SUMMARY--></div></div></div>
<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.Properties"></a>Properties</h3></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.css"></a>css</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.css = {padding:'2px', border:'1px solid #999', textAlign:'center'}</td></tr></table></blockquote><p>default css styles that will be applied to all data blocks. these values will be overridden by css styles supplied with the individulal data points.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.escapeHtml"></a>escapeHtml</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.escapeHtml = false</td></tr></table></blockquote><p>true to escape html in the box label.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.insertBreaks"></a>insertBreaks</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.insertBreaks = true</td></tr></table></blockquote><p>true to turn spaces in data block label into html breaks <br />.</p></div></div></div>
<div class="CProperty"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.varyBlockColors"></a>varyBlockColors</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.varyBlockColors = false</td></tr></table></blockquote><p>true to vary the color of each block in this series according to the seriesColors array. False to set each block to the color specified on this series. This has no effect if a css background color option is specified in the renderer css options.</p></div></div></div>
<div class="CGroup"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.Methods"></a>Methods</h3></div></div>
<div class="CFunction"><div class=CTopic><h3 class=CTitle><a name="$.jqplot.BlockRenderer.moveBlock"></a>moveBlock</h3><div class=CBody><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>this.moveBlock = function (</td><td class=PParameter nowrap>idx,</td></tr><tr><td></td><td class=PParameter nowrap>x,</td></tr><tr><td></td><td class=PParameter nowrap>y,</td></tr><tr><td></td><td class=PParameter nowrap>duration</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote><p>Moves an individual block. More efficient than redrawing the whole series by calling plot.drawSeries(). Properties: idx - the 0 based index of the block or point in this series. x - the x coordinate in data units (value on x axis) to move the block to. y - the y coordinate in data units (value on the y axis) to move the block to. duration - optional parameter to create an animated movement. Can be a number (higher is slower animation) or ‘fast’, ‘normal’ or ‘slow’. If not provided, the element is moved without any animation.</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 id=MSelected>jqplot.<wbr>BlockRenderer</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><a href="jqplot-canvasAxisLabelRenderer-js.html">jqplot.<wbr>CanvasAxisLabelRenderer</a></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.css = {padding:'2px', border:'1px solid #999', textAlign:'center'}</td></tr></table></blockquote>default css styles that will be applied to all data blocks. </div></div><div class=CToolTip id="tt2"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.escapeHtml = false</td></tr></table></blockquote>true to escape html in the box label.</div></div><div class=CToolTip id="tt3"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.insertBreaks = true</td></tr></table></blockquote>true to turn spaces in data block label into html breaks br /.</div></div><div class=CToolTip id="tt4"><div class=CProperty><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td>this.varyBlockColors = false</td></tr></table></blockquote>true to vary the color of each block in this series according to the seriesColors array. </div></div><div class=CToolTip id="tt5"><div class=CFunction><blockquote><table border=0 cellspacing=0 cellpadding=0 class=Prototype><tr><td><table border=0 cellspacing=0 cellpadding=0><tr><td class=PBeforeParameters nowrap>this.moveBlock = function (</td><td class=PParameter nowrap>idx,</td></tr><tr><td></td><td class=PParameter nowrap>x,</td></tr><tr><td></td><td class=PParameter nowrap>y,</td></tr><tr><td></td><td class=PParameter nowrap>duration</td><td class=PAfterParameters nowrap>)</td></tr></table></td></tr></table></blockquote>Moves an individual block. </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>