Highcharts - HTML araç ipucu & datalabels sorunu oluşturuyor

Question

Burada, benim problemim, useHTML'yi ayarladığınızda: datalabels için true, etiket metni araç ipucu arka planını geçersiz kılacak gibi görünüyor. Bir çubuğun üzerinde fare üzerinde bir araç ipucu görüntülemek için bar chart

deneyin ve ipucu arka planda datalabel metnini göreceksiniz:

Bu basit keman davranışı görebilirsiniz.

Veri etiketlerinde bir z-dizini ayarlamak mümkün müdür?

ben ipucu tanımında ancak başarılı olamadı bu eklemeyi denedim:

style : { 
    color: 'black', 
    'z-index': 0 
    }, 

Ben de o zaman css içine z-index ekleyin veri etiket ve araç ipuçları için yayılma sınıfları kurmaya çalıştık

Bu sınıfların özellikleri, ancak hala çalışmıyor.

Düzenleme: Sorunuma hala bir çözüm ararken, birisi bana grafiklerin çubuklarına (veya veri etiketlerine) bir sınıf ekleme yolunu gösterebilir mi? Amacım bu sınıfta belirli bir onclick olayı aramaktır. Araç ipucu arka planı rengi için http://api.highcharts.com/highcharts#tooltip.backgroundColor işaretleyin.

Answer 1

Tamam bu özelliğiyle çözüldü benim sorun için bir çözüm olduğunu ... Fikir kendi özel araç ipucunu oluşturmaktır.

çözüm Highcharts forumunda verildi: Highcharts forum post

Bunun için, biçemleyicileri fonksiyonlarda araç ipuçları ve kurulum CSS sınıfları bazı varsayılan özelliklerini kaldırın datalabels ve araç ipuçları hem 'useHTML' özelliğini ayarlayın :

//JS 
datalabels: { 
    ... 
    useHTML: true, 
    formatter: function() { 
     return ("<span class='datalabel'>" + this.y + "</span>"); 
    } 
} 

tooltip: { 
    ... 
    borderWidth:0, 
    borderRadius:0, 
    shadow:false, 
    useHTML: true, 
    formatter: function() { 
     return ("<div class='tooltip'>" + this.y + "</div>"); 
    } 
} 

son adım (en önemli) (HTML ipuçları işlemek için Highcharts tarafından kullanılır) Highcharts-ipucu span class için CSS kurallarını kurmaktır.

//CSS 
.highcharts-tooltip span { 
    background-color:white; 
    z-index:9999!important; 
} 

Bildirim ipucu datalabel üzerinde işlemek sağlayacak bir özelliktir Z-endeksi özelliği,.

Artık 'araç ipucu' sınıfı için CSS kuralları belirleyerek araç ipucunuzu özelleştirebilirsiniz. Custom tooltip

Not: Tam Canlı Örneğin

, burada jsfiddle bkz O eserlere bu çözüm için biçimlendiricisine datalabel sınıfını specificy zorunlu değildir, sadece bu yüzden belirli bir fare kayıt olabilirsiniz gerek olayda.

Answer 2

.

Aynı tür sorun, işte highslide forum