#8989

by amcharts

HTML

<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="linechartdiv2"></div>

CSS

#linechartdiv2 {
    width : 100%;
    height : 500px;
    font-size : 11px;
}

JavaScript

AmCharts.makeChart("linechartdiv2", {
    "type": "serial",
        "pathToImages": "http://cdn.amcharts.com/lib/3/images/",
        "categoryField": "date",
    "dataDateFormat": "YYYY-MM-DD", 
    "colors": ["#fe1544", "#efc83d", "#e679c8"],
        "startDuration": 1,
        "theme": "light",
        "startEffect": "elastic",
   "categoryAxis": {
        "minPeriod": "DD",
        "gridPosition": "start",
       "parseDates": true
    },
        "chartCursor": {
        "animationDuration": .1,
            "bulletSize": 15,
            "categoryBalloonDateFormat": "MMM YYYY"
    },
        "chartScrollbar": {
        "graph": "AmGraph-1",
            "scrollbarHeight": 30
    },
        "trendLines": [],
        "graphs": [{
        "balloonText": "[[value]]",
            "bullet": "round",
            "id": "AmGraph-1",
            "title": "Prospects",
            "type": "smoothedLine",
            "valueField": "Prospects"
    }, {
        "balloonText": "[[value]]",
            "bullet": "square",
            "id": "AmGraph-2",
            "title": "Leads",
            "type": "smoothedLine",
            "valueField": "Leads"
    }, {
        "balloonText": "[[value]]",
            "bullet": "diamond",
            "id": "AmGraph-3",
            "title": "Non Billable",
            "type": "smoothedLine",
            "valueField": "Non Billable"
    }],
        "guides": [],
        "valueAxes": [{
        "id": "ValueAxis-1",
    }],
        "allLabels": [],
        "balloon": {},
        "legend": {
        "align": "center",
            "marginLeft": 10,
            "markerSize": 14,
            "rollOverGraphAlpha": .35,
            "useGraphSettings": !0,
            "valueAlign": "left",
            "valueWidth": 44
    },
        "dataProvider": [{
        "date": '2014-08-28',
        "Prospects": '3',
        "Leads": '3',
        "Non Billable": '0'
    }, {
        "date": '2014-08-29',
        "Prospects": '4',
        "Leads": '1',
       ...