2

折れ線グラフで値がゼロ (0) のデータ ポイントを非表示にする方法はありますか? 私は現在、折れ線グラフ (剣道) を使用していますが、これを行う簡単な方法が見つからないようです。基本的に、線はグラフの値 0 に表示されますが、線はまったく表示されません。線の終了値の 1 つをバインドするデータはゼロです (削除する必要があります)。 [30,50,40 のようなサンプル データ,75,0]

ここで私はhtmlコードを提供しています

 $.ajax({
                type: "POST",
                contentType: "application/json;charset=utf-8",
                url: "dataVizWebService.asmx/GetSellInOfficeTrends",
                dataType: "json",
                success: function (data) {

                    $("#chart").kendoChart({
                        dataSource: {
                            data: data.d,
                            value: "#={0}>0"
                        },
                        legend: {
                            position: "bottom"
                        },
                        title: {
                            text: "Population"
                        },
                        series: [
                                    {
                                        type: "line",
                                        field: "Population2010",
                                        name: "Population2010",
                                        axis: "Year",
                                        color: "#4a7ebb"
                                    }, {
                                        type: "line",
                                        field: "Population2011",
                                        name: "Population2011",
                                        axis: "Year",
                                        color: "#be4b48"
                                    }, {
                                        type: "line",
                                        field: "Population2012",
                                        name: "Population2012",
                                        axis: "Year",
                                        color: "#98b954"
                                    }, {
                                        type: "line",
                                        field: "Population2013",
                                        name: "Population2013",
                                        axis: "Year",
                                        dashType: "dash",
                                        color: "#000000"
                                    }
                                    ],
                        valueAxis: [{
                            name: "Year",
                            title: { text: "Population in Millions" }
                        }],
                        categoryAxis: {
                            field: "Week",
                            majorTickType: "none",
                            labels: {
                                skip: 0
                            }
                        },
                        tooltip: {
                            visible: true
                        }
                    })
                }
            });

どんな助けでも大歓迎です。

4

2 に答える 2

1

dataSourceのparse()に接続して、チャートに渡されるデータを変更できます。例:

function parse(items) {
  var item,
      result = [];

  for (var i = 0; i < items.length; i++) {
    item = items[i];
    if (item.value !== 0) {
      result.push(item);
    }
  }

  return result;
}

$(function() {
  var data = [{ value: 30 },{ value: 50 },{ value: 40 },{ value: 75 }, { value: 0 }];
  $("#chart").kendoChart({
    dataSource: {
      data: data,
      schema: {
        parse: parse
      } 
    },
    series: [{
      type: "line",
      field: "value"
    }]
  });
});
于 2013-01-04T10:51:15.173 に答える