1

Flot チャートと AJAX からのデータに問題があります。基本的に、グラフを表示するために配列を作成しましたが、どういうわけか軸ラベルは表示されますが、データは表示されません。また、積み上げグラフまたは棒グラフを作成するにはどうすればよいですか?

編集:または、AJAXを使用してx軸にラベルを付けてflotにデータを表示する方法を教えてください。コードはhttp://jsfiddle.net/DaG5W/284/で確認できます。ここで私が間違っていることを誰か教えてください。

これが私が使用したコードです。

$.getJSON(url, function(output) {
    var calendar, count, fieldNames, i, j, values, xAxis;
    fieldNames = new Array();
    i = 0;
    while (i < output.length) {
      if (fieldNames.indexOf(output[i].FieldName) < 0) {
        fieldNames.push(output[i].FieldName);
      }
      i++;
    }
    calendar = new Array();
    i = 0;
    while (i < output.length) {
      if (calendar.indexOf(output[i].Calendar) < 0) {
        calendar.push(output[i].Calendar);
      }
      i++;
    }
    xAxis = [];
    i = 0;
    while (i < calendar.length) {
      xAxis.push([parseInt(i + 1), calendar[i]]);
      i++;
    }
    data = [];
    i = 0;
    while (i < fieldNames.length) {
      values = [];
      count = 0;
      j = 0;
      while (j < output.length) {
        if (fieldNames[i] === output[j].FieldName) {
          count++;
          values.push([parseInt(count), parseInt(output[j].Totals)]);
        }
        j++;
      }
      data.push([
        {
          label: fieldNames[i].toString(),
          data: values,
          bars: {
            show: true
          },
          lines: {
            show: false
          }
        }
      ]);
    }
    return i++;
  });
  options = {
    xaxis: {
      ticks: xAxis
    }
  };
  plot = $.plot($("#div"), [data], options);

}
4

1 に答える 1

5

実用的なソリューションに非常に近づいています。あなたが間違ったことをしたのは、2 つの場所にあまりにも多くの配列をネストしたことだけです。

  data.push([
    {
      label: fieldNames[i].toString(),
      data: values,
      bars: {
        show: true
      },
      lines: {
        show: false
      }
    }
  ]);

[]シリーズオブジェクトの周りは必要ありません。

plot = $.plot($("#div"), [data], options);

ここでも同様に、[]aroundは必要ありませんdata。その後、グラフになります。ここを参照してください: http://jsfiddle.net/ryleyb/DaG5W/291/

于 2012-04-23T15:14:30.297 に答える