js Highcharts中的可點擊酒吧？

我有橫向條形圖與Highcharts。我如何使每個酒吧點擊的事件，例如像'警報'？js Highcharts中的可點擊酒吧？

我有這樣的系列，例如：

series : [{ 
    name: 'John', 
    data: [5, 3, 4, 7, 2] 
}, { 
    name: 'Jane', 
    data: [2, 2, 3, 2, 1] 
}, { 
    name: 'Joe', 
    data: [3, 4, 4, 2, 5] 
}];

更重要的是，我應該怎麼辦？

來源

2012-05-16 夏期劇場

您可能會發現Highcharts Options Reference是一個很好的起點。

從參考資料中，可以看到一個柱狀圖的示例，其中點擊列會觸發警報。

http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/plotoptions/series-point-events-click-column/

來源

2012-05-16 03:13:00 mg1075

以上的鏈路不幸的破碎... – Christian

@Christian - 鏈路現在固定以條形圖的例子。不過，看起來Highcharts團隊仍然需要修正其API參考中的鏈接。 – mg1075

謝謝。這是另一個例子，以防萬一：http：// jsfiddle。net/e7b4Z/311/ – Christian

我需要做類似的一個什麼東西。希望能幫助到你。

聲明：我正在使用GWT Highcharts包裝！

下面是我所做的亮點：

1）我創建了一個有一個方法吧（INT指數的接口FooCallback），並實現了它

2）創建一個返回JavascriptObject的方法getBarClickCallback （功能），即具有FooCallback作爲PARAM

3）I中添加點擊回調圖表選項/ plotOptions /系列/點/事件/點擊，向它傳遞getBarClickCallback

4）一旦棒是點擊ED，FooCallback.bar（INT指數）被調用

...

chart.setOption("/plotOptions/series/point/events/click",getBarClickCallback(this)); 

private native static JavaScriptObject getBarClickCallback(FooCallback callback) /*-{ 
    return function() 
    { 
     if(this.x !== "undefined" && this.x >= 0){ 
      [email protected]::bar(I)(this.x); 
     } 
    }; 
}-*/; 

public void bar(int index){ 
    //handle chosen index 
}

...

此外，我想聽聽類別標籤點擊次數（順便說一句，我的顯示倒立的條形圖，有類別）

1）創建一個方法，將在dom中找到類別並向它們添加點擊事件。我稱之爲addLabelClickHandler（FooCallback回調，String chartId）並使用jquery添加事件。

2）添加一個調用addLabelClickHandler一個ChartLoadEventHandler（）轉發到PARAMS addLabelClickHandler（FooCallback回調，字符串chartId）

3）一旦軸類別被點擊時，FooCallback.bar（INT索引）被調用。 ..

chart.setLoadEventHandler(new ChartLoadEventHandler() { 

    @Override 
    public boolean onLoad(ChartLoadEvent chartLoadEvent) { 
    addLabelClickHandler(); 
    return false; 
    } 
    }); 

private void addLabelClickHandler(){ 
    addLabelClickHandler(this,chart.getElement().getId()); 
} 

private native static void addLabelClickHandler(FooCallback callback, String chartId)/*-{ 
     try { 
      var search = '#' + chartId + ' .highcharts-axis-labels:first text'; 
      $wnd.jQuery(search).each(
        function(i, j) { 
         $wnd.jQuery(this).css("cursor", "pointer"); 
         $wnd.jQuery(this).click(function() { 
          [email protected]::bar(I)(this.x); 
         }); 
        }); 
     } catch (err) { 
      console.log(err); 
     } 

    }-*/;

傑夫

來源

2014-01-28 20:55:30

js Highcharts中的可點擊酒吧？

回答

相關問題