amcharts's public fiddles
-
Clustered Column Chart
No-Library (pure JS), HTML, CSS, JavaScript
-
Simple Pie Chart
Our pie chart uses intelligent way to arrange it's labels so that they would not overlap. You can try adding even more labels by pressing EDIT button and adding more items to the data provider - the labels will be arranged so that they wouldn't overlap. Of course, at some big number of labels they can start overlapping, but in most cases you don't have this number of slices in pie chart. <h2>Grouping of small slices</h2> Our pie chart can group small slices into the "Others" slice automatically. Try add <strong>groupPercent:5</strong> to the charts config - you will see that the smallest slices are grouped into one now. This will also help to avoid overlapping labels, if you have really a lot of them.
-
Support: #5967
No-Library (pure JS), HTML, CSS, JavaScript
-
Radar Chart with multiple graphs
No-Library (pure JS), HTML, CSS, JavaScript
-
Stock Chart: Selecting a pre-defined period via API
No-Library (pure JS), HTML, CSS, JavaScript
-
Multiple Data Sets (several datasets pre-selected)
No-Library (pure JS), HTML, CSS, JavaScript
-
Value axes labels outside
No-Library (pure JS), HTML, CSS, JavaScript
-
Map with AmLegend
No-Library (pure JS), HTML, CSS, JavaScript
-
Column chart with CSV data from textarea
No-Library (pure JS), HTML, CSS, JavaScript
-
Simple Column Chart
If you take a close look at this chart, you will notice that grid lines are above the columns - equally dividing them into segments. This is an optional feature, of course. It allows you creating the charts close to the ones described by famous data visualization guru, <a href="http://www.edwardtufte.com/">Edward Tufte</a>, in his book "The Visual Display of Quantitative Information". <h2>From columns to bars - one simple step</h2> Click EDIT button on top of the chart, and add this text to the source (anywhere within curly brackets): <strong>"rotate":true,</strong>. Run the script and... The columns should became bars, category axis should be vertical now and value axis - horizontal! This is the only property you change to make this trick. All our Serial charts can be rotated in the same way.
-
Simple Pie Chart
Our pie chart uses intelligent way to arrange it's labels so that they would not overlap. You can try adding even more labels by pressing EDIT button and adding more items to the data provider - the labels will be arranged so that they wouldn't overlap. Of course, at some big number of labels they can start overlapping, but in most cases you don't have this number of slices in pie chart. <h2>Grouping of small slices</h2> Our pie chart can group small slices into the "Others" slice automatically. Try add <strong>groupPercent:5</strong> to the charts config - you will see that the smallest slices are grouped into one now. This will also help to avoid overlapping labels, if you have really a lot of them.
-
Bubble Chart with different colors
No-Library (pure JS), HTML, CSS, JavaScript
-
Simple Column Chart
If you take a close look at this chart, you will notice that grid lines are above the columns - equally dividing them into segments. This is an optional feature, of course. It allows you creating the charts close to the ones described by famous data visualization guru, <a href="http://www.edwardtufte.com/">Edward Tufte</a>, in his book "The Visual Display of Quantitative Information". <h2>From columns to bars - one simple step</h2> Click EDIT button on top of the chart, and add this text to the source (anywhere within curly brackets): <strong>"rotate":true,</strong>. Run the script and... The columns should became bars, category axis should be vertical now and value axis - horizontal! This is the only property you change to make this trick. All our Serial charts can be rotated in the same way.
-
Auto-updating Stock Chart with dynamic indicators
No-Library (pure JS), HTML, CSS, JavaScript
-
Bands and bubbles on a serial chart
No-Library (pure JS), HTML, CSS, JavaScript
-
Pie chart with broken down slices
Click on any slice of a chart - it will split into several slices. You can have drill-down pie charts like this with our charts.
-
Concentric chart
No-Library (pure JS), HTML, CSS, JavaScript
-
Selecting multiple areas map
Click on several states on the map - each state will change it's color. Using this feature you can easily create fun and interactive applications.
-
Pie Chart With Legend
Pie chart can display titles and values of slices in the legend. Our legend has a great feature - if you click on legend entry, the slice will be hidden or shown. This might gives additional value for data analysis, as when hidden, slice is excluded when calculating percent values. The position of legend can be easily adjusted.
-
Multiple Data Sets
Stock chart is a great tool which will save your time. It is designed to work mostly with financial data, but can be used for other purposes as well. Our Stock chart supports multiple data sets and has a ready to use data set selector (at the left, although you can adjust position to your needs). Data sets might be compared one to another. You can compare absolute values or percent values, as this is quite an often practice when dealing with prices of securities or stocks. <h2>Data grouping into longer periods</h2> If you roll-over the chart so that chart cursor would appear, you will notice that each data point represents one day. This is quite expected, as we provided daily data for this chart. Now, zoom-out to "year" view by clicking on the 1 year button at the bottom and roll over the chart again – now, data points jump at 7 days (one week) interval. Again, zoom-out to the max so that all the data is visible. One data point represents one month now! Did we had to provide data for the different periods? No, the chart did all the grouping itself. We recommend reading <a href="/tutorials/understanding-data-grouping-of-stock-chart/">Understanding data grouping tutorial</a> to get more information about this great feature.