Printing In Firefox In Fusion Charts V 3.2 Still Clips At The End

[hjavali]

I am using Fusion Charts 3.2 and using print manager to print charts. Prints are much better compared to previous versions of fusion charts in firefox. However the charts are still clipped off at the end especially when I user 100% for width.

 

Here are the details of my environmetn and code:

 

I am using VB.NET

 

I include FusionCharts.js in my aspx file.

ltlPr and LtlPrint are the two literals.

 

Following is my code in code behind: (note that sXmlData contains the xml string for the chart.)

 

ltlPr.Text = FusionCharts.EnablePrintManager()

ltlPrint = FusionCharts.RenderChart("FusionCharts/Column3D.swf", "", sXmlData, "myNext", "100%", "300", false, true)

 

 

 

 

 

 

If I change parameter 5 (width) to specific number of pixels, say 600, prints are fine. But specifying 100% clips the border if the chart at the end when printed from firefox.

 

 

 

Any help is highly appreciated.

[Guest Rajroop]

Hello there,

 

After some testing on this, we could not replicate this issue in our Labs.

 

Could you please share an image of the error you are encountering here? Additionally, please do post the relevant complete codes used.

 

I look forward to the same.

[heidemeister]

I have the same problem (I think). Got a chart with width=100%, which when shown on screen amounts to 940px. When printed with Firefox the chart is chopped over because its too wide for the paper.

 

I have noticed that the html5 canvas element the print manager creates gets width=940, not width=100%. Maybe thats why the chart does not scale to fit when printed? Is there any way to get the same scaling of the printed chart as in Internet Explorer? (I can't believe there's actually something IE does better than another browser :S)

 

 

-michael christensen

[Guest Angshu]

Hi,

 

Welcome to FusionCharts Forum!

 

First of all, we would like to thank you for showing interest in FusionCharts.

 

Could you please send us the code and a screenshot to look into the issue?

 

Awaiting for your response.

[heidemeister]

Hi,

 

Welcome to FusionCharts Forum!

 

First of all, we would like to thank you for showing interest in FusionCharts.

 

Could you please send us the code and a screenshot to look into the issue?

 

Awaiting for your response.

 

I've been working on other things and had almost forgot about this, but now i'm back to working on our charts. Still have the same problem. We're using GWT, and creating the charts with native javascript code from a java file. It looks something like this:

 

 // Print for Mozilla/WebKit/Gecko based browsers (like Firefox, Safari etc.)
   $wnd.FusionCharts.printManager.configure( { enabled: true, message : 'wait please...'} );
   $wnd.FusionCharts.printManager.enabled(true);

   var chart1 = new $wnd.FusionCharts(
     {
         swfUrl : "../fusionChart/" + chartType + ".swf"
         ,id : graphId+"ID"
         ,width : width
         ,height: height
         ,renderAt: graphId
         ,dataFormat: "xml"
         ,dataSource:dataXML
//          ,debugMode: "1"
     }
   );

 

height is fixed at 300px, width is "100%".

 

