Plotting json on .JS

Question

I am trying to plot some json data but for some reason code is not workingLet me show my code.

My json looks like this:

{"d1":[[1356912000000, 1],[1356825600000, 1],[1356739200000, 1],[1356652800000, 1],[1356566400000, 38],[1356480000000, 47],[1356393600000, 1],[1356307200000, 4],[1356220800000, 1],[1356134400000, 2],[1356048000000, 50],[1355961600000, 51],[1327017600000, 38],[1326931200000, 52],[1326844800000, 45],[1326758400000, 49],[1326672000000, 46],[1326585600000, 1],[1326499200000, 5],[1326412800000, 44],[1326326400000, 48],[1326240000000, 43],[1326153600000, 46],[1326067200000, 41],[1325980800000, 1],[1325894400000, 4],[1325808000000, 45],[1325721600000, 43],[1325635200000, 42],[1325548800000, 42],[1325462400000, 43]]}

I am trying to plot with following code:

$(document).ready(function () {dashboard_A_chart.chartVisit ();});
dashboard_A_chart = {
    chartVisit: function () {
            var elem = $('#dashChartVisitors');
            var options = {
                    colors: ["#edc240", "#5EB95E"],
                    legend: {
                            show: true,
                            noColumns: 2, 
                            labelFormatter: null,
                            labelBoxBorderColor: false,
                            container: null,
                            margin: 8,
                            backgroundColor: false
                    },
                    xaxis: {
                            mode: "time",
                            font: {
                                    weight: "bold"
                            },
                            color: "#D6D8DB",
                            tickColor: "rgba(237,194,64,0.25)",
                            min: "1325462400000",
                            max: "1356912000000",
                            tickLength: 5
                    },
                    selection: {
                            mode: "x"
                    },
            };
    var d1 = []
        function onDataReceived(series) {d1 = [ series ];$.plot(elem, d1, options);}
        $.ajax({
            url: "../giga/data/dados1.json",
            method: 'GET',
            dataType: 'json',
            success: onDataReceived
        });             
   },

};

Answer 1

you are trying to call dashboard_A_chart.chartVisit() which is a function of an object literal which needs to be defined before.

you are creating the elem and options var inside the inside the chartVisit-function, but trying to use it in your onDataReceived-Function where it is not present.

it pretty much looks like you just copy & pasted some stuff together. take a looke at this code, that should work:

$(document).ready(function () {

  var elem = $('#dashChartVisitors');
  var options = {
          colors: ["#edc240", "#5EB95E"],
          legend: {
                  show: true,
                  noColumns: 2, 
                  labelFormatter: null,
                  labelBoxBorderColor: false,
                  container: null,
                  margin: 8,
                  backgroundColor: false
          },
          xaxis: {
                  mode: "time",
                  font: {
                          weight: "bold"
                  },
                  color: "#D6D8DB",
                  tickColor: "rgba(237,194,64,0.25)",
                  min: "1325462400000",
                  max: "1356912000000",
                  tickLength: 5
          },
          selection: {
                  mode: "x"
          }
  };



  $.ajax({
      url: "../giga/data/dados1.json",
      method: 'GET',
      dataType: 'json',
      success: function (data) {
        $.plot(elem, data, options);
      }
  });

});