Subversion Repositories php-qbpwcf

Rev

Rev 23 | Blame | Compare with Previous | Last modification | View Log | RSS feed 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>amCharts examples</title>
        <link rel="stylesheet" href="style.css" type="text/css">
        <script src="../amcharts/amcharts.js" type="text/javascript"></script>
        <script src="../amcharts/serial.js" type="text/javascript"></script>

        <script>

            AmCharts.makeChart("chartdiv", {

                type: "serial",
                dataProvider: [{
                    "date": "2012-01-01",
                    "value": 8
                }, {
                    "date": "2012-01-01",
                    "value": 8
                }, {
                    "date": "2012-01-02",
                    "value": 10
                }, {
                    "date": "2012-01-03",
                    "value": 12
                }, {
                    "date": "2012-01-04",
                    "value": 14
                }, {
                    "date": "2012-01-05",
                    "value": 11
                }, {
                    "date": "2012-01-06",
                    "value": 6
                }, {
                    "date": "2012-01-07",
                    "value": 7
                }, {
                    "date": "2012-01-08",
                    "value": 9
                }, {
                    "date": "2012-01-09",
                    "value": 13
                }, {
                    "date": "2012-01-10",
                    "value": 15
                }, {
                    "date": "2012-01-11",
                    "value": 19
                }, {
                    "date": "2012-01-12",
                    "value": 21
                }, {
                    "date": "2012-01-13",
                    "value": 22
                }, {
                    "date": "2012-01-14",
                    "value": 20
                }, {
                    "date": "2012-01-15",
                    "value": 18
                }, {
                    "date": "2012-01-16",
                    "value": 14
                }, {
                    "date": "2012-01-17",
                    "value": 16
                }, {
                    "date": "2012-01-18",
                    "value": 18
                }, {
                    "date": "2012-01-19",
                    "value": 17
                }, {
                    "date": "2012-01-20",
                    "value": 15
                }, {
                    "date": "2012-01-21",
                    "value": 12
                }, {
                    "date": "2012-01-22",
                    "value": 10
                }, {
                    "date": "2012-01-23",
                    "value": 8
                }],

                dataDateFormat: "YYYY-MM-DD",
                categoryField: "date",


                categoryAxis: {
                    parseDates: true,
                    minPeriod: "DD",
                    gridAlpha: 0.1,
                    minorGridAlpha: 0.1,
                    axisAlpha: 0,
                    minorGridEnabled: true,
                    inside: true
                },

                valueAxes: [{

                    tickLength: 0,
                    axisAlpha: 0,
                    showFirstLabel: false,
                    showLastLabel: false,

                    guides: [{
                        value: 10,
                        toValue: 20,
                        fillColor: "#00CC00",
                        inside: true,
                        fillAlpha: 0.2,
                        lineAlpha: 0
                    }]

                }],


                graphs: [{
                    id:"g1",
                    lineColor: "#00CC00",
                    valueField: "value",
                    dashLength: 3,
                    bullet: "round",
                    balloonText: "<b><span style='font-size:14px;'>[[value]]</span></b>",
                    balloon:{
                        drop:true
                    }
                }],

                chartCursor: {
                    limitToGraph:"g1",
                    cursorColor:"#00CC00"
                },
                chartScrollbar: {

                },

                mouseWheelZoomEnabled: true,

                trendLines: [{
                    initialDate: new Date(2012, 0, 2, 12),
                    finalDate: new Date(2012, 0, 11, 12),
                    initialValue: 10,
                    finalValue: 19,
                    lineColor: "#CC0000"
                }, {
                    initialDate: new Date(2012, 0, 17, 12),
                    finalDate: new Date(2012, 0, 22, 12),
                    initialValue: 16,
                    finalValue: 10,
                    lineColor: "#CC0000"
                }]
            });
        </script>
    </head>

    <body>
        <div id="chartdiv" style="width: 100%; height: 400px;"></div>
    </body>

</html>