X- axis Labels overlapped in JS charts And Tinier charts in JS

[jitesh]

We observed the overlap issue in JS charts when the Locale is set to an Asian language. The Flash version handled it well.

 

Please see the 4 screen shots (2 sets of comparisons). These will show you both the issues: overlapping x-axis labels as well as the tinier charts in JS with unnecessary and unused white space.

 

 

Here's the xml:

 

<graph animation='0' labeldisplay='WRAP' canvasbgcolor='#FFFFFF' canvasborderthickness='1' chartleftmargin='5' showborder='0' bgcolor='#FFFFFF' yaxisnamepadding='0' chartbottommargin='0' divlinealpha='10' legendpadding='0' chartrightmargin='35' formatnumberscale='0' yaxisname=' (USD) ' xaxisname='时间' formatnumber='1' decimals='2' forcedecimals='1' yaxismaxvalue='140.0' yaxisminvalue='0.0' numdivlines='13' xaxismaxvalue='1395793441000' xaxisminvalue='1395375766000' adjustdiv='0' setadaptiveymin='1' legendborderalpha='0' legendshadow='0' legendborderthickness='0' showtooltip='1' showhovercap='1' outcnvbasefont='Dialog' outcnvbasefontsize='10' decimalseparator='.' showalternatehgridcolor='0' thousandseparator=',' anchorsides='4' drawanchors='1' labelstep='5' linethickness='1’>
<categories verticallinecolor='666666' verticallinethickness='1' verticallinealpha='10’>
<category showverticalline='1' x='1395375766000' label='2014年3月20日下午 09:22'></category>
<category x='1395403611000' label='2014年3月21日上午 05:06'></category>
<category x='1395431456000' label='2014年3月21日下午 12:50'></category>
<category x='1395459301000' label='2014年3月21日下午 08:35'></category>
<category x='1395487146000' label='2014年3月22日上午 04:19'></category>
<category showverticalline='1' x='1395514991000' label='2014年3月22日下午 12:03'></category>
<category x='1395542836000' label='2014年3月22日下午 07:47'></category>
<category x='1395570681000' label='2014年3月23日上午 03:31'></category>
<category x='1395598526000' label='2014年3月23日上午 11:15'></category>
<category x='1395626371000' label='2014年3月23日下午 06:59'></category>
<category showverticalline='1' x='1395654216000' label='2014年3月24日上午 02:43'></category>
<category x='1395682061000' label='2014年3月24日上午 10:27'></category>
<category x='1395709906000' label='2014年3月24日下午 06:11'></category>
<category x='1395737751000' label='2014年3月25日上午 01:55'></category>
<category x='1395765596000' label='2014年3月25日上午 09:39'></category>
<category showverticalline='1' x='1395793441000' label='2014年3月25日下午 05:24'></category>
</categories>
<dataset drawline='1' anchorbgcolor='#000000' linealpha='100' color='#000000' seriesname='领先价格’>
<set tooltext='$90.00 USD{br}2014年3月20日下午 09:23{br}领先价格' y='90.0' x='1395375826000'></set>
<set tooltext='$85.00 USD{br}2014年3月25日上午 10:56{br}领先价格' y='85.0' x='1395770199000'></set>
</dataset>
<dataset drawline='1' anchorbgcolor='#00FFFF' linealpha='100' color='#00FFFF' seriesname=‘'>
<set tooltext='$93.00 USD{br}2014年3月25日下午 05:23{br}China Won Human R...' y='93.0' x='1395793380000'></set>
</dataset>
<dataset drawline='1' anchorbgcolor='#A52A2A' linealpha='100' color='#A52A2A' seriesname=‘'>
<set tooltext='$90.00 USD{br}2014年3月20日下午 09:23{br}ServerTech Inc. (...' y='90.0' x='1395375826000'></set>
</dataset>
<dataset drawline='1' anchorbgcolor='#C0C0C0' linealpha='100' color='#C0C0C0' seriesname=‘'>
<set tooltext='$85.00 USD{br}2014年3月25日上午 10:56{br}Digi Storage (Ter...' y='85.0' x='1395770199000'></set>
</dataset>
<dataset drawline='1' linealpha='100' color='#FF00FF' anchoralpha='0' seriesname='保留价格’>
<set y='20.0' x='1395375766000'></set>
<set y='20.0' x='1395793441000'></set>
</dataset>
<dataset drawline='1' linealpha='100' color='#0000FF' anchoralpha='0' seriesname='封顶价格’>
<set y='100.0' x='1395375766000'></set><set y='100.0' x='1395793441000'></set>
</dataset><dataset drawline='1' linealpha='100' color='#FF0000' anchoralpha='0' seriesname='历史价格’>
<set y='120.0' x='1395375766000'></set>
<set y='120.0' x='1395793441000'></set>
</dataset>
</graph>

[Swarnam]

Hi Jitesh,

The issue of overlapping labels in JS charts is due to the space character included in the label attribute. 

As a workaround, can you please try rendering the chart by removing the space in the label attribute of category element?