/*--------------  coin_sales4 bar chart start ------------*/
if (document.getElementById('coin_sales4')) {
    var ctx = document.getElementById("coin_sales4").getContext('2d');
    var chart = new Chart(ctx, {
        // The type of chart we want to create
        type: 'bar',
        // The data for our dataset
        data: {
            labels: ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10"],
            datasets: [{
                label: "Sales",
                data: [250, 320, 380, 330, 420, 250, 180, 250, 100, 300],
                backgroundColor: [
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#3a3afb',
                    '#8416fe'
                ]
            }]
        },
        // Configuration options go here
        options: {
            plugins: {
                legend: {
                    display: false
                }
            },
            animation: {
                easing: "easeInOutBack"
            },
            scales: {
                y: {
                    display: !1,
                    ticks: {
                        color: "#cccccc",
                        beginAtZero: !0,
                        padding: 0
                    },
                    grid: {
                        color: "transparent"
                    }
                },
                x: {
                    display: !1,
                    grid: {
                        color: "transparent",
                        display: !1
                    },
                    ticks: {
                        beginAtZero: !0,
                        padding: 0,
                        color: "#cccccc"
                    }
                }
            }
        }
    });
}

/*--------------  coin_sales4 bar chart End ------------*/

/*--------------  coin_sales5 bar chart start ------------*/
if (document.getElementById('coin_sales5')) {
    var ctx = document.getElementById("coin_sales5").getContext('2d');
    var chart = new Chart(ctx, {
        // The type of chart we want to create
        type: 'bar',
        // The data for our dataset
        data: {
            labels: ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10"],
            datasets: [{
                label: "Sales",
                data: [250, 220, 380, 130, 420, 230, 180, 220, 150, 300],
                backgroundColor: [
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#3a3afb',
                    '#8416fe'
                ]
            }]
        },
        // Configuration options go here
        options: {
            plugins: {
                legend: {
                    display: false
                }
            },
            animation: {
                easing: "easeInOutBack"
            },
            scales: {
                y: {
                    display: !1,
                    ticks: {
                        color: "#cccccc",
                        beginAtZero: !0,
                        padding: 0
                    },
                    grid: {
                        color: "transparent"
                    }
                },
                x: {
                    display: !1,
                    grid: {
                        color: "transparent",
                        display: !1
                    },
                    ticks: {
                        beginAtZero: !0,
                        padding: 0,
                        color: "#cccccc"
                    }
                }
            }
        }
    });
}

/*--------------  coin_sales5 bar chart End ------------*/

/*--------------  coin_sales6 bar chart start ------------*/
if (document.getElementById('coin_sales6')) {
    var ctx = document.getElementById("coin_sales6").getContext('2d');
    var chart = new Chart(ctx, {
        // The type of chart we want to create
        type: 'bar',
        // The data for our dataset
        data: {
            labels: ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10"],
            datasets: [{
                label: "Sales",
                data: [250, 320, 380, 120, 420, 530, 180, 250, 80, 250],
                backgroundColor: [
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#3a3afb',
                    '#8416fe'
                ]
            }]
        },
        // Configuration options go here
        options: {
            plugins: {
                legend: {
                    display: false
                }
            },
            animation: {
                easing: "easeInOutBack"
            },
            scales: {
                y: {
                    display: !1,
                    ticks: {
                        color: "#cccccc",
                        beginAtZero: !0,
                        padding: 0
                    },
                    grid: {
                        color: "transparent"
                    }
                },
                x: {
                    display: !1,
                    grid: {
                        color: "transparent",
                        display: !1
                    },
                    ticks: {
                        beginAtZero: !0,
                        padding: 0,
                        color: "#cccccc"
                    }
                }
            }
        }
    });
}

/*--------------  coin_sales6 bar chart End ------------*/

