All notable changes to this project will be documented in this file. The format is based on Keep a Changelog and this project adheres to Semantic Versioning.
Switch to ES Modules from CommonJSLibraries should be in commonjs, for now...
- Switch from yarn to pnpm.
- Support for custom pixels per tick to configure how many ticks should be generated. Default is 40 px/tick as before.
-
Added support for multiple axises per side of the chart grid. The data points will always refer to the first axis of the indicated side. Migrating from old to new is simple, just change it to an array.
Old:
createChart({ ... xAxisBottom: myXAxis, ... })
New:
createChart({ ... xAxisesBottom: [myXAxis], ... })
-
Added
axisWidth
for customizing the width of the axises. -
Added support for data axises, a separately rendered axis type whose tick labels are a function values. Just supply some points defining the function These are rendered outside of the normal axises.
-
Padding is now additional space outside of the rendered elements, so the layout from left to right is now like this, the x-axises and paddings and heights are calculated in the same manner:
- Empty space defined by
padding.left
. - One data axis per
chartDataAxisesLeft
in reverse order, eachaxisWidth
wide. - One data axis per
yAxisesLeft
in reverse order, eachaxisWidth
wide. - Grid area filling up remaining space.
- One data axis per
yAxisesRight
in normal order, eachaxisWidth
wide. - One data axis per
chartDataAxisesRight
in normal order, eachaxisWidth
wide. - Empty space defined by
padding.right
.
- Empty space defined by
- Updated rendering of chart lines to be clipped within chart bounds
- Support for id on abstract chart axises
- Support for id parameter on chart objects to support abstract-image click functionality
- Text color and text outline color in charts
- Changed text growth direction from down/right to automatic for point and line labels to keep them inside the grid
- Chart padding
- Overridable font sizes for all texts.
- Discrete axises
- Rotate tick labels
- Disp tick labels
- Separate x-grid & y-grid
- Separate styling of all axises
- Previous chart padding was {top: 40, right: 80, bottom: 40, left: 80}. New default padding is depending on axises.
- { ... gridColor: AI.black; gridThickness: 1; ... } -> { ... xGrid: { color: AI.black; thickness: 1 }, yGrid: { color: AI.black; thickness: 1 }, yGrid: { color: AI.black; thickness: 1 }, xAxisBottom: {... axisColor: AI.black, thickness: 1 ...}, yAxisLeft: {... axisColor: AI.black, thickness: 1 ...} ... };
- { ... ... } - > { ... padding: {top: 40, right: 80, bottom: 40, left: 80} ... }
- React 16 -> 18
- Rambda
- Support for larger axis numbers
v3.2.1 - 2022-06-02
- Support for other font than Arial.
- Start of changelog.