Upendar Srirangam

Is There Way To Show Only Left And Bottom Border And Hide Top And Right Borders For Charts

Recommended Posts

Hi,

We are a licensed user for Fusion Chatrs.

We have a requirement to hide Top and Right border for all the charts in our IPad applications (Javascript renderer)

Can you please let us know if there is any way for achieving this.

 

Appreciate the quick response on this.

 

Thanks,

Upendar

Edited by Upendar Srirangam

Share this post


Link to post
Share on other sites

Hi,

 

I'm looking for the solution of showing only bottom border.

Do you have your solution already?

 

Can anyone guide on how to do this?

 

 

 

Hi,

We are a licensed user for Fusion Chatrs.

We have a requirement to hide Top and Right border for all the charts in our IPad applications (Javascript renderer)

Can you please let us know if there is any way for achieving this.

 

Appreciate the quick response on this.

 

Thanks,

Upendar

Share this post


Link to post
Share on other sites
Guest Sumedh

Hi,

 

I'm looking for the solution of showing only bottom border.

Do you have your solution already?

 

Can anyone guide on how to do this?

 

 

 

 

 

Hi,

 

Can you please elaborate your requirement, a bit more?

 

Can you send us a screen-shot of the same?

Share this post


Link to post
Share on other sites

Hi,

 

Please see the attachment.

The top columnChart show after i have remove the border.

 

What i want to archive is remove the border except for the bottom border show in the bottom columnChart.

 

 

Hi,

 

Can you please elaborate your requirement, a bit more?

 

Can you send us a screen-shot of the same?

post-28088-0-52559600-1336635197_thumb.jpg

Share this post


Link to post
Share on other sites
Guest Sumedh

Hi,

 

Please see the attachment.

The top columnChart show after i have remove the border.

 

What i want to archive is remove the border except for the bottom border show in the bottom columnChart.

 

 

 

 

Hi,

 

To achieve this, you would need to modify your XML code accordingly.

 

Please try following XML code.

 

Ref. Code:

 

<chart yAxisMinValue='' showlimits='0' showValues='0' showPlotBorder='0' canvasBorderAlpha='0' bgAlpha='0' bgColor='FFFFFF' numDivLines='0' showBorder='0' plotGradientColor=''>

<set label='Jan' value='420' color='AD1F1F' />

<set label='Feb' value='420' color='AD1F1F' />

<trendLines>

<line startValue='0' color='000000' displayvalue=' ' />

</trendLines>

</chart>

 

Also find attached screen-shot your reference.

 

 

Hope this helps.

post-24802-0-58111600-1336645110_thumb.png

Share this post


Link to post
Share on other sites

Hi,

 

I cannot use <trendLines> to archive what i needed because my XML already have the trend line element as average value for the chart data.

 

Any other solution for this?

 

Also i would like to show bottom and left border for other chart.

 

Any solution can easily archieve both situation?

 

 

 

 

Hi,

 

To achieve this, you would need to modify your XML code accordingly.

 

Please try following XML code.

 

Ref. Code:

 

<chart yAxisMinValue='' showlimits='0' showValues='0' showPlotBorder='0' canvasBorderAlpha='0' bgAlpha='0' bgColor='FFFFFF' numDivLines='0' showBorder='0' plotGradientColor=''>

<set label='Jan' value='420' color='AD1F1F' />

<set label='Feb' value='420' color='AD1F1F' />

<trendLines>

<line startValue='0' color='000000' displayvalue=' ' />

</trendLines>

</chart>

 

Also find attached screen-shot your reference.

 

 

Hope this helps.

post-28088-0-22634700-1336704071_thumb.jpg

Share this post


Link to post
Share on other sites
Guest Sumedh

Hi,

 

I cannot use <trendLines> to archive what i needed because my XML already have the trend line element as average value for the chart data.

 

Any other solution for this?

 

Also i would like to show bottom and left border for other chart.

 

Any solution can easily archieve both situation?

 

 

 

 

 

 

Hi,

 

The trendLine applied in the above XML code is a work-around to have a border at the bottom.

 

You can have multiple trendLines on your chart.

 

It is not possible to add border on left-side and right-side of the chart.

 

Hope this helps.

Share this post


Link to post
Share on other sites

Hi,

 

i have try with the trendline work-around.

It is not working.

 

The line is not show is the value is less than 1.

 

Please help if you have other solution.

 

Thanks...

 

Hi,

 

The trendLine applied in the above XML code is a work-around to have a border at the bottom.

 

You can have multiple trendLines on your chart.

 

It is not possible to add border on left-side and right-side of the chart.

 

Hope this helps.

Share this post


Link to post
Share on other sites
Guest Sumedh

Hi,

 

i have try with the trendline work-around.

