Charting Components API
From OpenLaszlo
Please provide comments either inline here or on the discussion page. Note there are still a number of Open Issues described at the bottom.
Thanks!
Contents |
Overview
The charting components API contains three main base classes, chart, axis, and dataseries. For now, most of the rendering of individual chart components are exposed via overridable api calls. At some point, we may add more attributes and support easier-to-use, more powerful default rendering functionality thru classes/interfaces.
Classes
dataseries
A dataseries is an abstraction for accessing an array of items from a dataset. Each item represents a point to be rendered on the chart (a point may or may not be rendered as a point, if that makes sense). (possibly rename to series? or chartseries?)
A datacolumn describes a column for the given series.
Each row in the array represents a data item for the chart. In a rectangular chart, the columns are typically interpretted x, y, tip, for example. Dataseries may be declared inside other dataseries and inherit the columns of the parent series.
<class name="dataseries" extends="node" >
<attribute name="seriesdatapath" /
<attribute name="enabled" type="expression" /> (controls whether the data series is displayed or not
type is a boolean expression, default is true)
<attribute name="label" type="html" /> (should this be title? html type means: ?)
<attribute name="style" type="Object" /> (chartstyle object, chart will have a default style
rotates for each dataseries, e.g. shapes, colors)
<event name="ondata" />
</class>
dataseries.getNumItems() (getNumRows?)
dataseries.getNumColumns()
dataseries.getItemValue(columnname, index) - returns the value representing the
column of the given item (should item becalled row?)
dataseries.getItem(index) - return LzDataNode representing the item from given column (getRow?)
dataseries.getMax(columnname)
dataseries.getMin(columnname)
<class name="datacolumn" extends="node">
<attribute name="columndatapath" />
</class>
A dataseries must need to listen to ondata events from the underlying dataset/document and pass ondata events out when the series changes.
Question: Is the nested dataseries syntax worth the complexity? I don't think it is.
Examples:
<dataseries label="My Data">
<datacolumn name="x" columndatapath="@x" />
<datacolumn name="y" columndatapath="@y" />
</dataseries>
<dataseries>
<datacolumn name="x" columndatapath="@x" />
<dataseries label="Y1" >
<datacolumn name="y1" columndatapath="@y1" />
</dataseries>
<dataseries label="Y2">
<datacolumn name="y2" columndatapath="@y2" />
</dataseries>
<dataseries label="Tip">
<datacolumn name="tip" columndatapath="@tip" />
</dataseries>
</dataseries>
You can override the processData() to generate custom values that
aren't in the original dataset. (For example, if the data includes x, but you want to
graph x^2.)
Labels on a dataseries are displayed in the legend.
axis
An axis represents one of the axes of a rectangular chart. In general, axis isn't instantiated directly. Bells and whistles to add later (more automatic control of labels, ticks).
An axis is responsible for rendering itself, an optional title, tick marks, and (tick) labels.
<class name="axis" extends="drawview">
<attribute name="title" type="html" /> (our docs so far call these labels).
<attribute name="labeldatapath=" />
<attribute name="intervaltype" type="string" /> (linear - number/date | categorical - text from a dataseries)
<attribute name="interval="null" />
<attribute name="maximum" default="null"/>
<attribute name="minimum" default="null"/>
<attribute name="columnname" type="string" /> (say 'x', or 'y' ).
<attribute name="position" />
(offset in orthogonal axis; in data coords or view coords?; probably data)
<attribute name="tickLength" />
<attribute name="minorTickDivision" /> (how many minor ticks between major ones)
<attribute name="tickPlacement" /> (inside,outside,on,none)
<attribute name="minorTickPlacement" /> (inside,outside,on,none)
<attribute name="showLine" type="boolean" />
<attribute name="showLabels" type="boolean" />
<attribute name="showTicks" type="String" /> (all, major, minor, none)
<attribute name="titleClass" /> (when non-null, used to construct a view that is the title)
<event name="onmouseout" />
<event name="onmouseover" />
<event name="onmouseup" />
<event name="onmousedown" />
axis.renderTitle()
axis.renderTick()
axis.renderLine()
axis.renderLabel()
axis.dataToViewCoord(data)
axis.viewCoordinateToData(coord)
axis.clear() - clears display of axis; (is this needed or will axis be cleared by plotarea?)
axis.render() -
grabs plot areas window for this column(dimension)
if min not specified, computes min from parent chart's dataseries
(for categorical series, use # categories)
if max not specified, computes max from parent chart's dataseries
(for categorical series, use # categories)
determines window of min/max to map to plotarea
also renders ticks, labels, title, and axis line.
axis.title view representing title
axis.ticks array of minor tick data values (or pixel values?)
axis.minorTicks - array of minor tick data values (or pixel values?)
horizontalaxis
A horizontalaxis is an axis that tracks the 'x' column of dataseries. It is used in rectangular charts for computing the mapping of data to view coordinates for the plotarea for the horizontal dimension.
<horizontalaxis extends="axis" columnname="x"/>
verticalaxis
A verticalaxis is an axis that tracks the 'y' column of dataseries. It is used in rectangular charts for computing the mapping of data to view coordinates for the plotarea for the vertical dimension.
<verticalaxis extends="axis" columnname="y"/>
chart
chart is the base class representing a chart. In general, this class is not instantiated directly. A chart contains
- at least one dataseries element
- at least one axis element
A chart subclass will contain a plotarea subclass as well.
The chart needs to look at its dataseries children and pass the relevant dataseries to each axis. Relevent dataseries for the chart must have columns for each of the axes that the chart cares about.
A chart contrains the position and size of its child/subviews (title, plotarea). Known subclasses include rectangularchart and piechart
A chart also supports rendering a tip for a given item.
<class name="chart" extends="drawview">
<attribute name="title" type="html" />
<attribute name="zoomEnabled" type="boolean" />
<attribute name="tipsEnabled" />
<attribute name="tipcolumnname" type="Object" />
<attribute name="style" type="Object" />
<attribute name="titleClass" type="Object" /> (when non-null, used to construct a view which
is the title)
<event name="onmouseout" />
<event name="onmouseover" />
<event name="onmouseup" />
<event name="onmousedown" />
</class>
chart.tipcolumnname - name of column picked out of enclosed series to be displayed as a tip
(default name is 'tip')
chart.plotArea - PlotArea
chart.titleView - Title area (view)
chart.render() - renders the chart
chart.clear() - clears the rendering of the chart
chart.renderTitle()
chart.renderLegend()
chart.renderPlotArea() - should be implemented by subclass
chart.renderItem() - used by legend to render an item for a given series
chart.getStyleForDataSeries() - return the style defined on the series or a style that
that chart defines; typically this method will rotate thru a
list of standard styles.
chart.dataSeries - array of dataseries for this chart (computed during init or construct?)
chart.axes - array of axes for the chart (computed during init or construct?)
The chart has a default layout that knows how to position the legend, plotarea, and title.
plotarea
plotarea is a view that represents the plot area of a chart. The plotarea keeps track of the currently visible window on to the chart. The initial window is the entire chart, but when the chart supports zooming, the window will be some smaller piece (offset and width in both dimensions) of the entire chart.
<class name="plotarea" extends="drawview"> <attribute name="resource" /> (resource (image) for the background of the plotarea) </class> Should their by a public subview/child for the grid?
plotarea.render() plotarea.clear() plotarea.renderBackground()
rectangularchart
A rectangular chart represents a chart that is displayed in the 2D cartesian plane.
This class is not intended to be instantiated directly. Known subclasses include linechart and barchart. It should include a one horizontalaxis and verticalaxis child each.
<class name="rectangularchart" extends="chart">
<attribute name="gridlinesEnabled" /> (none, horiz, vertical, all)
<attribute name="zoomHistory" type="Object" value="$once{[]}"/> private attribute that keep track of the
history of min & max to be undo later
<attribute name="minx" type="number"/>
<attribute name="maxx" type="number"/>
<attribute name="miny" type="number"/>
<attribute name="maxy" type="number"/>
<attribute name="defaultminx" type="number"/>
<attribute name="defaultmaxx" type="number"/>
<attribute name="defaultminy" type="number"/>
<attribute name="defaultmaxy" type="number"/>
<method name="render" args="newminx, newminy, newmaxx, newmaxy, duration, undoable"/> animate rendering over a duration
<method name="undo" args="duration"/> undo the previous render
<method name="calcDefaultMinMax"/> set the default min and max to show all data
<event name="onRenderStart"/> render start
<event name="onRenderStop"/> render stop
rectangulartchart.renderPlotArea() -
tell each axis the min, max of the columns from each dataseries that the axis cares about.
call render() on each axis.
call plotarea.render()
iterate over each dataseries
iterate over each item in the dataseries
render each item/point
rectangularchart.renderTitle()
rectangularchart.renderLegend()
</class>
This class will keep the zoom history and include the back/fwd apis for zooming. It also implements the mouse tracking for determining the area for an interactive zoom.
rectangularplotarea
rectangularplotarea is a plotarea that also maintains a grid.
<class name="rectangularplotarea" extends="plotarea"> <attribute name="horizontalGrid" type="boolean" value="true" /> <attribute name="verticalGrid" type="boolean" value="true" /> </class> Should their by a public subview/child for the grid?
rectangularplotarea.render() rectangularplotarea.clear() rectangularplotarea.renderGrid() - - uses the chart's axes to determine where and how to render grid.
piechart
A pie chart represents a chart that is displayed in the 2D polar plane. This class inherits immediatly from the chart class and can be instatiated directly.
<class name="piechart" extends="chart" /> <piechartplotarea name="plotarea" /> (The plot area where the pie slices are rendered)
piechart.render() - renders pie chart, plot area, legend and title piechart.renderPlotArea() - Renders the plot area which is an instance of the piechartplotarea class. The plot area requires to read a group of two data series, one for the groups that are represented by the pie slices and the second for their values
piechart.renderTitle() piechart.renderLegend() - TBD. Current implementation renders the legend when it is defined as an attribute of the chart (tag) Should it be kept as an aggregate object or rendered through this method?
piechart.renderDataLabels() - Renders the static labels that display the values of the data series
piechartplotarea
A pie chart plot area where the pie slices are rendered.
<class name="piechartplotarea" extends="drawview"> <attribute name="style" type="string" value="null"/> - Defines the pie slice's style
piechartplotarea.renderSeries(xseries,yseries,tooltipseries,strokeStyle) - Renders the pie slices </class>
legend
The legend displays the label and an example rendering for each of a chart's dataseries. Call's the chart's renderItem() method to render a given dataseries. The legend is instantiate outside of chart.
<class name="legend" extends="basecomponent" > <attribute name="chart" type="Object"/> pass in an instance of a chart <attribute name="legendborder" type="boolean" value="true"/> (show legend box with border) <attribute name="direction" type="string" value="vertical"/> (legend item direction) <attribute name="styleBorder" type="string" value="null"/> <attribute name="legendFont" type="string" value="default"/> <attribute name="legendFontsize" type="size" value="10"/> <attribute name="legendFontcolor" type="color" value="0x000000"/> <attribute name="position" type="string" value="right"/> (legend box position) <event name="onitemmouseout" args="item"/> <event name="onitemmouseover" args="item"/> <event name="onitemmouseup" args="item"/> <event name="onitemmousedown" args="item"/> </class>
zoomarea
The zoomarea provide the ability for a user to zoom in on the chart.
<class name="zoomarea" bgcolor="red" opacity="0.5" width="0" height="0">
<attribute name="chart" type="Object"/> chart instance
<attribute name="duration" type="number" value="0"/> length of animation in millisecond
<method name="zoom" args="minx, maxx, miny, maxy"/>
- convert the minx, maxx, miny, maxy to virtual(data) coordinate
- call the chart the render method
</class>
chartstyle
chartstyle holds the attributes that allow developers to customize the look of their charts. chartstyle contains a number of subnodes that define the styles for various parts of the chart. The chart component come with a default instance of chartstyle to get you started. If you need to to customize the look and feel of the chart, it is best to make a copy of the defaultchartstyle and modify the attribute you need to change. Below is an example of an custom instance of a chartstyle.
<chartstyle name="mychartstyle">
<plotstyle name="plot" linesize = "3" linecolor = "0x000000"
fillcolor = "0xffeeff" opacity = "1"/>
<valueregionstyle name="valueregionstyle">
<linestyle name="line" color="0x000000" size="1" opacity="1"/>
<regionstyle name="region" color="0xB71CB3" opacity="0.8" gradient="linear"/>
<labelstyle name="label" font="serif" fontsize="12" fontcolor="0x000000"/>
<labelstyle name="tip" font="serif" fontsize="12" fontcolor="0x000000"/>
</valueregionstyle>
<axisstyle name="haxisstyle">
<labelstyle name="label" font="myverity" fontsize="16"
fontcolor="0x000000" fontangle="90"/>
<tickstyle name="tickmajor" color="0x000000" position="outside" length="10" size="1">
<labelstyle name="label" font="serif" fontsize="10" fontcolor="0x000000"/>
</tickstyle>
<tickstyle name="tickminor" color="0x000000" position="outside" length="5" size="1"/>
<linestyle name="axisline" color="0x000000" size="2"/>
<linestyle name="gridline" color="0x000000" size="1"/>
</axisstyle>
<axisstyle name="vaxisstyle" >
<labelstyle name="label" font="myverity" fontsize="16"
fontcolor="0x000000" fontangle="90"/>
<tickstyle name="tickmajor" color="0x000000" position="outside" length="10" size="1">
<labelstyle name="label" font="serif" fontsize="10" fontcolor="0x000000"/>
</tickstyle>
<tickstyle name="tickminor" color="0x000000" position="outside" length="5" size="1"/>
<linestyle name="axisline" color="0x000000" size="2" />
<linestyle name="gridline" color="0x000000" size="1"/>
</axisstyle>
<datastylelist name="datastyles">
<datastyle>
<pointstyle name="point" width="10" height="10" color="0x00ff00"
opacity="1" shape="square"/>
<linestyle name="line" color="0x0000ff" size="3" opacity="1"/>
<regionstyle name="region" color="0xff0000" opacity="0.8" gradient="radial"/>
<labelstyle name="label" font="serif" fontsize="9"
fontcolor="0x000000" linecolor="0x000000"
fillcolor="0xFFFFC1" linesize="2" fontangle="90"/>
<labelstyle name="tip" font="serif" fontsize="8" fontcolor="0x000000"
linecolor="0x000000" fillcolor="0xFFFFC1" linesize="2"/>
</datastyle>
<datastyle>
<pointstyle name="point" width="8" height="8"
color="0x66B3FF" opacity="1" shape="square"/>
<linestyle name="line" color="0x000000" size="3" opacity="1" />
<regionstyle name="region" color="0x00FF00FF" opacity="0.8" />
<labelstyle name="label" font="serif" fontsize="9" fontcolor="0x000000"
linecolor="0x000000" fillcolor="0xFFFFC1" linesize="2" fontangle="45"/>
<labelstyle name="tip" font="serif" fontsize="10" fontcolor="0x000000"
linecolor="0x000000" fillcolor="0xFFFFC1" linesize="2"/>
</datastyle>
</datastylelist>
</chartstyle>
style classes
main style that pass in the chart class. contains a number of subnodes that define the styles for various parts of the chart
<class name="chartstyle" extends="basestyle" >
<attribute name="datastyleindex" value="0" type="number"/>
contains a set of style objects described below.
Any changes to these style nodes are reported by the charttyle object via
the 'onstylechanged' event. See basestyle.setStyleAttr() defined above
<attribute name="bgcolor" value="null" /> used for the background color of the chart. default is null
<method name="determinePlacement" args="" />
<method name="resetDataStyleCycle" />
returns the next datastyle object. This method cycles
through the children of the datastyles node shown above
<method name="getNextDataStyle" />
returns the specific datastyle object. This method cycles through the children of the datastyles node shown above
<method name="getDataStyle" args="index"/>
</class>
style for a point marker
<class name="pointstyle" extends="basestyle" >
<attribute name="width" /> width of bounding rect of the shape or resource
<attribute name="height" /> height and height of bounding rect of the shape or resource
<attribute name="color" /> RGB color
<attribute name="shape" type="string"/> 'circle','square','triangle', [name of resource]
<attribute name="opacity" /> value between 0-1
<attribute name="gradient" type="string" value="none" />'none', 'linear', 'radial'
<attribute name="image" type="string"/>
</class>
style for line and border
<class name="linestyle" extends="basestyle" >
<attribute name="size" value="1"/> pixel size for the stroke of the line
<attribute name="color" value="0x000000" /> RGB color on the axis line
<attribute name="opacity" /> value between 0-1
<attribute name="type" type="string" value="solid" /> 'solid', 'dotted'
</class>
style for fill such as in bar and column chart
<class name="regionstyle" extends="basestyle" >
<attribute name="color" /> RGB color on the axis line
<attribute name="opacity" type="number" value="0.5" /> value between 0-1
<attribute name="gradient" type="string" value="none" /> 'none', 'linear', 'radial'
<attribute name="image" type="string" value="${null}"/>
<attribute name="stretches" type="string" value="both"/>
</class>
style object used for anything that contains a label within the chart.
<class name="labelstyle" extends="basestyle" >
Style for bounding box of label
if both linecolor and fillcolor are null then there is no bounding box.
TBD: the height and width of the label (if it has a background ) is
determined by font metrics and the inset attribute.
later, we may need absolute width and height control
<attribute name="linesize" value="null" /> size of border of label background
<attribute name="linecolor" value="null"/> color of bounding box border
<attribute name="fillcolor" type="string" value="null"/> color of bounding box fill
<attribute name="opacity" /> opacity of bounding box
TBD: we may need more flexibility then the 'inset' attribute provides
<attribute name="inset" /> the number of pixels the font is inset from the border
Font info for label
<attribute name="font" type="string" /> font
<attribute name="fontsize" /> size of the font
<attribute name="fontcolor" /> color of the font
<attribute name="fontangle" type="number" /> angle of rotation of the font
</class>
tickstyle is used by the axis style to render major and minor ticks on a chart.
<class name="tickstyle" extends="linestyle" >
<attribute name="length" type="number" value="5" /> length of tick in pixels perpendicualr to the axis
<attribute name="position" type="string" value="inside"/> inside | outside | centered | none
<labelstyle name="label" /> an instance of labelstyle
</class>
valuelinestyle is used to set style to the
<class name="valuelinestyle" extends="basestyle" >
<linestyle name="line" /> instance of linestyle
<labelstyle name="label" /> an instance of labelstyle
<labelstyle name="tip" />
</class>
valuepointstyle is used to set style to the
<class name="valuepointstyle" extends="basestyle" >
<pointstyle name="pointstyle"/> an instance of pointstyle
<labelstyle name="label" /> an instance of labelstyle
<labelstyle name="tip" /> an instance of labelstyle
</class>
<class name="axisstyle" extends="basestyle" >
<attribute name="direction" value="y | x" type="string" />
<?STRUCTURE ...
<labelstyle name="label" /> instance of labelstyle to be used for axis label
<linestyle name="line" /> instance of linestyle
<linestyle name="gridline" /> to be used on the plot area to render the line associated with axis
<tickstyle name="tickmajor" /> instance of tickstyle for the major ticks
<tickstyle name="tickminor" /> instance of tickstyle for the major ticks
?>
this class may need methods upon implementation
</class>
<class name="plotstyle" extends="basestyle" >
<attribute name="linesize" /> size of border of the plot area
<attribute name="linecolor" /> color of the border for the plot area
<attribute name="fillcolor" /> bgcolor for the plot area
<attribute name="opacity" /> opacity of plot bacground area ( not the opacity of dataseries )
</class>
dataseriesstyle is used for drawing the appearance of a dataseries
<class name="datastyle" extends="basestyle" >
<?structure
<pointstyle name="point" /> instance of pointstyle
<linestyle name="line" /> instance of linestyle
<regionstyle name="region" /> instance of regionstyle for filling bar, pie, and area charts
<labelstyle name="label" /> instance of labelstyle to be used for label points on the chart
<labelstyle name="tip" /> instance of labelstyle to be used for data tips
?>
</class>
valueregionstyle is used for drawing the appearance of a value region
<class name="valueregionstyle" extends="basestyle" >
<linestyle name="line" /> instance of linestyle
<regionstyle name="region" /> instance of regionstyle for filling the rectangular region
<labelstyle name="label" /> instance of labelstyle to be used for label points on the chart
<labelstyle name="tip" /> instance of labelstyle to be used for data tips
</class>
Chart adornments
(unclear if these are for anything other than rectangularchart)
valuepoint
A valuepoint is a class that can be used to render an actual point on a chart.
<class name="valuepoint" extends="drawview" > <attribute name="datax" /> <attribute name="datay" /> <attribute name="style" /> <attribute name="tip" type="html" /> </class>
valueline
A valueline is a class that can be used to render an actual line on a chart.
<class name="valueline" extends="drawview" > <attribute name="data" /> <attribute name="axis" /> <attribute name="style" /> <attribute name="tip" type="html" /> </class>
valueregion
A valueregion is a class that can be used to render an actual region on a chart.
<class name="valueline" extends="drawview" > <attribute name="data1" /> <attribute name="data2" /> <attribute name="axis" /> <attribute name="style" /> <attribute name="tip" type="html" /> </class>
TBD: where/when is tip displayed
Example Charts
<dataset name="grades">
<entry year="1970" class="english" grade="a" hours-worked="66" />
<entry year="1971" class="english" grade="a-" hours-worked="70" />
<entry year="1972" class="english" grade="a" hours-worked="83" />
<entry year="1970" class="french" grade="a" hours-worked="80" />
<entry year="1971" class="french" grade="a-" hours-worked="84" />
<entry year="1972" class="french" grade="b+" hours-worked="77" />
<entry year="1970" class="math" grade="a+" hours-worked="82" />
<entry year="1971" class="math" grade="a-" hours-worked="84" />
<entry year="1972" class="math" grade="a" hours-worked="86" />
</dataset>
<barchart id="mychart" title="Stuff" >
<dataseries label="English"
seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
<datacolumn name="tip" columndatapath="@grade" />
</dataseries>
<dataseries label="French"
seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
</dataseries>
<horizontalAxis label="Year" />
<verticalAxis label="Hours" />
</barchart>
<legend chart="mychart" />
Same as barchart above, except it's a linechart.
<linechart id="mychart" title="Stuff" >
<dataseries label="English"
seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
<datacolumn name="tip" columndatapath="@grade" />
</dataseries>
<dataseries label="French"
seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
</dataseries>
<horizontalAxis label="Year" />
<verticalAxis label="Hours" />
</linechart>
Barchart with a categorical x axis
<barchart id="mychart">
<dataseries label="English"
seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
<datacolumn name="tip" columndatapath="@grade" />
</dataseries>
<dataseries label="French"
seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
</dataseries>
<horizontalAxis label="Course" labeldatapath="grades:/entry/@course"/>
<verticalAxis label="Hours" />
</barchart>
<bubblechart id="mychart">
<dataseries label="English" seriesdatapath="grades:/entry[@course='english']" >
<datacolumn name="x" columndatapath="@year" />
<datacolumn name="y" columndatapath="@hours-worked" />
<datacolumn name="luma" >
<method name="processData" params="v">
return convertGradeToNumericalValue(v)/100;
</method>
<method name="convertGradeToNumericalValue" params="g">
switch (g) {
case 'a+': return 100;
case 'a': return 95;
case 'a-': return 92;
case 'b+': return 87;
case 'b' : return 80;
default: debug.write('bad grade'); return 0;
}
</method>
</datacolumn>
</dataseries>
<horizontalAxis label="Year" />
<verticalAxis label="Hours" />
</bubblechart>
<legend chart="mychart" />
Open Issues
The design is still weak on:
- mouse events/hit testing
- charts should fire an event when out/over/down/up an item
- legends should fire an event when our/over/down/up an item
- more details on
- zoom --
Peter should be able to clear up these places in the spec given his implementation experience.
Other open issues
- render() methods should take boolean for render/rerender(clear)
Open issues for styles:
- line marker should be also a resource
- Shouldn't text rotation be added to baseclass <style> ?
- How does text rotation interact with alignment, x, y, width, height?
- Should we specify both
- theta
- offset (x, y)
- Fill styling
- gradient properties
- fillResource (should this be object or url/file path?)
There are a few places above where the doc is marked with TBD.
Resolved Issues
- chart components do not subclass basecomponent
- chart style attributes to <chartstyle> which extends <style>
- Line stroke styling
- join, cap, and style - omit these for now
- Fill styling
- pattern - omit for now
- grid is drawn by plotarea
- render() methods takes a boolean that says whether or not to clear first.
- ok to hardcode sensitivity for mouse events for now
- For now omit from style the following: (they aren't in the requirements)
- resource offset x, y
- resource xaxis: tile|stretch|crop
- resource yaxis: tile|stretch|crop
- For now omit from style the following: (they aren't in the requirements)
