Jak usunąć przycisk z Highcharts

Tworzę wykresy za pomocą biblioteki Highcharts i zastanawiam się, jak usunąć 2 małe przyciski w prawym rogu, z których można wydrukować i pobrać wykresy i chciałbym dodać nowy.

Może ktoś mógłby mi pomóc?

Spróbuj dodać coś exporting: { enabled: false }do generowania wykresu.

Zaznacz, aby utworzyć nowy przycisk:

Przykład: http://jsfiddle.net/fXHB5/3496/

exporting: {
    buttons: [
        {
            symbol: 'diamond',
            x: -62,
            symbolFill: '#B5C9DF',
            hoverSymbolFill: '#779ABF',
            _titleKey: 'printButtonTitle',
            onclick: function() {
                alert('click!')
            }
        }
    ]
}

Najlepszym sposobem na zastąpienie ikony hamburgera jest wyłączenie przycisku nawigacyjnego Opcje, a następnie utworzenie własnego menu i dostosowanie kontekstu jeden po drugim, zgodnie z opisem w dokumentacji . Tutaj możesz użyć dowolnej ikony z własnym menu rozwijanym.

Spowoduje to wyłączenie ikony hamburgera.

navigation: {
buttonOptions: {
  enabled: false
  }
 }

W ten sposób dostosujesz opcje eksportu dla własnej listy.

$('#print').click(function() {
chart.print();
});
$('#pdf').click(function() {
chart.exportChart({
  type: 'application/pdf',
  filename: 'my-pdf'
 });
});
$('#png').click(function() {
chart.exportChart({
  type: 'image/png',
  filename: 'my-png'
 });
});
$('#jpeg').click(function() {
chart.exportChart({
  type: 'image/jpeg',
  filename: 'my-jpeg'
 });
});
$('#svg').click(function() {
chart.exportChart({
  type: 'image/svg+xml',
  filename: 'my-svg'
 });
});

jsfiddle

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

Musisz wyłączyć tylko contextButton.

exporting:false,

Dodaj powyższy kod, aby wyłączyć opcję eksportu.

@dgw ma dobry pomysł, aby usunąć przyciski eksportu, ale nie byłem zadowolony z sugestii „i chciałbym dodać nową”, dopóki nie zdałem sobie sprawy, że powinienem umieścić przyciski poza wykresem . O ile dane nie są statyczne, tak naprawdę nie wiesz, czy jest miejsce na wyświetlanie elementów sterujących.

<div id="container" style="height: 400px; min-width: 600px"></div>
<button id="button" class="autocompare">new button</button>

Inną opcją jest: możesz po prostu usunąć import „node_modules / highcharts / modules / export.js” z całego projektu, jeśli w ogóle go nie potrzebujesz.

To było dla mnie rozwiązanie!

Najlepszym sposobem na to jest zaktualizowanie exporting.buttons.contextButton.menuItemstablicy, tak aby zawierała tylko żądane pozycje menu. Poniżej znajduje się przykład wykluczający opcje „Drukuj wykres” i „Wyświetl pełny ekran”.

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

Przykład wysokich wykresów