从GWT中的HighCharts库(以及一般的Javascript)自定义Stockchart范围选择器按钮

时间:2012-08-29 13:05:02

标签: javascript gwt highcharts highstock

我正在使用HighCharts库进行GWT,我遇到了问题。

我正在尝试这样的事情:stock chart example。我对此问题唯一感兴趣的是buttons内的rangeSelector属性,其中我想自定义按钮文本)。在javascript上代码是这样的:

rangeSelector: {
            buttons: [{
                type: 'day',
                count: 3,
                text: '3dias'
            }, {
                type: 'week',
                count: 1,
                text: '1w'
            }, {
                type: 'month',
                count: 1,
                text: '1m'
            }, {
                type: 'month',
                count: 6,
                text: '6MS'
            }, {
                type: 'year',
                count: 1,
                text: '1ano'
            }, {
                type: 'all',
                text: 'All'
            }],
            selected: 3
        }

现在我正在尝试在GWT中使用图表上的setOption()方法做同样的事情。但似乎没有任何效果。

我认为我遇到了麻烦,因为buttons属性需要一系列属性,这就是我无法弄清楚如何解决的问题。

我试过的东西:

chart.setOption("/rangeSelector/buttons", 
      new String[]{"{type: 'day', count: 1, text: '1dia'}", "{type: 'day', count: 1, text: '1dia'}"});`

这是我能想到的最好的,它创建了两个空按钮而没有动作。

任何帮助将不胜感激。非常感谢你。

更新:(2012年12月13日)
在接受了答案后,我需要设置按钮。 只需使用:

buttonTheme: {
    width: 80
}

类似的东西:

rangeSelector: {
                selected: 2,
                inputBoxStyle: {
                    top: '40px',
                    right: '10px'},
                buttons: [{
                    type: 'week',
                    count: 1,
                    text: '1 semana'
                }],
                buttonTheme: {
                    width: 80
                }
            }

1 个答案:

答案 0 :(得分:4)

请你试试以下:

 String rangeSelectorConfig =  " {\n" +
            "                buttons: [{\n" +
            "                    type: 'day',\n" +
            "                    count: 3,\n" +
            "                    text: '3dias'\n" +
            "                }, {\n" +
            "                    type: 'week',\n" +
            "                    count: 1,\n" +
            "                    text: '1w'\n" +
            "                }]" +
            "            }" ;
 JSONValue config = JSONParser.parseLenient(rangeSelectorConfig);
 chart.setOption("/rangeSelector", config);

Chart类(在Configurable的帮助下)不会为您解析JSON对象,因此代码中的按钮作为字符串文字传递给本机HightCharts JS。