Home/ Questions/Q 9268365
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T14:47:37+00:00

I’m using bar chart(amcharts) in my application and i need to include Legends for

  • 0

I’m using bar chart(amcharts) in my application and i need to include Legends for that bar charts. so, i added the following scripts for bar script, 

legend = new AmCharts.AmLegend();
legend.position = "bottom";
legend.align = "center";
legend.markerType = "square";
legend.valueText = "";
chartx.addLegend(legend);

but, the bar chart should show Legends? how do i add legends in my bar chart application.

can anyone give me the solution for this issue asap?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    try the above sample i have edited the sample provided by amchart 

        <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>amCharts examples</title>
        <link rel="stylesheet" href="style.css" type="text/css">
        <script src="../amcharts/amcharts.js" type="text/javascript"></script>
        <script type="text/javascript">
            var chart;

            var chartData = [{
                year: 2005,
                income: 23.5
            }, {
                year: 2006,
                income: 26.2
            }, {
                year: 2007,
                income: 30.1
            }, {
                year: 2008,
                income: 29.5
            }, {
                year: 2009,
                income: 24.6
            }];


            AmCharts.ready(function () {
                // SERIAL CHART
                chart = new AmCharts.AmSerialChart();
                chart.dataProvider = chartData;
                chart.categoryField = "year";
                // this single line makes the chart a bar chart,
                // try to set it to false - your bars will turn to columns
                chart.rotate = true;
                // the following two lines makes chart 3D
                chart.depth3D = 20;
                chart.angle = 30;

                // AXES
                // Category
                var categoryAxis = chart.categoryAxis;
                categoryAxis.gridPosition = "start";
                categoryAxis.axisColor = "#DADADA";
                categoryAxis.fillAlpha = 1;
                categoryAxis.gridAlpha = 0;
                categoryAxis.fillColor = "#FAFAFA";

                // value
                var valueAxis = new AmCharts.ValueAxis();
                valueAxis.axisColor = "#DADADA";
                valueAxis.title = "Income in millions, USD";
                valueAxis.gridAlpha = 0.1;
                chart.addValueAxis(valueAxis);

                // GRAPH
                var graph = new AmCharts.AmGraph();
                graph.title = "Income";
                graph.valueField = "income";
                graph.type = "column";
                graph.balloonText = "Income in [[category]]:[[value]]";
                graph.lineAlpha = 0;
                graph.fillColors = "#bf1c25";
                graph.fillAlphas = 1;
                graph.lineThickness = 2;
                graph.bullet = "round";
                chart.addGraph(graph);


                                // LEGEND
                               var legend = new AmCharts.AmLegend();
                                legend = new AmCharts.AmLegend();
                                legend.position = "bottom";
                                legend.align = "center";
                                legend.markerType = "square";
                                legend.valueText = "aa";
                chart.addLegend(legend);






                // WRITE
                chart.write("chartdiv");
            });
        </script>
    </head>

    <body>
        <div id="chartdiv" style="width: 500px; height: 600px;"></div>
    </body>

</html>
    • 0