tutorial This combined tutorial examines at possible positioning of axis elements like grid, labels, and ticks as well as series data items in an XY chart scenario with a date axis and date-based data. Intro Location of axis elements (grid, labels, ticks) is determined by location and multiLocation settings. For a simplified explanation about those, visit […]
demo This demo shows how we can use additional hidden Y axes and column series, to add floating columns that span multiple categories on a Gantt chart.
demo This demo shows how we can add draggable buttons to each edge of an axis range.
tutorial Labels of an axis range are shown on the axis itself by default. This demo shows how we can put them on the opposite side of the plot area, or within it. Labels on opposite side To achieve the required result, we’ll need these steps: The code: The demo: Labels inside plot area We can […]
demo This demo shows how we can add an additional date axis on top of the chart to show a tooltip with sum of values of all series. The tooltip uses an adapter to dynamically calculate its content.
demo This demo shows how we can use an adapter and oversizeBehavior on labels of a category axis, to make the auto-wrap automatically. The code Here’s the relevant code section: Example Related info Category axis docs Handling oversized labels Using adapters
tutorial This tutorial will explain how we can place an automatically-calculated total on a stack of columns. Preparing value axis Normally, the chart would not calculate totals, saving CPU for us. We need to enable it by setting calculateTotals: true on our value axis: Adding a label bullet To place labels on or in a column, […]
demo This demo shows how we can use events and “ghost labels” to sync width of vertical axes across multiple charts.
demo This demo shows how we can dynamically modify labels of the CategoryAxis using an adapter. We need to add an adapter on an axis label template, which is accessible via axis’ renderer: In this particular example, actual category name is being replaced with a different value extracted from data.
demo This demo shows how we can use XYCursor event “cursormoved” to automatically apply hover state to each bullet in the same category.