It is not working.

 

The line is not show is the value is less than 1.

 

Please help if you have other solution.

 

Thanks...

 

 

 

Hi,

 

To have a border at the bottom it is the only work-around.

 

Please try to add following configurations to have a border at the bottom of the chart.

 

Ref. Code:

 

<chart yAxisMinValue='' showlimits='0' showValues='0' showPlotBorder='0' canvasBorderAlpha='0' bgAlpha='0' bgColor='FFFFFF' numDivLines='0' showBorder='0' plotGradientColor=''>

..

<trendLines>

<line startValue='0' color='000000' displayvalue=' ' />

</trendLines>

</chart>

Share this post


Link to post
Share on other sites

Hi,

 

The work-around is working but what if I need also the left border?

 

Is there any work-around for that?

 

 

Hi,

 

To have a border at the bottom it is the only work-around.

 

Please try to add following configurations to have a border at the bottom of the chart.

 

Ref. Code:

 

<chart yAxisMinValue='' showlimits='0' showValues='0' showPlotBorder='0' canvasBorderAlpha='0' bgAlpha='0' bgColor='FFFFFF' numDivLines='0' showBorder='0' plotGradientColor=''>

..

<trendLines>

<line startValue='0' color='000000' displayvalue=' ' />

</trendLines>

</chart>

Share this post


Link to post
Share on other sites
Guest Sumedh

Hi,

 

The work-around is working but what if I need also the left border?

 

Is there any work-around for that?

 

 

 

 

Hi,

 

You can get border on the left side of the chart using vLine attribute.

 

Please note, it is a work-around to have a border on the left-side of the chart.

 

vLines are vertical separator lines that help you separate blocks of data.

 

Ref. Code:

 

<chart yAxisMinValue='' showlimits='0' showValues='0' showPlotBorder='0' canvasBorderAlpha='0' bgAlpha='0' bgColor='FFFFFF' numDivLines='0' showBorder='0' plotGradientColor=''>

<set label='' value='' color='' />

<vLine color='00000' thickness='2'/>

<set label='' value='' color='' />

<set label='Jan' value='420' color='AD1F1F' />

<set label='Feb' value='420' color='AD1F1F' />

<trendLines>

<line startValue='0' color='000000' displayvalue=' ' />

</trendLines>

</chart>

 

Please find attached screen-shot for your reference.

post-24802-0-44630200-1337675944_thumb.png

Share this post


Link to post
Share on other sites

Hi,

 

i have issue to use trend line as work-around to show left border in StackedBar2D and Bar2D.

 

In attached image below, the left side is the outcome with the xml show in the text file.

But i would like to achieve what chart the show in the right hand side.

 

 

Plese help and thanks in advanced.

 

 

Hi,

 

You can get border on the left side of the chart using vLine attribute.

 

Please note, it is a work-around to have a border on the left-side of the chart.

 

vLines are vertical separator lines that help you separate blocks of data.

 

Ref. Code:

 

<chart yAxisMinValue='' showlimits='0' showValues='0' showPlotBorder='0' canvasBorderAlpha='0' bgAlpha='0' bgColor='FFFFFF' numDivLines='0' showBorder='0' plotGradientColor=''>

<set label='' value='' color='' />

<vLine color='00000' thickness='2'/>

<set label='' value='' color='' />

<set label='Jan' value='420' color='AD1F1F' />

<set label='Feb' value='420' color='AD1F1F' />

<trendLines>

<line startValue='0' color='000000' displayvalue=' ' />

</trendLines>

</chart>

 

Please find attached screen-shot for your reference.

post-28088-0-69106500-1338782305_thumb.jpg

trendlineInStackedBarChart.txt

Share this post


Link to post
Share on other sites

Hi,

 

the shadow line is too thick, is it possible to make it about 1pixel?

 

 

Hey,

 

Try adding shadow style element to the canvas object, to obtain only the left border for the Bar charts.

 

Please find the updated XML file attached.

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi,

 

Yes, you can modify the style applied to CANVAS object as per your requirement.

 

To reduce the shadow line thickness, please try by applying "distance" attribute to "1" in the <style> element of your XML data.

 

Please find the attached screen shot of the same for your reference.

 

For more information on "Shadow Style Type", please follow the link below:

http://docs.fusioncharts.com/charts/contents/?Styles/Shadow.html

 

In case if you are required to show the Y-Axis as well as X-Axis line for Stacked Bar 2D Chart, you can achieve this by applying styles to CANVAS object, as per the attached XML.

 

Hope this helps!

post-23588-0-18520600-1338958675_thumb.png

BarchartWithOnlyXaxis_and_Y-Axis.xml

Share this post


Link to post
Share on other sites

Hi,

 

Thanks for help.

