ScatterChart

Overview #

Scatter charts are based on basic line charts with the x axis changed to a linear axis. To use a scatter chart, data must be passed as objects containing X and Y properties. The example below creates a scatter chart with 3 points.

Code:

ScatterChart::create(array(
    "title"=>"Age and number of phone owned",
    "dataSource"=>array(
        array("age"=>12,"#phone"=>2),
        array("age"=>18,"#phone"=>3),
        array("age"=>21,"#phone"=>5),
        array("age"=>21,"#phone"=>3),
    ),
    "series"=>array(
        array("age","#phone")
    )
));

Settings #

nametypedefaultdescription
namestringSet name for chart. It is optional
titlestringTitle of the chart
dataSourcemixedSet the data source for chart, accepting DataStore, DataSource, Process object and even array in table or associate format
seriesarrayList of series, each series is an array containing column name and settings
optionsarrayExtra options for line chart or area chart, please view options section for more details
backgroundOpacitynumber0.5Set the opacity for background
scalenumber1For BubbleChart only, this property set the scale for bubble to fit the size of chart. Please change this to make the point suitable for the size of your chart

Series property #

Property series contains list of columns for ScatterChart and BubbleChart. ScatterChart will requires 2 columns while BubbleChart requires 3 columns. The adding array at the end will contains settings for the series.

ScatterChart::create(array(
    "series"=>array("age","#phone",array(
        "label"=>"Age vs Phone",
    ))
));
BubbleChart::create(array(
    "series"=>array("age","#phone",array(
        "label"=>"Height, weight vs Phone",
    ))
));
nametypedefaultdescription
labelstringLabel of the series
backgroundColorstringBackground of the point
borderColorstringBorder of the point
borderWidthnumberSize of point's border
pointStylestringcircleStyle of points.Values: 'circle', 'cross', 'crossRot', 'dash', 'line', 'rect', 'rectRounded', 'rectRot', 'star', 'triangle'
radiusnumberSize of the point
hoverBackgroundColorstringBackground of point when hovered
hoverBorderColorstringBorder color of point when hovered
hoverBorderWidthnumberBorder width of the point when hovered
hoverRadiusnumberRadius of point when hovered
hitRadiusnumberAdditional radius for hit detection
scalenumberScale for the series