Mám problém, kdy se popis Highcharts překrývá s grafem samotným. Najdete prosím následující obrázek, který zobrazuje to samé:

Když je LS aktivní:

Popisek Highcharts se překrývá grafem

Když je LS deaktivován

Highcharts funguje dobře, když LS není aktivní

(Měřítko obou grafů se liší, protože nastavuji dynamickou výšku grafu pomocí $ (window) .height (), který nebyl „opraven Salesforce , přestože je LS aktivní.)

Kód:

Pomocník:

drawChart : function(component, helper) { if(component.isValid() && component.get("v.isResourcesLoaded") && component.get("v.isDataChanged")) { var stackedColumnChartObj = new Highcharts.Chart({ chart: { renderTo: component.find("stackedColumnChart").getElement() }, title: { text: null }, xAxis: { categories: labelList, title: { text: null }, labels: { enabled: true, format: "`{value}" } }, yAxis: [{ enabled: true, title: { text: null } }], plotOptions: { series: { animation: false, cursor: "pointer", marker: { enabled: false } } }, tooltip: { useHTML: true, borderWidth: 0, borderRadius: 0, backgroundColor:"rgba(255,255,255,0)", shadow: false, formatter: function(){ var s = this.series.name + ": "+ "<br/>Total: " +this.stackTotal; return ("<div class="tooltip">" + s + "</div>"); }, enabled: !component.get("v.isDrillDown") }, credits: { enabled: false }, series: columnDataList }); } 

Renderer:

({ afterRender: function(component, helper) { this.superAfterRender(); }, rerender: function(component, helper) { this.superRerender(); helper.drawChart(component, helper); } }) 

CSS: –

.THIS .highcharts-tooltip span .tooltip{ z-index:999999999 !important; border: 1px solid; background-color: white; padding:5px; border-radius: 4px; } 

Tento problém se nevyskytuje, když je služba skříňky deaktivována. Ale chci, aby to fungovalo perfektně, když je LS deaktivován. Bylo by velmi užitečné, kdyby k tomu někdo mohl poskytnout jakékoli postřehy.

Upravit: Podle Pawela „Návrh jsem vykreslil popisek jako HTML (výše jsem upravil inicializační kód Highcharts). Popisek se vykresluje v simulátoru zařízení Chrome. V iPadu a iPhonu ale po kliknutí na graf vyvolá následující chyby:

TypeError: null není objekt (hodnocení „e.call“)

TypeError: undefined is not an object (evaluating „charts [H.hoverChartIndex] .mouseIsDown“)

Komentáře

  • Může to být hloupá otázka, ale co kdybyste pomocí css vytvořili z-index 10 000 nebo něco velkého, abyste jej dostali dopředu ?? Trochu hacky …
  • Děkujeme za návrh @Eric. Ale bohužel to nefunguje ' t, protože Highcharts vykreslí popisek a grafy jako svg prvky. Takže si myslím, že je potřeba ' s přeskupení (které používá JS), aby se to dostalo dopředu. Tento problém také není přítomen, když je deaktivována služba Locker Service. I ' m čelím tomuto problému, když je aktivována služba Locker Service.
  • Ahoj @ PawełFus Tento problém byl vyřešen v nejnovější stabilní verzi Highcharts i v Oprava Salesforce ' s Winter ' 17 12.1. Také staré vydání chyby 16 stále přichází v nejnovější stabilní verzi. salesforce.stackexchange.com/questions/147917/…
  • to je skvělé slyšet! Pokud jde o problém č. 16 – komponenta vždy načte Highcharts. Highcharts by měly být načteny pouze jednou.
  • Ahoj @ PawełFus Jen rychlá aktualizace, chyba Highcharts Error # 16 je přítomna v prohlížeči Microsoft Edge v systému Windows Desktop.

Napsat komentář

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *