0

我正在编写一个 GWT 应用程序并使用 highcharts。有些功能在 Java 中无法实现,但在 javascript 中。我得到了一个如何实现我可以使用的东西的例子,但是我不知道如何包含在我的代码中。

我的代码包含一个声明为的变量Chart graph;

我想实现一个事件,如this answer中所示在悬停时将工具提示添加到highcharts中的图例

  chart: {
        type: 'column',
        events: {
            load: function () {
                var chart = this,
                    legend = chart.legend;

                for (var i = 0, len = legend.allItems.length; i < len; i++) {
                    var item = legend.allItems[i].legendItem;
                    item.on('mouseover', function (e) {
                        //show custom tooltip here
                        console.log("mouseover");
                    }).on('mouseout', function (e) {
                        //hide tooltip
                        console.log("mouseout");
                    });
                }

            }
        }

    },

如何将此功能添加到我的代码中。我尝试使用 chart.setOption(/chart/events/load", Object o) 如此处所示http://www.moxiegroup.com/moxieapps/gwt-highcharts/apidocs/index.html但我想不出办法去做吧。

我认为它将通过创建一个方法来完成

private native void foo(JavaScriptObject c)/*-{


}-*/;

或者

private native void foo(Chart c)/*-{


}-*/;

但我不确定如何将两者联系起来。任何帮助表示赞赏!

4

1 回答 1

1

首先创建一个像这样的本机方法;

private native void foo(JavaScriptObject chart)/*-{
    var legend = chart.legend;

    for (var i = 0, len = legend.allItems.length; i < len; i++) {
        var item = legend.allItems[i].legendItem;

        item.on('mouseover', function (e) {
            //show custom tooltip here
            console.log("mouseover");
        }).on('mouseout', function (e) {
            //hide tooltip
            console.log("mouseout");
        });
    }
}-*/;

然后setLoadEventHandler()像这样调用这个方法;

chart.setLoadEventHandler(new ChartLoadEventHandler() {

        @Override
        public boolean onLoad(ChartLoadEvent chartLoadEvent) {
            foo(chart.getNativeChart());

            return true;
        }
    });

就这样!希望这会帮助你。

于 2013-12-17T19:22:23.127 回答