It is look great in IE but not in FireFox.

 

please see the attached image. left hand side is render by IE and right hand side is render by FireFox.

The left border which use shadow as work around is not working for FireFox.

 

Anything i miss out?

 

Thanks in advanced.

 

 

Hi,

 

Yes, you can modify the style applied to CANVAS object as per your requirement.

 

To reduce the shadow line thickness, please try by applying "distance" attribute to "1" in the <style> element of your XML data.

 

Please find the attached screen shot of the same for your reference.

 

For more information on "Shadow Style Type", please follow the link below:

http://docs.fusionch...les/Shadow.html

 

In case if you are required to show the Y-Axis as well as X-Axis line for Stacked Bar 2D Chart, you can achieve this by applying styles to CANVAS object, as per the attached XML.

 

Hope this helps!

post-28088-0-18626200-1339402649_thumb.jpg

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi,

 

We are not able to replicate the issue from our end.

 

Please find the attached screen shot of the chart rendered using my attached XML file (BarchartWithOnlyXaxis_and_Y-Axis.xml), in Firefox browser.

 

Hope this helps!

post-23588-0-38690000-1339412116_thumb.png

Share this post


Link to post
Share on other sites

Hi,

 

will it cause by the FireFox version?

I'm using 13.0 and I found there are some different for the chart you render compare to mine.

From your attached image, i saw the "FusionChart Trials" word is at the top but for my version, it is show at the bottom with the word '"FusionCharts" (see attachment).

 

 

Please help.

 

Thanks in advance.

 

 

Hi,

 

We are not able to replicate the issue from our end.

 

Please find the attached screen shot of the chart rendered using my attached XML file (BarchartWithOnlyXaxis_and_Y-Axis.xml), in Firefox browser.

 

Hope this helps!

post-28088-0-08266700-1339473951_thumb.jpg

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

The difference is that one is a Flash chart and the other is a JavaScript chart.

 

The one with 'FusionCharts Trial' at the top left corner is the Flash chart and the one with 'FusionCharts' at the bottom right corner is the JavaScript chart.

 

Hope this clarifies.

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

Also, please note that the JavaScript charts support only font style formatting and does not support any other styles.

 

Hope this helps!

Edited by Bindhu

Share this post


Link to post
Share on other sites

Hi,

 

So is it mean Flash Chart in FireFox cannot render the shadow? So I can't see the left border which using shadow as work around in FireFox?

 

 

 

 

Hi,

 

Also, please note that the JavaScript charts support only font style formatting and does not support any other styles.

 

Hope this helps!

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

No, not Flash charts but JavaScript charts. JavaScript charts does not support any other style formatting but font style format.

 

Hope I am able to clarify.

Share this post


Link to post
Share on other sites

Hi,

 

Need more information.

But why in IE, the JavaScript chart is able to render the shadow?

 

I have try run the application in IE8, FireFox v12.0 and FireFox v13.0.

IE8 and FireFox v12.0 able to show the shadow but FireFox v13.0 unable to show the shadow.

 

 

Please help.

Thanks.

 

Hi,

 

No, not Flash charts but JavaScript charts. JavaScript charts does not support any other style formatting but font style format.

 

Hope I am able to clarify.

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

JavaScript and HTML5 are browser dependent features and every browser has certain differences in the way they handle implementation of HTML5 support.

 

Hence, however hard we try to bridge the difference, there is still a likelihood of minor differences to be encountered when comparing the same chart configuration on various browsers.

 

In JavaScript charts, only font, color, size, bold and italic attributes are supported. Support for rest of the attributes is browser specific.

 

Hope this clarifies.

Share this post


Link to post
Share on other sites

Hi,

 

Thanks.

So do we have another work-around to render only the left border for barchart instead of using shadow?

 

 

Please help.

Thanks in advance.

 

Hi,

 

JavaScript and HTML5 are browser dependent features and every browser has certain differences in the way they handle implementation of HTML5 support.

 

Hence, however hard we try to bridge the difference, there is still a likelihood of minor differences to be encountered when comparing the same chart configuration on various browsers.

 

In JavaScript charts, only font, color, size, bold and italic attributes are supported. Support for rest of the attributes is browser specific.

 

Hope this clarifies.

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

I am afraid, we do not have any known work around for this, as of now.

Share this post


Link to post
Share on other sites

Hi,

 

One more question, FireFox v13.0 is the newest version and cannot show the shadow style.

It is due to JavaScriptChart and HTML5 right?

 

Can we force it to use FlashChart?

 

 

:)

Share this post


Link to post
Share on other sites
Guest Bindhu

Hi,

 

Yes, it is because of the HTML5 or the JavaScript charts.

 

You may try using Flash charts instead.

 

Hope this helps!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now