ES6 Modules

[bestickley]

Hi, thank you this excellent library. I'd like to request ES6 modules so improve bundle size. You can see here (scroll down) there are no ES6 module exports. Thank you!

[Pauan]

@bestickley amCharts 5 is completely 100% ES6 modules, and most of our dependencies use ES6 modules as well.

It seems that tool isn't doing a good job of detecting our code, we'll look into it.

[Pauan]

We made some changes which should help BundlePhobia to detect our ES6 modules. The changes will be in the next release.

[bestickley]

@Pauan, I apologize for misunderstanding. Glad to hear that. Let me ask a follow up question: why in the examples are default imports used instead of named imports? Default import: import am5 from "@amcharts/amcharts5"; Named import: import { Root } from "@amcharts/amcharts5"; My understanding (could be wrong) is that named imports allow tree-shaking of the unused exports from "@amcharts/amcharts5" but a default import will import all modules exported from "@amcharts/amcharts5" regardless of if they're used. I use named imports for the charts I'm building but I would think it would be helpful for future users to have named imports in the examples.

Also, when looking inside my node_modules at amcharts5 I noticed an examples folder, is that supposed to be installed? I would think not.

[martynasma]

Fixed in 5.1.5.

[5.1.5] - 2022-02-22

Added

• minSize setting added to Flow (Chord and Sankey) series. It's a relative value to the sum of all values in the series. If set, this relative value will be used for small-value nodes when calculating their size. For example, if it's set to 0.01, small nodes will be sized like their value is 1% of the total sum of all values in series.

Changed

• Direction of vertical panning with mouse wheel in an XYChart was inverted to make it consistent with OS native scrolling direction.

Fixed

• Fixing ES6 module detection by BundlePhobia (Issue 294).
• Parsing of dates using "i" format was not working properly when no milliseconds were supplied.
• Using minZoomCount and maxZoomCount on a GaplessDateAxis was not working properly.
• Sometimes vertical XYChart scrollbar was not reacting to chart's pan via mouse drag or wheel.
• Using mouse wheel on a chart that was setup to pan was also zooming in/out in addition to pan.
• In some cases grid on GaplessDateAxis was not being placed properly. Grid and Label placement improved.
• ForceDirectedTree could freeze when used with Animated theme in some cases.
• Changing of baseInterval on DateAxis was not properly working in some cases.
• In some cases, when no animated theme was used, a state on a Sprite was not applied.
• Setting data on MapSeries after geoJSON was updated was not working properly which resulted heat rules not to be applied.
• It was difficult to make a selection close to the start/end of plot area on RadarChart.
• When XYChart was fully zoomed in, using mouse wheel would start panning the chart instead of zoom.

Full change log.

Download options.

Make sure you clear your browser cache after upgrading. And feel free to contact us again if you are still experiencing this issue.

[coderbyheart]

That change breaks bundling the library with Vite.js:

[vite:resolve] Missing "./xy" export in "@amcharts/amcharts5" package
error during build:
Error: Missing "./xy" export in "@amcharts/amcharts5" package

import * as am5xy from '@amcharts/amcharts5/xy'

Works fine with 5.1.4

[nseb]

Same problem

[martynasma]

We're reverting and reopening this, as the fix was causing other issues. Will need to revisit.

[Pauan]

@bestickley My understanding (could be wrong) is that named imports allow tree-shaking of the unused exports from "@amcharts/amcharts5" but a default import will import all modules exported from "@amcharts/amcharts5" regardless of if they're used.

If you use import * as am5 from "@amcharts/amcharts5"; then Webpack is smart enough to tree shake it.

Of course you can use named imports if you're more comfortable with it, but it shouldn't affect the tree shaking. You can verify this yourself by compiling your code with and without named imports and checking the size.

[bestickley]

Got it, thanks for clarifying @Pauan. I use Vite, but tree-shaking principles should still apply. Feel free to close!

[Pauan]

@bestickley Rollup is also smart enough to do tree shaking when importing the entire module. Internally Vite uses Rollup, so it should be okay.

In our next release we fixed the issue with BundlePhobia (hopefully properly this time).

[bestickley]

Got it. Thank you for explaining @Pauan and excellent library!

[martynasma]

Fixed in 5.1.8.

[5.1.8] - 2022-03-10

Added

• Settings pinchZoomX and pinchZoomY (defaults: false) added to XYChart. If set to true will allow pinch-zooming of a chart on touch devices. NOTE: these settings are not supported on RadarChart.
• topPlotContainer added to XYChart. It's a Container that can be used to place element over plot area.

Changed

• The types for adapters has been changed to be more intuitive and useful. (Issue 312)
• Tapping an element on a touch device will now generate pointerover event in addition to click. When tapped somewhere else, pointerout event will be triggered.

Fixed

• Fixing ES6 module detection by BundlePhobia again (Issue 294).
• Pinch-zooming of a MapChart was not working well in some cases.
• maxHeight setting in Sprite was not working.
• Change of minWidth was not being applied at once, only if some other changes triggered chart to be redrawn.
• Changing or not setting data on an existing FlowChart was resulting in a JS error.
• maxPanOut setting in MapChart was not working.

Full change log.

Download options.

Make sure you clear your browser cache after upgrading. And feel free to contact us again if you are still experiencing this issue.