Canvas Js在每个Bar C＃Mvc上写不同的值

Question

如何在每个小节的内部和外部写入不同的值？

样本数据

对于单个酒吧来说就像

X = 21538，Y = 25666，名称='七月'

现在，图形应该像这样渲染

预期

当前

类

   public class DataPoint
 {
    public DataPoint(string label, double y)
    {
        this.Label = label;
        this.Y = y;

       // this.X = x;
    }

    //Explicitly setting the name to be used while serializing to JSON.
    [DataMember(Name = "label")]
    public string Label = "";




    //Explicitly setting the name to be used while serializing to JSON.
    [DataMember(Name = "y")]
    public Nullable<double> Y = null;


}

另外，当我尝试使用x作为另一点时，图形显示了异常结果。 请帮忙。

Answer 1

我找到的解决此问题的方法是。

 var chart = new CanvasJS.Chart("chartContainer", {
    animationEnabled: true,
    exportEnabled: true,
theme: "light2", // "light1", "light2", "dark1", "dark2"
title: {
    text: '@(Model.topTitleChart)'
},
axisY: {
    title:  '@(Model.leftTitleChart)'
},

data: [{
    type: "column",
    indexLabel: "{innerValue}",
    indexLabelPlacement: "inside",
    dataPoints: @Html.Raw(Model.dataPoints)
}]
        });
addIndexLabel();
chart.render();
function addIndexLabel() {
    chart.options.data.push({ type: "scatter", color: "transparent", toolTipContent: null, dataPoints: [] });
    for (var i = 0; i < chart.options.data[0].dataPoints.length; i++)
        chart.options.data[1].dataPoints.push({ x: chart.options.data[0].dataPoints[i].x, y: chart.options.data[0].dataPoints[i].y, indexLabel: chart.options.data[0].dataPoints[i].outerValue });
}

类

  [DataContract]
   public class DataPoint
   {
      public DataPoint(string x, double y,string innerval,string outerval)
      {
        this.label = x;
        this.y = y;
        this.innerValue = innerval;
        this.outerValue = outerval;


       // this.X = x;
    }

    [DataMember(Name = "label")]
    public string label { get; set; }

    //Explicitly setting the name to be used while serializing to JSON.
    [DataMember(Name = "y")]
    public Nullable<double> y = null;

    [DataMember(Name = "outerValue")]
    public string outerValue { get; set; }

    [DataMember(Name = "innerValue")]
    public string innerValue { get; set; }


}

结果