Multiple Striplines - labels are overlapping

Question

Please check the below screenshot. When I have multiple striplines with very short distance, the labels are overlapping.

https://i.imgur.com/h5uL8g9.png

Is there any way to hide the labels and show them on hover? Or any other solution can avoid the above problem would be very helpful.

Thanks

Durga Gopalakrishnan · Answer

Hi Stephen, 

Greetings from Syncfusion. 

We request you to customize the stripline text by changing the verticalAlignment for text which is overlapping with one another. We have prepared sample as per attached image and changed the alignment position to avoid overlap.  





public primaryYAxis: Object = { 
        stripLines: [ 
            { 
                start: 30, verticalAlignment: 'Start', 
            }, { 
                start: 31, verticalAlignment: 'End', 
            } 
        ] 
    }; 

  

Sample : https://stackblitz.com/edit/angular-b7akyn 

UG : https://ej2.syncfusion.com/angular/documentation/chart/strip-line/#customize-the-stripline-text 

Kindly revert us if the provided solution doesn’t meet your requirement. 

Regards, 
Durga G