/*--------------  coin_sales7 bar chart start ------------*/
if (document.getElementById('coin_sales7')) {
    var ctx = document.getElementById("coin_sales7").getContext('2d');
    var chart = new Chart(ctx, {
        // The type of chart we want to create
        type: 'bar',
        // The data for our dataset
        data: {
            labels: ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10"],
            datasets: [{
                label: "Sales",
                data: [100, 300, 350, 350, 420, 150, 300, 250, 250, 300],
                backgroundColor: [
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#8416fe',
                    '#3a3afb',
                    '#3a3afb',
                    '#8416fe'
                ]
            }]
        },
        // Configuration options go here
        options: {
            plugins: {
                legend: {
                    display: false
                }
            },
            animation: {
                easing: "easeInOutBack"
            },
            scales: {
                y: {
                    display: !1,
                    ticks: {
                        color: "#cccccc",
                        beginAtZero: !0,
                        padding: 0
                    },
                    grid: {
                        color: "transparent"
                    }
                },
                x: {
                    display: !1,
                    grid: {
                        color: "transparent",
                        display: !1
                    },
                    ticks: {
                        beginAtZero: !0,
                        padding: 0,
                        color: "#cccccc"
                    }
                }
            }
        }
    });
}

/*--------------  coin_sales7 bar chart End ------------*/

/*--------------  bar chart 08 amchart start ------------*/
if (document.getElementById('ambarchart1')) {
    var chart = AmCharts.makeChart("ambarchart1", {
        "theme": "light",
        "type": "serial",
        "balloon": {
            "adjustBorderColor": false,
            "horizontalPadding": 10,
            "verticalPadding": 4,
            "color": "#fff"
        },
        "dataProvider": [{
            "country": "USA",
            "year2004": 3.5,
            "year2005": 4.2,
            "color": "#bfbffd",
            "color2": "#7474F0"
        }, {
            "country": "UK",
            "year2004": 1.7,
            "year2005": 3.1,
            "color": "#bfbffd",
            "color2": "#7474F0"
        }, {
            "country": "Canada",
            "year2004": 2.8,
            "year2005": 2.9,
            "color": "#bfbffd",
            "color2": "#7474F0"
        }, {
            "country": "Japan",
            "year2004": 2.6,
            "year2005": 2.3,
            "color": "#bfbffd",
            "color2": "#7474F0"
        }, {
            "country": "France",
            "year2004": 1.4,
            "year2005": 2.1,
            "color": "#bfbffd",
            "color2": "#7474F0"
        }, {
            "country": "Brazil",
            "year2004": 2.6,
            "year2005": 4.9,
            "color": "#bfbffd",
            "color2": "#7474F0"
        }],
        "valueAxes": [{
            "unit": "%",
            "position": "left",
        }],
        "startDuration": 1,
        "graphs": [{
            "balloonText": "GDP grow in [[category]] (2017): <b>[[value]]</b>",
            "fillAlphas": 0.9,
            "fillColorsField": "color",
            "lineAlpha": 0.2,
            "title": "2017",
            "type": "column",
            "valueField": "year2004"
        }, {
            "balloonText": "GDP grow in [[category]] (2018): <b>[[value]]</b>",
            "fillAlphas": 0.9,
            "fillColorsField": "color2",
            "lineAlpha": 0.2,
            "title": "2018",
            "type": "column",
            "clustered": false,
            "columnWidth": 0.5,
            "valueField": "year2005"
        }],
        "plotAreaFillAlphas": 0.1,
        "categoryField": "country",
        "categoryAxis": {
            "gridPosition": "start"
        },
        "export": {
            "enabled": false
        }

    });
}