The resulting html (copied from Firebug) looks like this:

 

    <object width="100%" lang="EN" height="250" type="application/x-shockwave-flash"
   class="FusionCharts" data="../fusionChart/StackedColumn3D.swf" id="PrognoseGrafID"
   style="visibility: visible;" xml:lang="EN">
     <param name="scaleMode" value="noScale" />
     <param name="scale" value="noScale" />
     <param name="wMode" value="opaque" />
     <param name="allowScriptAccess" value="always" />
     <param name="quality" value="best" />
     <param name="flashvars" value="lang=EN&debugMode=undefined&dataXML=%3Cchart%20labelDisplay%3D'Wrap'%20bgColor%3D'EEEAE4'%20bgAlpha%3D'100'%20showBorder%3D'0'%20borderThickness%3D'0'%20canvasbgColor%3D'EEEAE4'%20canvasBorderColor%3D'cccccc'%20canvasBorderThickness%3D'0'%20showCanvasBg%3D'1'%20canvasBgDepth%3D'2'%20showCanvasBase%3D'1'%20canvasBaseDepth%3D'3'%20caption%3D'Udbetalingsplan%20for%20din%20pension%20(f%C3%B8r%20skat)'%20plotGradientColor%3D''%20showPlotBorder%3D'0'%20useRoundEdges%3D'0'%20showLabels%3D'1'%20numDivLines%3D'4'%20showAlternateHGridColor%3D'0'%20divLineIsDashed%3D'1'%20divLineDashLen%3D'1'%20divLineDashGap%3D'2'%20divLineColor%3D'8f9984'%20showToolTipShadow%3D'1'%20toolTipBorderColor%3D'666666'%20toolTipBgColor%3D'edeae4'%20chartRightMargin%3D'5'%20chartLeftMargin%3D'1'%20chartTopMargin%3D'5'%20chartBottomMargin%3D'5'%20enableSmartLabels%3D'0'%20smartLineThickness%3D'0'%20smartLineAlpha%3D'0'%20legendPosition%3D'RIGHT'%20legendBgColor%3D'e5e1d8'%20legendBorderColor%3D'666666'%20legendShadow%3D'1'%20legendMarkerCircle%3D'1'%20formatNumber%3D'1'%20formatNumberScale%3D'1'%20numberScaleValue%3D'1000'%20numberScaleUnit%3D'%20'%20decimalSeparator%3D'%2C'%20thousandSeparator%3D'.'%20decimals%3D'0'%20sYAxisValuesDecimals%3D'2'%20connectNullData%3D'0'%20showPrintMenuItem%3D'1'%20shownames%3D'0'%20listRowDividerAlpha%3D'0'%20colorBoxWidth%3D'50'%20colorBoxHeight%3D'20'%20textVerticalPadding%3D'20'%20animation%3D'1'%20yAxisName%3D'Bel%C3%B8b%20i%201.000%20kr.'%20xAxisName%3D'%C3%85r'%3E%3Ccategories%3E%3Ccategory%20label%3D'46'%2F%3E%3Ccategory%20label%3D'65'%2F%3E%3Ccategory%20label%3D'66'%2F%3E%3Ccategory%20label%3D'67'%2F%3E%3Ccategory%20label%3D'68'%2F%3E%3Ccategory%20label%3D'69'%2F%3E%3Ccategory%20label%3D'70'%2F%3E%3Ccategory%20label%3D'71'%2F%3E%3Ccategory%20label%3D'72'%2F%3E%3Ccategory%20label%3D'73'%2F%3E%3Ccategory%20label%3D'74'%2F%3E%3Ccategory%20label%3D'75'%2F%3E%3Ccategory%20label%3D'76'%2F%3E%3Ccategory%20label%3D'77'%2F%3E%3Ccategory%20label%3D'78'%2F%3E%3Ccategory%20label%3D'79'%2F%3E%3Ccategory%20label%3D'80'%2F%3E%3Ccategory%20label%3D'81'%2F%3E%3Ccategory%20label%3D'82'%2F%3E%3Ccategory%20label%3D'83'%2F%3E%3Ccategory%20label%3D'84'%2F%3E%3Ccategory%20label%3D'85'%2F%3E%3Ccategory%20label%3D'86'%2F%3E%3Ccategory%20label%3D'87'%2F%3E%3Ccategory%20label%3D'88'%2F%3E%3Ccategory%20label%3D'89'%2F%3E%3Ccategory%20label%3D'90'%2F%3E%3C%2Fcategories%3E%3Cdataset%20seriesName%3D'PFA'%20color%3D'B30838'%20showValues%3D'0'%3E%3Cset%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'886898.330579310613112742971220'%20tooltext%3D'886.898%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3Cset%20value%3D'95218.999127507819560517750500'%20tooltext%3D'95.219%20kr.'%2F%3E%3C%2Fdataset%3E%3Cdataset%20seriesName%3D'L%C3%B8n'%20color%3D'B1D34B'%20showValues%3D'0'%3E%3Cset%20value%3D'1012800.00'%20tooltext%3D'1.012.800%20kr.'%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3Cset%2F%3E%3C%2Fdataset%3E%3C%2Fchart%3E&DOMId=PrognoseGrafID&registerWithJS=1&chartWidth=100%&chartHeight=250&InvalidXMLText=Invalid data.&dataURL=" />
   </object>
<canvas class="FusionCharts" width="940" height="250"></canvas>

 

The interesting thing here is that on the flash object the width is 100%, but on the hidden canvas the width is 940px (which is the width of the page). If the canvas is the element that Firefox uses for print, then this might be the problem.

[heidemeister]

Update:

 

Placing this in my print stylesheet fixes the problem (although I still think that it shouldn't be nescessary):

 

.FusionCharts {

width: 100% !important;

}

[Guest Angshu]

Hi,

 

Thank you very much for your valuable feedback.

 

We are glad to know that you have managed to resolve your issue.

 

Happy FusionCharting!