2016-04-22 60 views
-1

我想改變我的highcharts的行爲,顯示有關數據的工具提示當一個點的點擊,而不是上空盤旋,這是我的圖表對象的代碼,highcharts顯示在點提示點擊

this.chart = new Highcharts.Chart({ 

     chart : { 
      renderTo : $container[0], 
      type : chartType, 
      events : { 
       load: function() { 
        this.myTooltip = new Highcharts.Tooltip(this, this.options.tooltip); 
        console.log(this.myTooltip); 
       } 
      } 
     }, 
     title: { 
      enabled : false, 
      useHTML: true, 
      text: '' 
     }, 
     legend : { 
      enabled : false 
     }, 
     xAxis: { 
      categories: self.categories, 
      labels : { 
       rotation : 90, 
       formatter: function(){ 
        return '<a href="" class="axisLabel" data-name="'+ this.value +'">' + this.value + '</a>'; 
       }, 
       useHTML: true, 
       padding: '10px', 
       y: 30, 
       x: -5, 
       align:'left' 
      } 
     }, 
     yAxis: { 
      allowDecimals: false, 
      opposite:false 
     }, 
     tooltip: { 
      enabled: false, 
      useHTML : true, 
      backgroundColor: "rgba(255,255,255,1)", 
      formatter : function() { 
       if(self.graphView != "turn") { 
        var tooltip = self.showClientProjects(this.x, self.organisation_filter, this.y, self.graphView); 
        self.pointIndex = this.point.index; 
        return tooltip.innerHTML; 
       } else { 
        console.log(this.x); 
        var tooltip = self.showClientProjects(this.x, null, null, self.graphView); 
        self.pointIndex = this.point.index; 
        return tooltip.innerHTML; 
       } 
      } 
     }, 
     plotOptions: { 
      column: { 
       maxPointWidth: 5, 
       pointPadding: 0.2, 
       //borderWidth:1 
      }, 
      series: { 
       stickyTracking: false, 
       events: { 
        click: function(evt){ 
         this.chart.myTooltip.refresh(evt.point, evt) 
        }, 
        mouseOut: function() { 
         this.chart.myTooltip.hide(); 
        } 
       } 
      } 
     }, 
     series: [{ 
      data : data, 
      dataLabels : { 
       crop : false 
      } 
     }] 

    }); 

點擊一個點返回該錯誤,

highcharts.src.js:1319 Uncaught TypeError: Cannot read property 'call' of null this line of code is from the highcharts library,

// If the event handler return false, prevent the default handler from executing 
if (fn.call(el, eventArguments) === false) { 
    eventArguments.preventDefault(); 
} 

但是它適用於快速小提琴完美的罰款我敲了起來,

http://jsfiddle.net/d1gL4cjx/1/

+1

你的小提琴被打破:'未捕獲的錯誤:Highcharts錯誤#13:www.highcharts.com /錯誤/ 13' –

+1

的小提琴你提供的不符合你提供的代碼。 – apokryfos

+0

如果您提供有關渲染div的正確信息的Highcharts,那麼圖表似乎工作正常 - http://jsfiddle.net/gqxzv8bL/1/。此外,不要爲配置對象設置兩個相同的屬性以避免意外的行爲 - 您可以使用兩次載入事件設置圖表。 (本評論提供的小提琴中刪除了問題。) –

回答