tutorial This supershort tutorial will show how to disable SankeyDiagram’s initial “fold-out” animation. Disabling animation If you have “animated” theme enabled, SankeyDiagram will fold out its nodes from left to right when it first loads. For that specific animation, it uses its interpolationDuration setting. So, to make the nodes appear instantly, all we have to do […]
demo This demo will show how you can place the labels below both ends of the GaugeChart’s axis.
demo Normally, an axis on a GaugeChart will place labels at convenient intervals – so they are not too crammed and not too sparse. It will depend on actual chart size. However, in some case you might want to place labels at exact values, no matter what. This demo will show how you can disable axis […]
demo This demo shows how we can use a custom function to defer chart instantiation and replace them with a thumbnail, which once clicked would be automatically replaced with a real chart.
tutorial Some dashboards require charts in them to be fully interactive. Some don’t. Sometimes we wish to churn out charts to the screen as as quick as possible, and with as little memory footprint as possible. This tutorial will walk through the process of generating static SVG for charts using a single chart template. Dynamic vs. […]
demo This demo shows how default colors of the links in NavigationBar on a TreeMap chart. chart.navigationBar = new am4charts.NavigationBar(); chart.navigationBar.links.template.fill = am4core.color(“#691E06”); chart.navigationBar.activeLink.fill = am4core.color(“#8F250C”); chart.navigationBar = new am4charts.NavigationBar(); chart.navigationBar.links.template.fill = am4core.color(“#691E06”); chart.navigationBar.activeLink.fill = am4core.color(“#8F250C”); { // … “navigationBar”: { “links”: { “fill”: “#691E06” }, “activeLink”: { “fill”: “#8F250C” } } }
demo Most of the elements on a chart – e.g. series or chart itself – have appear() method. Calling it will re-play whatever animation was played when the chart was first loaded, for example series morphing into place. This demo showcases this functionality.
demo In amCharts 4 each series can have its own data (set via own data property). Such data will not be exported using exporting functionality. This demo shows how we can use export’s data adapter to combine local data from multiple series in export.
demo This simple demo shows an XYChart where each series uses own CategoryAxis with completely different categories.
demo This demo shows how we can customize GaugeChart hand by pushing literally any element into it, e.g. Triangle to replace the tip an and SVG Image to replace pin.