Javascript 如何检索groupby sum字段以在Amchart中显示文本

我是Amcharts的新手，请告诉我我做错了什么

这是我的javascript代码

var chartData1 = [];


 generateChartData();

 function generateChartData() {

        var month = new Array();
        month[0] = "Jan";
        month[1] = "Feb";
        month[2] = "Mar";
        month[3] = "Apr";
        month[4] = "May";
        month[5] = "Jun";
        month[6] = "Jul";
        month[7] = "Aug";
        month[8] = "Sep";
        month[9] = "Oct";
        month[10] = "Nov";
        month[11] = "Dec";

        for (var i = 0; i < 12; i++) {


        var monthName = month[i];
        var year = "2016";

        var newdateFormat = monthName + " " + year  ;
        var numofDocuments = Math.round(Math.random() * (10));
        var amount = Math.round(Math.random() * (1000 + i)) + 500 + i * 2;

    chartData1.push({
        chartcol: newdateFormat,
        value: amount,
        volume: numofDocuments
    });

}
}

setTimeout(function () {

console.log(chartData1);

var chart = AmCharts.makeChart("chartdiv", {
    type: "stock",
    dataSets: [
        {
            title: "first data set",
            fieldMappings: [{
                fromField: "value",
                toField: "value",
            }, {
                fromField: "volume",
                toField: "volume",
            }],
            dataProvider: chartData1,
            categoryField: "chartcol",
            color: ["#FF3300", "#000000"],
        }],

    panels: [{
        showCategoryAxis: false,
        title: "Value",
        percentHeight: 70,

        stockGraphs: [{
            id: "g1",
            title: "Amount",
            valueField: "value",
            comparable: false,
            bullet: "round",
            compareField: "value",
            balloonText: "<div>"+
                            "<div>"+
                                 "<div style='border:5px solid #3388FF; width:2px; display:inline-block; white-space:nowrap'>" +
                                 "</div>" +
                                    " Amount:<b>[[value]]</b>" +
                             "</div>" +
                             "<br />" +
                             "<div>" +
                                 "<div style='border:5px solid #FF3300; width:2px; display:inline-block; white-space:nowrap'>" +
                                 "</div>" +
                                    " Number of Documents:<b>[[volume]]</b>" +
                                  "</div>"+
                             "</div>" +
                         "</div>",
            compareGraphBalloonText: "Amount:<b>[[value]]</b>",
            "useDataSetColors": false,
            "lineColor": "#3388FF",
        }, {
            title: "Documents",
            valueField: "volume",
            showBalloon: false,
            comparable: false,
            periodValue: "Open",
            compareField: "volume",
            lineAlpha: 0,
            includeInMinMax: false,
        }],

        stockLegend: {
            periodValueTextComparing: "[[percents.value.close]]%",
            periodValueTextRegular: "[[value.close]]"
        }
    },

      {
          title: "Volume",
          percentHeight: 30,
          stockGraphs: [{
              valueField: "volume",
              type: "column",
              periodValue:"Open",
              showBalloon: false,
              fillAlphas: 1
          }]
      }
    ],

    "categoryAxesSettings": {
        "maxSeries": 1,
        "groupToPeriods": ["MM"]
    },

    chartScrollbarSettings: {
        graph: "g1"
    },

    chartCursorSettings: {
        valueBalloonsEnabled: true
    },

    dataSetSelector: {
        position: "left"
    },
    "export": {
        "enabled": true
    }
});


chart.validateData();


}, 100)

var chartData1=[]；
generateChartData（）；
函数generateChartData（）{
var month=新数组（）；
月[0]=“一月”；
月[1]=“2月”；
月[2]=“三月”；
月[3]=“4月”；
月[4]=“五月”；
月[5]=“六月”；
月[6]=“7月”；
月[7]=“8月”；
月[8]=“九月”；
月[9]=“10月”；
月[10]=“11月”；
月[11]=“12月”；
对于（变量i=0；i<12；i++）{
var monthName=月[i]；
var year=“2016年”；
var newdateFormat=monthName+“”+年；
var numofDocuments=Math.round（Math.random（）*（10））；
var amount=Math.round（Math.random（）*（1000+i））+500+i*2；
chartData1.push({
chartcol:newdateFormat，
价值：金额，
卷：NUMOF文件
});
}
}
setTimeout（函数（）{
console.log（chartData1）；
var chart=AmCharts.makeChart（“chartdiv”{
类型：“股票”，
数据集：[
{
标题：“第一个数据集”，
字段映射：[{
fromField：“值”，
托菲尔德：“价值”，
}, {
fromField：“卷”，
托菲尔德：“音量”，
}],
数据提供者：chartData1，
类别字段：“chartcol”，
颜色：[“FF3300”，“000000”]，
}],
面板：[{
showCategoryAxis:错误，
标题：“价值”，
身高百分比：70，
股票图表：[{
id:“g1”，
标题：“金额”，
valueField:“值”，
可比：错，
子弹：“圆形”，
比较字段：“值”，
正文：“+
""+
"" +
"" +
“金额：[[value]]”+
"" +
“
”+
"" +
"" +
"" +
“文档数：[[卷]]”+
""+
"" +
"",
CompareGraphBallodText:“金额：[[value]]”，
“useDataSetColors”：false，
“线条颜色”：“3388FF”，
}, {
标题：“文件”，
valueField:“体积”，
showBalloon:false，
可比：错，
周期值：“打开”，
比较字段：“卷”，
lineAlpha:0，
includeInMax:false，
}],
股票图例：{
periodValueTextComparing:“[[percents.value.close]]%”，
periodValueTextRegular:“[[value.close]]”
}
},
{
标题：“卷”，
身高百分比：30，
股票图表：[{
valueField:“体积”，
键入：“列”，
周期值：“打开”，
showBalloon:false，
注：1
}]
}
],
“类别设置”：{
“maxSeries”：1，
“groupToPeriods”：[“MM”]
},
图表滚动条设置：{
图表：“g1”
},
图表光标设置：{
ValueBallodesEnabled:为true
},
数据集选择器：{
位置：“左”
},
“出口”：{
“已启用”：真
}
});
chart.validateData（）；
}, 100)

我的Html代码Index.cshtml（默认的asp.net mvc页面，在_layout.cshtml中共享布局，我在其中包含了对上面显示的js文件的引用）

我可以生成图表，但ballonText不包含该值，您可以检查标题中显示的图像

---

您可以使用

气球功能

代替

气球文本

：

balloonFunction: function(dataItem) {
     return "Amount: <b>" + dataItem.dataContext.dataContext.value + "</b><br>" +
            "Documents: <b>" + dataItem.dataContext.dataContext.volume + "</b>";
}

balloodfunction:function（数据项）{
返回“金额：+dataItem.dataContext.dataContext.value+”
“+
“文档：“+dataItem.dataContext.dataContext.volume+”；
}

---

工作演示：

我不知道这是否是一个流行的库，但您可能应该创建一个MCVEPlease create fiddle，然后有人能够帮助您。谢谢，这是我一直在寻找的解决方案。我很高兴能提供帮助。

balloonFunction: function(dataItem) {
     return "Amount: <b>" + dataItem.dataContext.dataContext.value + "</b><br>" +
            "Documents: <b>" + dataItem.dataContext.dataContext.volume + "</b>";
}