/*--------------  bar chart 08 amchart END ------------*/
/*--------------  bar chart 09 amchart start ------------*/
if (document.getElementById('ambarchart2')) {
    var chart = AmCharts.makeChart("ambarchart2", {
        "type": "serial",
        "addClassNames": true,
        "theme": "light",
        "autoMargins": false,
        "marginLeft": 30,
        "marginRight": 8,
        "marginTop": 10,
        "marginBottom": 26,
        "balloon": {
            "adjustBorderColor": false,
            "horizontalPadding": 10,
            "verticalPadding": 8,
            "color": "#ffffff"
        },

        "dataProvider": [{
            "year": 2013,
            "income": 23.5,
            "expenses": 21.1,
            "color": "#7474f0"
        }, {
            "year": 2014,
            "income": 26.2,
            "expenses": 30.5,
            "color": "#7474f0"
        }, {
            "year": 2015,
            "income": 30.1,
            "expenses": 34.9,
            "color": "#7474f0"
        }, {
            "year": 2016,
            "income": 29.5,
            "expenses": 31.1,
            "color": "#7474f0"
        }, {
            "year": 2017,
            "income": 30.6,
            "expenses": 28.2,
            "dashLengthLine": 5,
            "color": "#7474f0"
        }, {
            "year": 2018,
            "income": 34.1,
            "expenses": 32.9,
            "dashLengthColumn": 5,
            "alpha": 0.2,
            "additional": "(projection)"
        }],
        "valueAxes": [{
            "axisAlpha": 0,
            "position": "left"
        }],
        "startDuration": 1,
        "graphs": [{
            "alphaField": "alpha",
            "balloonText": "<span style='font-size:12px;'>[[title]] in [[category]]:<br><span style='font-size:20px;'>[[value]]</span> [[additional]]</span>",
            "fillAlphas": 1,
            "fillColorsField": "color",
            "title": "Income",
            "type": "column",
            "valueField": "income",
            "dashLengthField": "dashLengthColumn"
        }, {
            "id": "graph2",
            "balloonText": "<span style='font-size:12px;'>[[title]] in [[category]]:<br><span style='font-size:20px;'>[[value]]</span> [[additional]]</span>",
            "bullet": "round",
            "lineThickness": 3,
            "bulletSize": 7,
            "bulletBorderAlpha": 1,
            "bulletColor": "#FFFFFF",
            "lineColor": "#AA59FE",
            "useLineColorForBulletBorder": true,
            "bulletBorderThickness": 3,
            "fillAlphas": 0,
            "lineAlpha": 1,
            "title": "Expenses",
            "valueField": "expenses",
            "dashLengthField": "dashLengthLine"
        }],
        "categoryField": "year",
        "categoryAxis": {
            "gridPosition": "start",
            "axisAlpha": 0,
            "tickLength": 0
        },
        "export": {
            "enabled": false
        }
    });
}

