Create an ojChart component using the type area binding with an ID. Provide different values for the groups and series with a default orientation of horizontal. The following is an example for an area chart:
- HTML:
<div id='chart-container'> <div id="areaChart" data-bind="ojComponent: { component: 'ojChart', type: 'area', series: areaSeriesValue, groups: areaGroupsValue, animationOnDisplay: 'auto', animationOnDataChange: 'auto', orientation: orientationValue, stack: stackValue, hoverBehavior: 'dim' }" style="max-width:500px;width:100%;height:350px;"> </div> <div id="myToolbar" aria-label="Chart Display Options Toolbar" aria-controls="areaChart" data-bind="ojComponent: {component:'ojToolbar'}" style="max-width:500px;width:100%;"> ...