2016-07-15 93 views
0

我使用Highstockchart在图表上绘制4个系列,主要是烛台,然后我有2个系列绘制priceplus,pricelower价格,然后另一个来表示体积。 我有自pricelower/priceplus的提示一个问题,显示的时间为UNIX日期时间,而不是在人redeable形式(你可以在这个截图中看到)定制工具提示离开蜡烛棒,因为它是

enter image description here

我想这不会进行修改

enter image description here

我怎样才能做到这一点? 感谢

这里是我的JS代码

function onSuccess(data) { 
    var r = JSON.stringify(data); 
    debugger; 
    kendo.ui.progress($('#container'), false); 
    $('#container') 
     .highcharts('StockChart', 
     { 
      exporting: { 
       enabled: false 
      }, 
      credits: 
      { 
       enabled: false 
      }, 
      rangeSelector: { 
       selected: 1, 
       inputEnabled:false, 
       buttonTheme: { 
        visibility: 'hidden' 
       }, 
       labelStyle: { 
        visibility: 'hidden' 
       } 
      }, 
      yAxis: [ 
       { 
        height: '80%', 
        lineWidth: 2 
       }, { 
        top: '85%', 
        height: '15%', 
        offset: 0, 
        lineWidth: 2 
       } 
      ], 
      xAxis: 
      { 
       ordinal: true 
      } 
     , 
      series: [ 
       { 
        type: 'candlestick', 
        name: 'Price', 
        data: data.Prices, 
        id: 'dataseries', 
        upColor: "#31D431", 
        color: "#D22F2F", 
        marker:{ 
         enabled: true 
        } 
       }, 
       { 
        type: 'scatter', 
        name: 'Prices plus', 
        data: data.PricesPlus 

       }, 

      { 
       type: 'scatter', 
       name: 'Price less', 
       data: data.PricesLess 

      } 
       , { 
        type: 'column', 
        name: 'Volume', 
        data: data.Volume, 
        yAxis: 1, 
        dataGrouping: { 
         units: groupingUnits 
        } 
       } 
      ], 
      width: 4, 
      tooltip: { 
     shared: false 

} 

     }); 
} 

回答

2

您应该使用tooltip.formatter,然后创建弹出的内容。每个值都可以从点参考中提取。

tooltip:{ 
    formatter: function() { 
     var points = this.point ? Highcharts.splat(this.point) : this.points, 
      point = points[0], 
      each = Highcharts.each, 
      txt = ''; 

     txt += '<span style="font-size: 10px">' + Highcharts.dateFormat('%A, %b, %H:%M', point.x) + '</span><br/>'; 

     each(points, function(p, i) { 

     if(p.point && p.point.open) { 
      txt += '<span style="color:' + p.color + '">\u25CF</span><b> ' + p.series.name + '</b>:<br/>Open: ' + p.point.open + '<br/>High: ' + p.point.high + '<br/>Low: ' + p.point.low + '<br/>Close: ' + p.point.close + '<br/>'; 
     } else { 
      txt += '<span style="color:' + p.color + '">\u25CF</span> ' + p.series.name + ': <b>' + p.y + '</b><br/>'; 
     } 
     }); 

     return txt; 
    } 
    }, 

例子: - http://jsfiddle.net/abpbyx8z/

+0

原谅我,我添加了一个标记系列在此集合,但它并没有显示我的文字,它说不确定......我怎么在这个hadle格式化程序? – advapi

+0

你增加了额外的系列?你能用你的代码更新我的jsfiddle吗? –

相关问题