/*--------------  bar chart 09 amchart END ------------*/
/*--------------  bar chart 10 amchart start ------------*/
if (document.getElementById('ambarchart3')) {
    var chart = AmCharts.makeChart("ambarchart3", {
        "type": "serial",
        "theme": "light",
        "categoryField": "year",
        "rotate": true,
        "startDuration": 1,
        "categoryAxis": {
            "gridPosition": "start",
            "position": "left"
        },
        "trendLines": [],
        "graphs": [{
                "balloonText": "Income:[[value]]",
                "fillAlphas": 0.8,
                "id": "AmGraph-1",
                "lineAlpha": 0.2,
                "title": "Income",
                "type": "column",
                "valueField": "income",
                "fillColorsField": "color"
            },
            {
                "balloonText": "Expenses:[[value]]",
                "fillAlphas": 0.8,
                "id": "AmGraph-2",
                "lineAlpha": 0.2,
                "title": "Expenses",
                "type": "column",
                "valueField": "expenses",
                "fillColorsField": "color2"
            }
        ],
        "guides": [],
        "valueAxes": [{
            "id": "ValueAxis-1",
            "position": "top",
            "axisAlpha": 0
        }],
        "allLabels": [],
        "balloon": {},
        "titles": [],
        "dataProvider": [{
                "year": 2014,
                "income": 23.5,
                "expenses": 18.1,
                "color": "#7474f0",
                "color2": "#C5C5FD"
            },
            {
                "year": 2015,
                "income": 26.2,
                "expenses": 22.8,
                "color": "#7474f0",
                "color2": "#C5C5FD"
            },
            {
                "year": 2016,
                "income": 30.1,
                "expenses": 23.9,
                "color": "#7474f0",
                "color2": "#C5C5FD"
            },
            {
                "year": 2017,
                "income": 29.5,
                "expenses": 25.1,
                "color": "#7474f0",
                "color2": "#C5C5FD"
            },
            {
                "year": 2018,
                "income": 24.6,
                "expenses": 25,
                "color": "#7474f0",
                "color2": "#C5C5FD"
            }
        ],
        "export": {
            "enabled": false
        }

    });
}
/*--------------  bar chart 10 amchart END ------------*/
/*--------------  bar chart 11 amchart start ------------*/
if (document.getElementById('ambarchart4')) {
    var chart = AmCharts.makeChart("ambarchart4", {
        "type": "serial",
        "theme": "light",
        "marginRight": 70,
        "dataProvider": [{
            "country": "USA",
            "visits": 3025,
            "color": "#8918FE"
        }, {
            "country": "China",
            "visits": 1882,
            "color": "#7474F0"
        }, {
            "country": "Japan",
            "visits": 1809,
            "color": "#C5C5FD"
        }, {
            "country": "Germany",
            "visits": 1322,
            "color": "#952FFE"
        }, {
            "country": "UK",
            "visits": 1122,
            "color": "#7474F0"
        }, {
            "country": "France",
            "visits": 1114,
            "color": "#CBCBFD"
        }, {
            "country": "India",
            "visits": 984,
            "color": "#FD9C21"
        }, {
            "country": "Spain",
            "visits": 711,
            "color": "#0D8ECF"
        }, {
            "country": "Netherlands",
            "visits": 665,
            "color": "#0D52D1"
        }, {
            "country": "Russia",
            "visits": 580,
            "color": "#2A0CD0"
        }, {
            "country": "South Korea",
            "visits": 443,
            "color": "#8A0CCF"
        }, {
            "country": "Canada",
            "visits": 441,
            "color": "#9F43FE"
        }],
        "valueAxes": [{
            "axisAlpha": 0,
            "position": "left",
            "title": false
        }],
        "startDuration": 1,
        "graphs": [{
            "balloonText": "<b>[[category]]: [[value]]</b>",
            "fillColorsField": "color",
            "fillAlphas": 0.9,
            "lineAlpha": 0.2,
            "type": "column",
            "valueField": "visits"
        }],
        "chartCursor": {
            "categoryBalloonEnabled": false,
            "cursorAlpha": 0,
            "zoomable": false
        },
        "categoryField": "country",
        "categoryAxis": {
            "gridPosition": "start",
            "labelRotation": 45
        },
        "export": {
            "enabled": false
        }

    });
}
/*--------------  bar chart 11 amchart END ------------*/
/*--------------  bar chart 12 amchart start ------------*/
if (document.getElementById('ambarchart5')) {
    var chart = AmCharts.makeChart("ambarchart5", {
        "type": "serial",
        "theme": "light",
        "dataProvider": [{
            "name": "John",
            "points": 35654,
            "color": "#7F8DA9"
        }, {
            "name": "Damon",
            "points": 65456,
            "color": "#FEC514"
        }, {
            "name": "Patrick",
            "points": 45724,
            "color": "#952FFE"
        }, {
            "name": "Mark",
            "points": 23654,
            "color": "#8282F1"
        }, {
            "name": "Natasha",
            "points": 35654,
            "color": "#2599D4"
        }, {
            "name": "Adell",
            "points": 55456,
            "color": "#2563D6"
        }, {
            "name": "Alessandro",
            "points": 13654,
            "color": "#9524D4"
        }],
        "valueAxes": [{
            "maximum": 80000,
            "minimum": 0,
            "axisAlpha": 0,
            "dashLength": 4,
            "position": "left"
        }],
        "startDuration": 1,
        "graphs": [{
            "balloonText": "<span style='font-size:13px;'>[[category]]: <b>[[value]]</b></span>",
            "bulletOffset": 10,
            "bulletSize": 52,
            "colorField": "color",
            "cornerRadiusTop": 8,
            "customBulletField": "bullet",
            "fillAlphas": 0.8,
            "lineAlpha": 0,
            "type": "column",
            "valueField": "points"
        }],
        "marginTop": 0,
        "marginRight": 0,
        "marginLeft": 0,
        "marginBottom": 0,
        "autoMargins": false,
        "categoryField": "name",
        "categoryAxis": {
            "axisAlpha": 0,
            "gridAlpha": 0,
            "inside": true,
            "tickLength": 10,
            "color": "#fff"
        },
        "export": {
            "enabled": false
        }
    });
}
/*--------------  bar chart 12 amchart END ------------*/
/*--------------  bar chart 13 amchart start ------------*/
if (document.getElementById('ambarchart6')) {
    var chart = AmCharts.makeChart("ambarchart6", {
        "type": "serial",
        "theme": "light",
        "handDrawn": true,
        "handDrawScatter": 3,
        "legend": {
            "useGraphSettings": true,
            "markerSize": 12,
            "valueWidth": 0,
            "verticalGap": 0
        },
        "dataProvider": [{
            "year": 2014,
            "income": 23.5,
            "expenses": 18.1,
            "color": "#952FFE"
        }, {
            "year": 2015,
            "income": 26.2,
            "expenses": 22.8,
            "color": "#5182DE"
        }, {
            "year": 2016,
            "income": 30.1,
            "expenses": 23.9,
            "color": "#8282F1"
        }, {
            "year": 2017,
            "income": 29.5,
            "expenses": 25.1,
            "color": "#B369FE"
        }, {
            "year": 2018,
            "income": 24.6,
            "expenses": 25,
            "color": "#51ADDD"
        }],
        "valueAxes": [{
            "minorGridAlpha": 0.08,
            "minorGridEnabled": true,
            "position": "top",
            "axisAlpha": 0
        }],
        "startDuration": 1,
        "graphs": [{
            "balloonText": "<span style='font-size:13px;'>[[title]] in [[category]]:<b>[[value]]</b></span>",
            "title": "Income",
            "type": "column",
            "fillAlphas": 1,
            "fillColorsField": "color",
            "valueField": "income"
        }, {
            "balloonText": "<span style='font-size:13px;'>[[title]] in [[category]]:<b>[[value]]</b></span>",
            "bullet": "round",
            "bulletBorderAlpha": 1,
            "lineColor": "#AA59FE",
            "bulletColor": "#FFFFFF",
            "useLineColorForBulletBorder": true,
            "fillAlphas": 0,
            "lineThickness": 2,
            "lineAlpha": 1,
            "bulletSize": 7,
            "title": "Expenses",
            "valueField": "expenses"
        }],
        "rotate": true,
        "categoryField": "year",
        "categoryAxis": {
            "gridPosition": "start"
        },
        "export": {
            "enabled": false
        }

    });
}

/*--------------  bar chart 13 amchart END ------------*/

/*--------------  bar chart 14 highchart start ------------*/
if (document.getElementById('socialads')) {

    Highcharts.chart('socialads', {
        chart: {
            type: 'column'
        },
        title: false,
        xAxis: {
            categories: ['FB', 'TW', 'INS', 'G+', 'LINKD']
        },
        colors: ['#F5CA3F', '#E5726D', '#12C599', '#5F73F2'],
        yAxis: {
            min: 0,
            title: false
        },
        tooltip: {
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
            shared: true
        },
        plotOptions: {
            column: {
                stacking: 'column'
            }
        },
        series: [{
                name: 'Closed',
                data: [51, 48, 64, 48, 84]
            }, {
                name: 'Hold',
                data: [83, 84, 53, 81, 88]
            }, {
                name: 'Pending',
                data: [93, 84, 53, 53, 48]
            },
            {
                name: 'Active',
                data: [430, 312, 348, 254, 258]
            }
        ]
    });
}
/*--------------  bar chart 14 highchart END ------------*/