my-dev-charts

amCharts wrapper

Installing

Using npm

npm install my-dev-charts

Usage

import my-dev-modules

###XY ######Basic example import MyDevCharts from 'my-dev-charts'

new MyDevCharts.XyChart('element-id')
    .createSeries('amount', 'Amount')
    .loadDataFromUrl(YOUR-ENDPOINT-URL);

Your feedback structure from the endpoint for the example above should look like this:

data:{
    chatData:[
        {
            date: '2019-01-01',
            amount: 350
        },
        {
            date: '2019-01-02',
            amount: 350
        }
    ]
}

######A bit more complex one

 new XyChart('element-id')
    .createSeries('field1Name', 'Field 1 label', { 
        column:true, //column type series
        withoutBullet:true, //without bullet
        unNeededZeroField: true // ignore from zero value data 
    })
    .createSeries('field2Name', 'Field 2 label', {
        column:true,
        withoutBullet:true,
        unNeededZeroField: true
    })
    .createSeries('totalField', 'Some total field', {
        dividedTo: { // Say we have some total field and we want present it as sum of multiple values
            divded1: 'divded 1 label',
            divded2: 'divded 2 label'
        },
        withoutStacked: true // without stacked
    })
    .loadDataFromUrl(YOUR-ENDPOINT-URL, { //Some params that we want to pass along with our request
        from: from,
        to: to
    }, (data) => { //Callback 
        console.log(data);
    });

Your feedback structure from the endpoint for the example above should look like this:

data:{
    chatData:[
        {
            date: '2019-01-01',
            field1Name: 350,
            field2Name: 200,
            totalField: 600,
            divded1:300,
            divded2:300
        },
        {
            date: '2019-01-02',
            field1Name: 450,
            field2Name: 600,
            totalField: 700,
            divded1:400,
            divded2:300
         }
    ]
}
    

Contact us

• Email: [email protected]