Highcharts'tan düğme nasıl kaldırılır

85

Highcharts kütüphanesi ile grafikler oluşturuyorum ve sağ köşedeki grafikleri yazdırıp indirebileceğiniz 2 küçük düğmeyi nasıl kaldıracağımı merak ediyorum ve yeni bir tane eklemek istiyorum.

Belki birisi bana yardım edebilir?

javascript highcharts

— Tomzi
kaynak

1

Kimlikleri veya başka şeyleri varsa onları ateş böcekleri ile inceleyin. css seçicileri kullanın ve bunlarda .remove () yöntemini çağırın.

— mas-tasarımlar

Kullanım firebug ve bu belirli düğme kimlikleri bulabilir ve css görüntülemek söyleyebiliriz: o belirli id veya sınıf için hiçbiri

— Manny

214

exporting: { enabled: false }Grafik oluşturmanıza eklemeyi deneyin .

— dgw
kaynak

Çok teşekkür ederim, işe yarıyor: D. Belki nasıl yenisini ekleyebileceğimi bilirsiniz?

— tomzi

Hayır, gerçekten yeni bir tane yaratmıyorum. Ancak yazdır / dışa aktar düğmelerinden birini değiştirebilirsiniz. Dokümantasyon, bu yönde highcharts.com/ref/#exporting-buttons ... ile oynuyor onClick.

— dgw

3

exporting: falseYeterli

— Adi Azarya

13

Yeni düğme oluşturmak için bunu kontrol edin:

Örnek: http://jsfiddle.net/fXHB5/3496/

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

— Andre Sampaio
kaynak

Bu jsfiddle artık çalışmıyor. " NetworkError : 404 Bulunamadı - highcharts.com/js/testing-exporting.js "

— gps

9

Hamburger simgesini değiştirmenin en iyi yolu, gezinme düğmesini Seçenekler'i devre dışı bırakmak, ardından kendi menünüzü oluşturmak ve belgelerde belirtildiği gibi içeriği tek tek özelleştirmektir. . Buradan, kendi açılır menünüzle istediğiniz herhangi bir simgeyi kullanabilirsiniz.

Bu, hamburger simgesini devre dışı bırakır.

navigation: {
buttonOptions: {
  enabled: false
  }
 }

Kendi listeniz için dışa aktarma seçeneklerini bu şekilde özelleştirebilirsiniz.

$('#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

— Christopher R.
kaynak

2

Teşekkürler dostum, bu 6 yıl sonra hamburger simgesini dışa aktarmayı devre dışı bırakmadan gizlemeye yardımcı oldu;)

— b1919676

bu düzeltmenin aynı zamanda x ekseni etiketleri (varsa) için değişiklik seçimini de kaldırdığını unutmayın

— danday74

Obrigado, ajudou piç. nesse exemplo ta foltando o "viewfullscrean" için daha fazla öge estiver precisando jsfiddle.net/BlackLabel/1ga2fqL0

— Paulo Victor

feliz por poder ajudar!

— Christopher R.

7

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

Yalnızca contextButton'ı devre dışı bırakmanız gerekir.

— Ivan Ruski
kaynak

1

exporting:false,

Dışa aktarma seçeneğini devre dışı bırakmak için yukarıdaki kodu ekleyin.

— Sasikumar
kaynak

0

@dgw'nin dışa aktarma düğmelerini kaldırmak için doğru fikri var, ancak düğmeleri grafiğin dışında yapmam gerektiğini anlayana kadar "ve yeni bir tane eklemek istiyorum" önerilerinden memnun değildim . Verileriniz statik olmadığı sürece, kontrollerinizi görüntülemek için yer olup olmadığını gerçekten bilemezsiniz.

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

— Dan Ross
kaynak

0

Diğer seçenek şudur: İhtiyacınız yoksa, "node_modules / highcharts / module / export.js" içeri aktarımını tüm projeden kaldırabilirsiniz.

Bu benim için bir çözümdü!

— Renat Gatin
kaynak

0

Bunu yapmanın en iyi yolu, exporting.buttons.contextButton.menuItemsdiziyi yalnızca istediğiniz menü öğelerini içerecek şekilde güncellemektir . Aşağıda, "Grafiği Yazdır" ve "Tam Ekran Görüntüle" seçeneklerini hariç tutan bir örnek bulunmaktadır.

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

Öne çıkan grafikler örneği

— Debra Saunders
kaynak