Amcharts：如何在 balloonFunction 中传递标题？

Question

我想在传递之前格式化数据，它会显示为工具提示。为此，我使用 balloonFunction 和 compareGraphBalloonFunction

        "stockGraphs": [
          {
            "id": "g1",
            "valueField": "value",
            "comparable": true,
            "compareField": "value",
            "balloonFunction": this.ballonRender,
            "compareGraphBalloonFunction": this.ballonRender,
            // This is works
            //"balloonText": [[title]]
            //"compareGraphBalloonText": [[title]]
          }]

但是当我将标题作为参数发送到我的 ballonRender 函数时，我无法在 title object.[= 中找到显示我的图表名称的属性 21=]

  ballonRender(title) {
    let sign = (title["percents"]["value"]>0) ? "+" : "-";
    let values = (title["values"]["value"]).toFixed(4)
    let percentage =  (title["percents"]["value"]).toFixed(2)
    let newTitle = 'Product <b>%s</b> (%s %s%)'.format(values, sign, percentage)
    return newTitle
  },

如果我在 ballonRender 函数中打印 title，我会观察到以下 object。

category : Mon Oct 02 2017 00:00:00 GMT+0800 (Гонконг, стандартное время) {}
dataContext : amCategoryIdField: "1506873600000"
dataContext : {__ob__: Observer}
date : Mon Oct 02 2017 08:00:00 GMT+0800 (Гонконг, стандартное время) {}
rawData : (5) [{…}, {…}, {…}, {…}, {…}]
valueAbsHigh : 1.0477245421
valueAverage : 1.04665801056
valueClose : 1.0466455011
valueCount : 5
valueHigh : 1.0477245421
valueLow : 1.0451341501
valueOpen : 1.0451341501
valueSum : 5.2332900528
graph : {id: "g1", valueField: "value", comparable: true, compareField: "value", balloonFunction: ƒ, …}
index : 40
isNegative : false
percents : {value: 4.664550109999993, percents: 23.826681846132807, total: 339.27455273}
serialDataItem : {dataContext: {…}, category: Mon Oct 02 2017 00:00:00 GMT+0800 (Гонконг, стандартное время), time: 1506873600000, axes: {…}, x: {…}}
values : {value: 1.0466455011, percents: 23.826681846132807, total: 4.3927455273}
x : 608
y : 359.7633884380001

我不明白为什么 [[title]] in balloonText 工作正常，但是当我将此参数传递给函数时我无法检索图表标题。

另外，一般来说，我对 ballonFunction 中的输入参数有些困惑。如果您共享带有解释和 best-practicies.

的资源，那就太好了

Answer 1

标题来自graph object itself. In the stock chart's case, the graph inherits the title from the dataSet, but the same property is populated. All you have to do is access the graph object that is passed as a second parameter to the balloonFunction，目前你的函数中没有，获取标题数据：

    "balloonFunction": function(graphDataItem, graph) {  
      return "<u>" + graph.title + "</u>: <b>" + graphDataItem.values.value + "</b>";
    },
    "compareGraphBalloonFunction": function(graphDataItem, graph) {  
      return "<u>" + graph.title + "</u>: <b>" + graphDataItem.values.value + "</b>";
    }

Demo

Amcharts：如何在 balloonFunction 中传递标题？

Amcharts: How to pass title in balloonFunction?

javascript

amcharts

amstock