• Resolved Le Taulier

    (@le-taulier)


    Hi,

    I try to use this chart : Line with different negative color

    But I have no clue how to input a very simple couple of data like :

    October 23, 2013
    usd 250

    December 23, 2013
    usd 300

    I did try to add this to the Javascript code but nothing works.

    “dataProvider”: [{
    “date”: “2013-10-23”,
    “value”: 250
    }, {
    “date”: “2012-12-23”,
    “value”: 300
    }],

    In fact most of the charts I found on the website of AmCharts use the parameter “Math.random” and it is very difficult for a beginner like me to know how to replace them.

    Thanks

    https://www.ads-software.com/plugins/amcharts-charts-and-maps/

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author martynasma

    (@martynasma)

    The data you posted looks OK.

    If the chart is not showing up it must be something else.

    Can you post your whole chart code?

    Thread Starter Le Taulier

    (@le-taulier)

    The code I did add are in strong characters:

    var chartData = generatechartData();

    function generatechartData() {
    var chartData = [];
    var firstDate = new Date();
    firstDate.setDate(firstDate.getDate() – 150);

    for (var i = 0; i < 150; i++) {
    // we create date objects here. In your data, you can have date strings
    // and then set format of your dates using chart.dataDateFormat property,
    // however when possible, use date objects, as this will speed up chart rendering.
    var newDate = new Date(firstDate);
    newDate.setDate(newDate.getDate() + i);

    var visits = Math.round(Math.random() * 100 – 50);

    chartData.push({
    date: newDate,
    visits: visits
    });
    }
    return chartData;
    }

    var chart = AmCharts.makeChart(“chartdiv”, {
    “theme”: “none”,
    “type”: “serial”,
    “autoMargins”: false,
    “marginLeft”:8,
    “marginRight”:8,
    “marginTop”:10,
    “marginBottom”:26,
    “pathToImages”: “https://www.amcharts.com/lib/3/images/&#8221;,
    “dataProvider”: chartData,
    “valueAxes”: [{
    “axisAlpha”: 0,
    “inside”: true
    }],
    “graphs”: [{
    “balloonText”: “category<b>value: value</b>”,
    “bullet”: “round”,
    “bulletBorderAlpha”: 1,
    “bulletBorderColor”: “#FFFFFF”,
    “hideBulletsCount”: 50,
    “lineThickness”: 2,
    “lineColor”: “#fdd400”,
    “negativeLineColor”: “#67b7dc”,
    “valueField”: “visits”
    }],
    “dataProvider”: [{
    “date”: “2013-10-23”,
    “value”: 250
    }, {
    “date”: “2012-12-23”,
    “value”: 300
    }],

    “chartScrollbar”: {
    },
    “chartCursor”: {
    },
    “categoryField”: “date”,
    “categoryAxis”: {
    “parseDates”: true,
    “axisAlpha”: 0,
    }
    });

    chart.addListener(“dataUpdated”, zoomChart);
    zoomChart();

    function zoomChart(){
    chart.zoomToIndexes(130, chartData.length – 1);
    }

    Plugin Author martynasma

    (@martynasma)

    The problem is that you have the “dataProvider” property set twice.

    Delete the following line:

    "dataProvider": chartData,

    Thread Starter Le Taulier

    (@le-taulier)

    Hi,

    I did delete the line “dataProvider”: chartData,, but something is strange, I can see the correct calendar date on the abscisse but not the the line.

    Plugin Author martynasma

    (@martynasma)

    You also need to update your graph settings to use correct field in data.

    You currently have set valueField set to “visits”. There’s no such field in your data. Try replacing that line with:

    "valueField": "value"

    Thread Starter Le Taulier

    (@le-taulier)

    Perfect, thanks.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘How to input simple datas in a chart?’ is closed to new replies.