Forum Replies Created

Viewing 1 post (of 1 total)
  • Author
    Posts
  • in reply to: How can I use PHP MySQL Dynamic data #7575

    jo

    Hi,

    I would like a help.. my code is not in php. I’m using in mvc. I would like time in x axis and a count in y axis. There would be 4 graphs plotted in the same one. Now my graph is not getting plotted when taken from db. Please help. My code is:-
    function FetchDashBoardGraph() {
    var input, input1;
    $.ajax({
    url: ‘@Url.Content(“~/Dashboard/FetchDashBoardGraph”)’,
    type: ‘POST’,
    responseType: “text/html”,
    success: function (data) {
    debugger;
    input = DataCall(data);
    input1 = input[0];
    debugger;
    var chart = new CanvasJS.Chart(“chartContainer”,
    {
    axisY: {
    maximum: 600
    },

    axisX: {
    interval: 3
    },
    legend: {
    verticalAlign: “bottom”,
    horizontalAlign: “center”
    },
    data: [input1],
    //[{
    // name: “Universe”,
    // showInLegend: true,
    // legendMarkerType: “square”,
    // type: “splineArea”,
    // color: “rgba(40,175,101,0.6)”,
    // markerSize: 1,
    // dataPoints: [
    // { x: new Date(2013, 0, 1, 00, 00), label: “midnight”, y: data[0] },
    // { x: new Date(2013, 0, 1, 01, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 02, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 03, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 04, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 05, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 06, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 07, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 08, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 09, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 10, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 11, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 12, 00), y: data[0], label: “noon” },
    // { x: new Date(2013, 0, 1, 13, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 14, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 15, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 16, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 17, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 18, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 19, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 20, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 21, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 22, 00), y: data[0] },
    // { x: new Date(2013, 0, 1, 23, 00), y: data[0] }
    // ]
    //},
    //{
    // name: “Current”,
    // showInLegend: true,
    // legendMarkerType: “square”,
    // type: “splineArea”,
    // color: “rgba(0,75,141,0.7)”,
    // markerSize: 0,
    // label: “”,
    // dataPoints: [

    // { x: new Date(2013, 0, 1, 00, 00), label: “midnight”, y: 12 },
    // { x: new Date(2013, 0, 1, 01, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 02, 00), y: 3 },
    // { x: new Date(2013, 0, 1, 03, 00), y: 5 },
    // { x: new Date(2013, 0, 1, 04, 00), y: 50 },
    // { x: new Date(2013, 0, 1, 05, 00), y: 200 },
    // { x: new Date(2013, 0, 1, 06, 00), y: 210 },
    // { x: new Date(2013, 0, 1, 07, 00), y: 198 },
    // { x: new Date(2013, 0, 1, 08, 00), y: 300 },
    // { x: new Date(2013, 0, 1, 09, 00), y: 211 },
    // { x: new Date(2013, 0, 1, 10, 00), y: 221 },
    // { x: new Date(2013, 0, 1, 11, 00), y: 240 },
    // { x: new Date(2013, 0, 1, 12, 00), y: 280, label: “noon” },
    // { x: new Date(2013, 0, 1, 13, 00), y: 260 },
    // { x: new Date(2013, 0, 1, 14, 00), y: 170 },
    // { x: new Date(2013, 0, 1, 15, 00), y: 23 },
    // { x: new Date(2013, 0, 1, 16, 00), y: 28 },
    // { x: new Date(2013, 0, 1, 17, 00), y: 22 },
    // { x: new Date(2013, 0, 1, 18, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 19, 00), y: 9 },
    // { x: new Date(2013, 0, 1, 20, 00), y: 6 },
    // { x: new Date(2013, 0, 1, 21, 00), y: 4 },
    // { x: new Date(2013, 0, 1, 22, 00), y: 12 },
    // { x: new Date(2013, 0, 1, 23, 00), y: 14 }
    // ]
    //},
    //{
    // name: “Swiped In”,
    // showInLegend: true,
    // legendMarkerType: “square”,
    // type: “splineArea”,
    // color: “rgba(54,158,173,.6)”,
    // markerSize: 0,
    // label: “”,
    // dataPoints: [

    // { x: new Date(2013, 0, 1, 00, 00), label: “midnight”, y: 12 },
    // { x: new Date(2013, 0, 1, 01, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 02, 00), y: 30 },
    // { x: new Date(2013, 0, 1, 03, 00), y: 50 },
    // { x: new Date(2013, 0, 1, 04, 00), y: 20 },
    // { x: new Date(2013, 0, 1, 05, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 06, 00), y: 30 },
    // { x: new Date(2013, 0, 1, 07, 00), y: 60 },
    // { x: new Date(2013, 0, 1, 08, 00), y: 140 },
    // { x: new Date(2013, 0, 1, 09, 00), y: 150 },
    // { x: new Date(2013, 0, 1, 10, 00), y: 210 },
    // { x: new Date(2013, 0, 1, 11, 00), y: 240 },
    // { x: new Date(2013, 0, 1, 12, 00), y: 280, label: “noon” },
    // { x: new Date(2013, 0, 1, 13, 00), y: 260 },
    // { x: new Date(2013, 0, 1, 14, 00), y: 170 },
    // { x: new Date(2013, 0, 1, 15, 00), y: 230 },
    // { x: new Date(2013, 0, 1, 16, 00), y: 280 },
    // { x: new Date(2013, 0, 1, 17, 00), y: 220 },
    // { x: new Date(2013, 0, 1, 18, 00), y: 100 },
    // { x: new Date(2013, 0, 1, 19, 00), y: 90 },
    // { x: new Date(2013, 0, 1, 20, 00), y: 60 },
    // { x: new Date(2013, 0, 1, 21, 00), y: 40 },
    // { x: new Date(2013, 0, 1, 22, 00), y: 120 },
    // { x: new Date(2013, 0, 1, 23, 00), y: 140 }
    // ]
    //},
    //{
    // name: “Swiped Out”,
    // showInLegend: true,
    // legendMarkerType: “square”,
    // type: “splineArea”,
    // color: “rgba(127,96,132,.6)”,
    // markerSize: 0,
    // label: “”,
    // dataPoints: [

    // { x: new Date(2013, 0, 1, 00, 00), label: “midnight”, y: 12 },
    // { x: new Date(2013, 0, 1, 01, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 02, 00), y: 3 },
    // { x: new Date(2013, 0, 1, 03, 00), y: 5 },
    // { x: new Date(2013, 0, 1, 04, 00), y: 2 },
    // { x: new Date(2013, 0, 1, 05, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 06, 00), y: 30 },
    // { x: new Date(2013, 0, 1, 07, 00), y: 60 },
    // { x: new Date(2013, 0, 1, 08, 00), y: 140 },
    // { x: new Date(2013, 0, 1, 09, 00), y: 15 },
    // { x: new Date(2013, 0, 1, 10, 00), y: 210 },
    // { x: new Date(2013, 0, 1, 11, 00), y: 24 },
    // { x: new Date(2013, 0, 1, 12, 00), y: 280, label: “noon” },
    // { x: new Date(2013, 0, 1, 13, 00), y: 206 },
    // { x: new Date(2013, 0, 1, 14, 00), y: 17 },
    // { x: new Date(2013, 0, 1, 15, 00), y: 23 },
    // { x: new Date(2013, 0, 1, 16, 00), y: 28 },
    // { x: new Date(2013, 0, 1, 17, 00), y: 22 },
    // { x: new Date(2013, 0, 1, 18, 00), y: 10 },
    // { x: new Date(2013, 0, 1, 19, 00), y: 90 },
    // { x: new Date(2013, 0, 1, 20, 00), y: 60 },
    // { x: new Date(2013, 0, 1, 21, 00), y: 40 },
    // { x: new Date(2013, 0, 1, 22, 00), y: 12 },
    // { x: new Date(2013, 0, 1, 23, 00), y: 14 }
    // ]
    //}
    //]
    });
    chart.render();
    },
    error: function () {
    RedirectToErrorPage();
    }
    });
    }

    function DataCall(details) {
    var data = [];
    var dataSeries = {
    name: “Swiped Out”,
    showInLegend: true,
    legendMarkerType: “square”,
    type: “splineArea”,
    color: “rgba(127,96,132,.6)”,
    markerSize: 0,
    label: “”,
    };
    var dataPoints = [];
    for (var i = 0, j = 0; i < details.length; i = i + 2, j++) {
    y = details[i];
    dateTime = new Date(2013, 0, 1, j, 00);
    //dateTime.setMilliseconds(dateTime.getMilliseconds() + i);
    //dateTime.setSeconds(dateTime.getSeconds() + i);
    //dateTime.setMinutes(dateTime.getMinutes() + i);
    //dateTime.setHours(dateTime.getHours() + i);
    //dateTime.setDate(dateTime.getDate() + i);
    //dateTime.setMonth(dateTime.getMonth() + i);
    //dateTime.setFullYear(dateTime.getFullYear() + i);

    dataPoints.push({
    //x: (i+1) % 50 === 0 ? dateTime.getTime() : dateTime,
    //x: i + 345345,
    x: dateTime.toLocaleString(),
    ///x: i,
    y: y
    });
    }
    dataSeries.dataPoints = dataPoints;
    data.push(dataSeries);
    debugger;
    return data;
    }

Viewing 1 post (of 1 total)