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?
javascript
highcharts
tomzi
źródło
źródło
Odpowiedzi:
Spróbuj dodać coś
exporting: { enabled: false }
do generowania wykresu.źródło
onClick
.exporting: false
wystarczyZaznacz, 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!') } } ] }
źródło
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
źródło
exporting: { buttons: { contextButton: { enabled: false } } }
źródło
exporting:false,
Dodaj powyższy kod, aby wyłączyć opcję eksportu.
źródło
@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>
źródło
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!
źródło
Najlepszym sposobem na to jest zaktualizowanie
exporting.buttons.contextButton.menuItems
tablicy, 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
źródło