AmCharts — графики, связанные начальной и конечной точками

У меня есть несколько графиков на график, и по какой-то неизвестной (мне) причине каждый график связан начальной и конечной точками, например. введите здесь описание изображенияПростой вопрос: как его удалить? Я не мог найти ничего в документации, которая его контролирует.

Мой код выглядит следующим образом:

lineChart = function(id, period) {
    var chart, data = [];
    var cData = chartData[id];
    AmCharts.ready(function() {
        for (item in cData) {
            var i = cData[item];
            data.push({
                date: new Date(i.date),
                impressions: i.impressions,
                clicks: i.clicks,
                conversions: i.conversions,
                ctr: i.ctr,
                profit: i.profit,
                cost: i.cost,
                revenue: i.revenue
            });
        }

        chart = new AmCharts.AmSerialChart();
        chart.dataProvider = data;
        chart.categoryField = "date";
        chart.balloon.color = "#000000";

        // AXES
        // category
        var categoryAxis = chart.categoryAxis;
        categoryAxis.fillAlpha = 1;
        categoryAxis.fillColor = "#FAFAFA";
        categoryAxis.gridAlpha = 0;
        categoryAxis.axisAlpha = 0;
        categoryAxis.minPeriod = period;
        categoryAxis.parseDates = true;
        categoryAxis.gridPosition = "start";
        categoryAxis.position = "bottom";

        // value
        var valueAxis = new AmCharts.ValueAxis();
        valueAxis.dashLength = 5;
        valueAxis.axisAlpha = 0;
        valueAxis.integersOnly = true;
        valueAxis.gridCount = 10;
        chart.addValueAxis(valueAxis);

        // GRAPHS
        // Impressions graph                                            
        var graph = new AmCharts.AmGraph();
        graph.title = "Impressions";
        graph.valueField = "impressions";
        graph.balloonText = "[[title]]: [[value]]";
        //graph.lineAlpha = 1;
        graph.bullet = "round";
        chart.addGraph(graph);

        // Clicks graph
        var graph = new AmCharts.AmGraph();
        graph.title = "Clicks";
        graph.valueField = "clicks";
        graph.balloonText = "[[title]]: [[value]]";
        graph.bullet = "round";
        chart.addGraph(graph);

        // Conversions graph
        var graph = new AmCharts.AmGraph();
        graph.title = "Conversion";
        graph.valueField = "conversions";
        graph.balloonText = "[[title]]: [[value]]";
        graph.bullet = "round";
        chart.addGraph(graph);

        // LEGEND
        var legend = new AmCharts.AmLegend();
        legend.markerType = "circle";
        chart.addLegend(legend);

        var chartCursor = new AmCharts.ChartCursor();
        chartCursor.cursorPosition = "mouse";
        if(period == 'hh')
            chartCursor.categoryBalloonDateFormat = "MMM DD, JJ:00";
        chart.addChartCursor(chartCursor);
        // WRITE
        chart.write(id);
    });
};

person Ignas    schedule 30.05.2013    source источник


Ответы (2)


Это похоже на проблему с данными. Убедитесь, что ваши точки данных расположены строго в последовательном возрастающем порядке.

Чтобы проверить, как выглядят ваши фактические данные, добавьте в свой код вторую строку ниже. Затем запустите диаграмму в Google Chrome с открытой консолью (F12, затем выберите вкладку «Консоль»).

chart.dataProvider = data;
console.debug(data);

Проверьте точки данных на наличие нарушений. Особенно последние два.

person martynasma    schedule 30.05.2013

Проблема заключалась в том, что каждая диаграмма отображалась в рамках собственного метода AmCharts.ready. В документации указано, что это разрешено, однако у меня это не сработало, поэтому я завернул весь рендеринг в один метод ready, и проблема была исправлена.

person Ignas    schedule 19.06.2013