13

我想在 highchart 导出选项中隐藏默认按钮（“导出”和“打印”）。

您可以在http://jsfiddle.net/fXHB5/3496/上进行演示， 在此链接中有 3 个按钮 1. 自定义按钮 2. 导出按钮 3. 打印按钮。

在这种情况下，我只想显示第一个按钮并隐藏“导出按钮”和“打印按钮”

4

6 回答 6

19

您可以通过以下方式访问每个按钮首选项：

exporting: {
    buttons: {
        printButton: {
            symbol: 'circle'
        },
        exportButton: {
            enabled: false
        }    
    }
}

带有自定义按钮的可扩展示例是：

exporting: {
    buttons: {
        printButton: {
            enabled: false
        },
        exportButton: {
            enabled: false
        },
        custom: {
            symbol: 'diamond',
            x: -62,
            symbolFill: '#B5C9DF',
            hoverSymbolFill: '#779ABF',
            _titleKey: 'printButtonTitle',
            onclick: function () {
                alert('click!')
            }
        }
    }
}
于 2012-04-29T21:12:59.827 回答
19

对于使用较新版本的 highcharts 并且所选答案不起作用的其他任何人，您需要使用以下内容来隐藏按钮。

exporting: {
        buttons: {
            contextButton: {
                enabled: false
            }    
        }
    }
于 2015-11-26T16:23:41.207 回答
6

这是不可能的，但您可以隐藏默认按钮，然后使用 html 创建自己的按钮。然后，您可以根据需要绑定自定义按钮。

var chart = new Highcharts.Chart({

    chart: {
        renderTo: 'container'
    },

    credits: {
        enabled: false
    },

    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
    }],
        exporting: {
            enabled: false
        }
    });

console.log( Highcharts.Renderer.prototype.symbols )​
于 2012-04-29T21:07:24.100 回答
0

如果你只想隐藏默认的自定义按钮，你可以简单地使用：

exporting: {
      buttons: {
        contextButton: {
          enabled: false
        },
        printButton: {
            enabled: false,
        },
      }
    }

如果您想使用自己的自定义按钮或标签，可以使用：

exporting: {
      buttons: {
        contextButton: {
          enabled: false
        },
        exportButton: {
            text: `Chrome`,
            _titleKey: "yourKey",
            onclick:function(){
            alert('clicked Chrome');
            },
            x:-410
        },

        printButton: {
            enabled: false,
            text: `IE: `,
             _titleKey:"myKey",
            onclick: function () {
                alert('clicked IE');
            },
            x:-400,
            y:30
        },          
      }
    },

在此我禁用了默认值以及 printButton，您可以使用 x 和 y 设置标签的位置。你可以在这里找到我的代码：https ://jsfiddle.net/m3yegczx/20/

于 2018-09-12T10:40:12.300 回答
0

如果您使用的是框架，那么您可以通过这种方式隐藏。

    HIOptions *options = [[HIOptions alloc]init];
    HIExporting *exporting = [[HIExporting alloc]init];
    exporting.enabled = [[NSNumber alloc] initWithBool:false];
    options.exporting = exporting;
于 2018-12-19T06:59:11.420 回答
0

至于当前的highcharts（7.2.1），您可以通过设置下面的选项来隐藏它们

exporting: {
    buttons: {
        contextButton: {
            menuItems: ["downloadPNG", "downloadJPEG", "downloadPDF", "downloadSVG"]
        }
    }
}

在https://api.highcharts.com/highcharts/exporting.buttons.contextButton.menuItems检查 API

于 2019-11-15T05:06:11.053 回答