tutorial In order for the pie to take the whole width/height of the container you will need to: 1) Disable callouts / labels; 2) Set all margins to zero; 3) Disable slice pullout functionality. Like this: chart.labelsEnabled = false; chart.autoMargins = false; chart.marginTop = 0; chart.marginBottom = 0; chart.marginLeft = 0; chart.marginRight = 0; chart.pullOutRadius = […]
tutorial Normally JavaScript Stock Chart does not support automatically-calculated “moving average” graphs or other indicators. However, it’s quite easy to add such functionality yourself. Here’s a code for “moving average”: (it should be included after amstoock.js) // MOVING AVERAGE PLUGIN FOR JAVASCRIPT STOCK CHARTS FROM AMCHARTS // AmCharts.averageGraphs = 0; AmCharts.addMovingAverage = function (dataSet, panel, field) […]
tutorial Although you can format value axis labels like duration, add unit to the left or right of the value, you might need something more – for example, to replace numeric values of value axis with some strings or add some text to category axis labels. ValueAxis has labelFunction property for that. If you set some function […]
tutorial Month/weekday names can be set on all charts using the following properties of AmCharts class: monthNames, shortMonthNames, dayNames and shortDayNames. So, to translate month names to German, you should set: AmCharts.monthNames = [ ‘Januar’, ‘Februar’, ‘März’, ‘April’, ‘Mai’, ‘Juni’, ‘Juli’, ‘August’, ‘September’, ‘Oktober’, ‘November’, ‘Dezember’];
tutorial To hide the chart cursor in JavaScript Stock Chart just simply set enabled to false in ChartCursorSettings: chart.chartCursorSettings.enabled = false; To hide the scrollbar in JavaScript Stock Chart just simply set enabled to false in ChartScrollbarSettings: chart.chartScrollbarSettings.enabled = false;
tutorial If your web page is using the <base href> header make sure you include the following line before initializing the chart/map: AmCharts.baseHref = true; It will ensure the common SVG problems related to base href are avoided.
tutorial Some time ago, in order to have multi-segmented line chart (the one where line color or fill color changes at some point) you had to add several different graphs and this wasn’t very straight forward task. However since v3 we added lineColorField, fillColorsField and dashLengthField properties to AmGraph and now you can do it very […]
tutorial All our charts which have valueAxis can have multiple instances of this axis. This means you can have any number of value axes on XY chart and even radar chart can have several value axes. You just need to create additional ValueAxis (use position=”right” if you want to place it on the right), then assign some […]
tutorial Let’s implement a very basic drill-down scenario for the column charts. First of all, let’s set up the data: var chartData = [ { country: “USA”, visits: 4025 }, { country: “China”, visits: 1882 }, { country: “Japan”, visits: 1809}, { country: “Germany”, visits: 1322} ]; Now let’s add a second-level of the data to […]
tutorial Sometimes you find yourself in a situation where you need one chart to display several sets of data. You also need your user to be able to switch them dynamically, without reloading the page. However, the charts do not support this functionality out of the box. Fortunately it’s very easy to implement using some custom […]