Ext JS Chart legend item alignment

Question

I have an issue with chart legend item alignment. I need to place it horizontally. But by it showing vertically. Is there any way to change it in horizontally.

This problem happen in EXT JS 5. Up to 4 it showing vertically by default.

Thanks in advance.

Answer 1

Add one custome tpl and specify float

   <div class="x-legend-container">
<tpl for=".">
<div class="x-legend-item" style="float:left;margin:5px;padding:0px;cursor:pointer;">
<span class="x-legend-item-marker {[ values.disabled ? Ext.baseCSSPrefix + 'legend-inactive' : '' ]}" 
style="background:{mark};">
</span>{name}
</div>
</tpl>
</div>