Amchart:多面板水平图(立体图)不会在工具提示上产生气球文本的时间

时间:2018-02-06 11:19:18

标签: javascript amcharts onmouseover amstock

我没有在工具提示上获得x轴值(时间)作为气球文本 在鼠标悬停在Amchart地平线图表与多个面板。 我需要在鼠标悬停的工具提示上使用x轴时间。有关详情,请参阅:https://www.amcharts.com/demos/multi-panel-horizon-chart/

function buildPanel(dim) {
    return {       
        "valueAxes": [{
            "axisAlpha": 0,
            "gridAlpha": 0,
            "position": "left",
            "gridCount": 2,
            "labelsEnabled": false,
            "labelFrequency": 1,
            "strictMinMax": true,
            "minimum": 0,
            "maximum": 2
        }, {
            "id": "actual",
            "axisAlpha": 0,
            "gridAlpha": 0,
            "position": "left",
            "gridCount": 2,
            "labelsEnabled": false
        }],       
        "showCategoryAxis": true,
        "stockGraphs": [{
            "id": "pos_band1" + dim,
            "lineAlpha": 0,
            "showBalloon": false,
            "valueField": "pos_1d",
            "fillAlphas": 0,
            "useDataSetColors": false,
            "visibleInLegend": false,
            "balloonText" :"Test Vale" // show Ballon Text
        }, {
            "fillAlphas": 1,
            "lineColor": "#c6dbef",
            "fillToGraph": "pos_band1" + dim,
            "lineAlpha": 0,
            "showBalloon": false,
            "valueField": "pos_1u" + dim,
            "type": "step",
            "theme": "light",
            "useDataSetColors": false,
            "visibleInLegend": false
        }, {
            "id": "pos_band2" + dim,
            "lineAlpha": 0,
            "showBalloon": false,
            "valueField": "pos_2d",
            "fillAlphas": 0,
            "useDataSetColors": false,
            "visibleInLegend": false
        }]
    };
}

任何人都可以帮助我。

1 个答案:

答案 0 :(得分:0)

在您的特定代码段中,您必须将showBalloon设置为true,但如果您将balloonText替换为[[value]],则可能会获得原始带值而不是最终值原始波段值的气球而不是最终值,这可能不是您想要的。另请注意,[[category]]会为您提供日期/时间。

如果要修改所链接的演示中的气球,则必须修改所提到的balloonText,或者如果要使用{{3来微调日期格式,请创建balloonFunction在最后两个stockGraphs中:

function buildPanel(dim) {
  return {
    // ..
    stockGraphs: [
      // bands omitted
     {
      "fillAlphas": 0,
      "lineAlpha": 0,
      "lineColor": "#eee",
      "showBalloonAt": "open",
      "balloonFunction": function(graphDataItem) { 
        return graphDataItem.values.value + "<br>" +
          AmCharts.formatDate(graphDataItem.category, "YYYY-MM-DD JJ:NN:SS");
      },
      "valueField": "val" + dim,
      "openField": "mid",
      "type": "smoothedLine",
      "useDataSetColors": false,
      "visibleInLegend": false
    }, {
      "lineAlpha": 1,
      "lineColor": "#2171b5",
      "lineThickness": 2,
      //"showBalloonAt": "open", //remove from actual graph as it does not have an open value
      "balloonFunction": function(graphDataItem) { 
        return graphDataItem.values.value + "<br>" +
          AmCharts.formatDate(graphDataItem.category, "YYYY-MM-DD JJ:NN:SS");
      },
      "valueField": "actual" + dim,
      "type": "smoothedLine",
      "useDataSetColors": false,
      "visibleInLegend": false,
      "valueAxis": "actual"
    } ]
  }
}

这是AmCharts.formatDate