<columnchart>
The columnchart component allows for the creation of a column chart using series data.
![[Warning]](images/warning.png) |
Warning |
|---|---|
| This component is of Beta quality and is subject to change. |
The following is a columnchart that uses series data.
Example 58. Simple columnchart
<canvas height="900" width="600">
<include href="charts/styles/chartstyle.lzx"/>
<dataset name="baseball" src="resources/simple-redsox-data.xml"/>
<simplelayout axis="y"/>
<!-- Chart Title -->
<view name="title" y="10">
<text font="serif" fontsize="15" fontstyle="bold" fgcolor="0x0000FF">
Column Chart.</text>
</view>
<!-- Column Chart -->
<columnchart id="chart1" width="500" height="500" datatipEnabled="false" datatipColumn="tooltip" style="defaultchartstyle01" datalabelEnabled="true" datalabelColumn="label">
<dataseries datapath="baseball:/records">
<datacolumn name="x" columndatapath="record/@year" datatype="number"/>
<datacolumn name="label" columndatapath="record/@year"/>
<dataseries label="wins">
<datacolumn name="y" columndatapath="record/@wins" datatype="number"/>
<datacolumn name="tooltip" columndatapath="record">
<method name="processData" args="v">
return "year: " + v.attributes.year + " wins: " +
v.attributes.wins;
</method>
</datacolumn>
</dataseries>
</dataseries>
<columnchartplotarea name="plotarea" clip="true"/>
<horizontalaxis name="haxis" title="Years" type="categorical" columnName="x" minimum="1" maximum="5" titleLocation="low" axisEnabled="false">
</horizontalaxis>
<verticalaxis name="vaxis" title="Values" type="linear" columnName="y" minimum="60" maximum="120" titleLocation="low">
</verticalaxis>
</columnchart>
<legend name="legendbox" legendFontsize="14" legendborder="true" chart="${chart1}" x="${chart1.x + chart1.width}" y="${(chart1.y + chart1.height)/2}" options="ignorelayout" fillColor="0x339933" borderWidth="3">
<handler name="onitemmouseclick" args="item">
var topseries = this.chart.getDataSeries();
topseries.getDataSeries(item.identifier).enabled = item.linevisible;
this.chart.renderPlotArea();
item.linevisible = !item.linevisible;
</handler>
</legend>
</canvas>
A chart class that renders vertical bars. Inherits from the chart class. (Warning: Of beta quality.)
Attributes inherited from <rectangularchart>
defaultmaxx, defaultmaxy, defaultminx, defaultminy, horizontalGridBands, horizontalGridLines, maxx, maxy, minx, miny, verticalGridLines
Attributes inherited from <chart>
bottomMargin, databorderEnabled, datalabelColumn, datalabelEnabled, dataPointsEnabled, datatipColumn, datatipEnabled, defaultRightMargin, defaultstyle, horizontalGap, initdone, leftMargin, rightMargin, topMargin, valuelinesenabled, valuepointsenabled, valueregionsenabled, verticalGap, zoomEnabled
Attributes inherited from <basecomponent>
doesenter, enabled, hasdefault, isdefault, style, styleable, text
Attributes inherited from <view>
aaactive, aadescription, aaname, aasilent, aatabindex, align, bgcolor, cachebitmap, clickable, clickregion, clip, contextmenu, cursor, fgcolor, focusable, focustrap, font, fontsize, fontstyle, frame, framesloadratio, hassetheight, hassetwidth, height, layout, loadratio, mask, opacity, pixellock, playing, proxyurl, resource, resourceheight, resourcewidth, rotation, showhandcursor, source, stretches, subviews, totalframes, unstretchedheight, unstretchedwidth, valign, visibility, visible, width, x, xoffset, y, yoffset
Attributes inherited from <node>
classroot, cloneManager, datapath, defaultplacement, id, ignoreplacement, immediateparent, inited, initstage, name, nodeLevel, options, parent, placement, subnodes
Methods
-
changeBound() -
columnchart.changeBound(newminx : Number, newminy : Number, newmaxx : Number, newmaxy : Number, animated : Number, undoable : Number);
Parameter Name Type Description newminx Number the new min x of the boundary newminy Number the new min y of the boundary newmaxx Number the new max x of the boundary newmaxy Number the new max y of the boundary animated Number the animation duration in milliseconds. 0 for no animation undoable Number deterimine if the action can be undo
Methods inherited from <rectangularchart>
changeBound, customizeMinMax, render, renderHorizontalGridBands, renderHorizontalGridlines, renderRect, renderValuePoint, renderVerticalGridlines, undo
Methods inherited from <chart>
adjustPlotAreaToLayout, getDataSeries, getNodeOfClass, getNodesOfClass, render, renderPlotArea
Methods inherited from <basecomponent>
acceptValue, doEnterDown, doEnterUp, doSpaceDown, doSpaceUp, presentValue, setStyle, setTint, updateDefault
Methods inherited from <view>
bringToFront, containsPt, getAttributeRelative, getBounds, getColor, getColorTransform, getContextMenu, getCurrentTime, getDepthList, getID3, getMouse, getNextSelection, getPan, getPrevSelection, getProxyURL, getTotalTime, getVolume, init, measureHeight, measureWidth, play, proxyurl, releaseLayouts, searchSubviews, seek, sendAAEvent, sendBehind, sendInFrontOf, sendToBack, setAAActive, setAADescription, setAAName, setAASilent, setAATabIndex, setAccessible, setAlign, setAttributeRelative, setBGColor, setClickable, setColor, setColorTransform, setContextMenu, setCursor, setHeight, setLayout, setOpacity, setPan, setPlay, setProxyPolicy, setProxyURL, setResource, setResourceNumber, setRotation, setShowHandCursor, setSource, setValign, setVisibility, setVisible, setVolume, setWidth, setX, setXOffset, setY, setYOffset, shouldYieldFocus, stop, stretchResource, unload, updateResourceSize
Methods inherited from <node>
animate, applyConstraint, applyConstraintMethod, applyData, childOf, completeInstantiation, construct, createChildren, dataBindAttribute, destroy, determinePlacement, getAttribute, getOption, getUID, init, lookupSourceLocator, releaseConstraint, releaseConstraintMethod, searchImmediateSubnodes, searchSubnodes, setData, setDatapath, setOption, setSelected, updateData
Events
Events inherited from <view>
onaddsubview, onblur, onclick, ondblclick, onerror, onfocus, onframe, onframesloadratio, onheight, onkeydown, onkeyup, onlastframe, onload, onloadratio, onmousedown, onmousedragin, onmousedragout, onmouseout, onmouseover, onmouseup, onmouseupoutside, onopacity, onplay, onremovesubview, onstop, ontimeout, onvisible, onwidth, onx, ony