Search the Community

Hello, I programmed an html page with a map of Spain with provinces (see attached files - please add the fusion map libraries). The render mode is javascript and I want to show a value for each province in the map. As indicated in docs.fusioncharts.com/maps/Contents/MapSS/SpainProvinces.html, there is 52 provinces, so the xml will have a maximum of 52 provinces. As we want to show a value in each province, we will have a xml with 52 entities (see attached file). It happens somewhat the reported in this topic: forum.fusioncharts.com/topic/13835-worldwithcountries-render-mode-javascript-bug/ With 51 entities it is shown correctly in the map - except for one province, the province I comment. With 52 entities, the first entity of the xml is not shown (Albacete is this case), but the rest is ok. With 53 entities, the second entity of the xml is not shown, but the rest is ok. It seems like this map admits only 51 entities in the xml, but the number of provinces is 52. Is this a bug or I'm missing something? Thank you very much John fm.html

Hi, I am using FusionWidgets XT (v3.3.1 - Service Release 2) (28th May, 2013) with Ruby on Rails version 3.0.19, Ruby version 1.9.2-p290 (for more details, please reference forum topic: http://forum.fusioncharts.com/topic/15081-server-side-export-javascript-rendered-gantt/) When i try to export a javascript Gantt chart, the SVG sent back to the server has zero-width task bars. So when I transcode the SVG to PNG using Batik, the task bars are missing from the rendered image. These are the attributes for my chart. Note that I must set taskBarFillMix to an empty string so that Batik does not choke on gradients. <chart dateFormat="yyyy/mm/dd" outputDateFormat="mm/dd/yyyy" showTaskLabels="0" showPercentLabel="0" showSlackAsFill="0" useVerticalScrolling="1" manageResize="1" animation="1" exportEnabled="1" exportShowMenuItem="0" exportHandler="/downloads/gantt" html5ExportHandler="/downloads/gantt" taskBarFillMix="" taskBarFillRatio=""> attributes for my task bars <task start="#{start_date}", end="#{end_date}" label="#{task_name}" color="#b2c8d9" processId="#{proc_name}" link="#{task_url}" Some of my gantt charts have grouped tasks and those attributes are <task start="#{start_date}" end=>"#{end_date}" label="#{group_name}" color="#000000" processId="#{proc_name}" showAsGroup=1 showLabel=0 topPadding="70%" showStartDate=1 showEndDate=1 /> Ruby on Rails controller class DownloadsController < ApplicationController def gantt # grab only SVG. Drill down charts may wrap SVG in HTML svg_match = params[:stream].to_s.match(/<svg.*<\/svg>/) svg_text = svg_match[0] rescue params[:stream].to_s # fix invalid attribute values coming from FusionChart SVG svg_text.gsub!(/text-anchor=\"undefined\"/, "text-anchor='start'") svg_text.gsub!(/shape-rendering=\"default\"/, "shape-rendering='auto'") svg_text.gsub!(/visibility=\"\"/, "visibility='inherit'") # write sanitized SVG to temp file tempfile = Tempfile.new( ActiveSupport::SecureRandom.hex(16) ) tempfile.write(svg_text) # SVG to PNG using Batik output_name = Rails.root.join( "public", "exports", "gantt.png") width = svg_text.match(/width=\"[\d]+\"/)[0].match(/[\d]+/)[0].to_i exec_str = "java -jar #{batik_path} -m image/png -d #{output_name} -w #{width} #{tempfile.path}" return_val = system( exec_str ) end end However, this fails to produce a useful PNG Gantt chart. The task bars are missing even though the Gantt chart in the client web browser looks perfect. After some digging through the SVG itself, I found that the SVG returned from the chart on the client browser has zero-width task bars. <rect x=\"2041.5\" y=\"163.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> <rect x=\"2243.5\" y=\"187.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> <rect x=\"2243.5\" y=\"211.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> <rect x=\"2243.5\" y=\"235.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> <rect x=\"2243.5\" y=\"259.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> <rect x=\"2243.5\" y=\"283.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> <rect x=\"2243.5\" y=\"307.5\" width=\"0\" height=\"9\" r=\"0\" rx=\"0\" ry=\"0\" fill=\"#b2c8d9\" stroke=\"#999999\" fill-opacity=\"1\" stroke-opacity=\"1\" stroke-width=\"1\" style=\"cursor: pointer;\"></rect> Also, the "r" attribute does not seem to mean anything for the rect element according the Mozilla Developer Network: https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/r and https://developer.mozilla.org/en-US/docs/Web/SVG/Element/rect. (for more details, please reference forum topic: http://forum.fusioncharts.com/topic/15081-server-side-export-javascript-rendered-gantt/) I have attached the what the Gantt chart looks like in the web browser. The blue task bars and the black grouped task bar are missing when i export to PNG.

Hi everybody, I try to render a multi series line chart in my page, using 3 php files : - index.php, wich contains a form to pick up some elements (processes executed in the month, and a period -last hour, last day..), - processCharts.php, which treat the informations from the form and call the function "renderchartAvgSum(()" - chartCreation.php, in which i defined the function "renderchartAvgSum()" and which uses "renderChartJS()" from FusionChart. let's see this : chartCreation.php <?php require_once("/FusionChartPath/FusionCharts_Gen.php"); /* function renderchartAvgSum() : * $chartType : the Chart we want to build. MSLine, Line etc... * $pID : lists of process Ids to find in the database * $step : step of xAxis in the cahrt * $diffDate : difference in days between $endDate -today- and begin date of process * $endDate : ending date of process . generally = SYSDATE * $queryValue : what we need (avg by wich time?) * $graphW, $graphH : dimensions of chart. */ renderchartAvgSum($chartType,$pID,$step, $diffDate, $endDate, $chartName, $queryValue, $graphW, $graphH){ if(!empty($processList)){ } ?>

Hi everybody, I try to render a multi series line chart in my page, using 3 php files : - index.php, wich contains a form to pick up some elements (processes executed in the month, and a period -last hour, last day..), - processCharts.php, which treat the informations from the form and call the function "renderchartAvgSum(()" - chartCreation.php, in which i defined the function "renderchartAvgSum()" and which uses "renderChartJS()" from FusionChart. let's see this : chartCreation.php <?php require_once("/FusionChartPath/FusionCharts_Gen.php"); /* function renderchartAvgSum() : * $chartType : the Chart we want to build. MSLine, Line etc... * $pID : lists of process Ids to find in the database * $step : step of xAxis in the cahrt * $diffDate : difference in days between $endDate -today- and begin date of process * $endDate : ending date of process . generally = SYSDATE * $queryValue : what we need (avg by wich time?) * $graphW, $graphH : dimensions of chart. */ renderchartAvgSum($chartType,$pID,$step, $diffDate, $endDate, $chartName, $queryValue, $graphW, $graphH){ if(!empty($processList)){ } ?> blabalaaa

Hi I am using pure Javascript (renderer = javascript) Gantt chart in Ruby On Rails (version 3.0.19). It looks fine in web browser. Now i want to export but i didn't want to use php on my Ruby on Rails server as instructed on this page: http://docs.fusioncharts.com/widgets/Contents/ExportingImage/ECPureJS.html Instead, from my Rails controller I pull in the SVG from the return parameters (i.e. params[:stream]) and pass it to batik to convert into png file as follows ruby on rails controller code: svg_match = params[:stream].to_s.match(/<svg.*<\/svg>/) svg_text = svg_match[0] rescue params[:stream].to_s tempfile = Tempfile.new( ActiveSupport::SecureRandom.hex(16) ) tempfile.write(svg_text) output_name = Rails.root.join( "public", "exports", "gantt.png") exec_str = "java -jar #{batik_path} -m image/png -d #{output_name} #{width} #{tempfile.path}" return_val = system( exec_str ) Everything looks good except that my task bars are missing! Process names show up on the left, dates show up on the top, and even the grid background of the gantt shows up. But there no task bars. What might I be doing wrong? As a second question, didn't the returned SVG on an export used to be in a parameter called "svg" as in params[:svg]? I am using version FusionWidgets XT (v3.3.1 - Service Release 2) (28th May, 2013) NOTE: In order for Batik to not choke on the gantt chart SVG I had to disable gradients on the task bars as follows <chart plotGradientColor='' taskBarFillMix='' ...>

Hi, I am using FusionCharts version 3.3.1 and trying to export charts as images/pdfs using J2EE export handler. Everything works fine when I use Flash version of chart and export images. When I disable Flash in browser, JS chart is rendered and I am getting "Insufficient Data" error via FC_Exported(objRtn) javascript callback function. Here are Tomcat server logs: Aug 20, 2013 1:23:04 PM com.fusioncharts.exporter.error.ErrorHandler buildResponse INFO: Miscellaneous Messages=&width=0&height=0&DOMId=Chart_ID_0.9248934648931026 Here is my config: JSP/HTML code for chart <chart bgAlpha='0,0' enableSmartLabels='1' pieRadius='120' formatNumberScale='0' debug='true' exportEnabled='1' registerWithJS='true' exportCallback='FC_Exported' exportHandler='/res/FCExporter' exportAtClient='0' exportAction='save' bgColor='F7F7F7' showBorder='0' showShadow='0' use3DLighting='0'> fusioncharts_export.properties under classes folder SAVEPATH=/usr/sites/host101.com/htdocs/graphs HTTP_URI=http://host101.com/graphs/ OVERWRITEFILE=false INTELLIGENTFILENAMING=true FILESUFFIXFORMAT=TIMESTAMP Can anyone please help? Thank you in advance.

Hi All. I am using FusionCharts XT 3.3.1-sr2.19840 to render a javascript chart and I get the following error: Cannot read property 'width' of undefined The snippet code that throws this error is (FusionCharts.HC.js): getSmartText: function (d, e, q, l) { if (!this.init) return !1; if (d === void 0 || d === null) d = ""; var v = { text: d, maxWidth: e, maxHeight: q, width: null, height: null, oriTextWidth: null, oriTextHeight: null, oriText: d, isTruncated: !1 }, i = !1, k, b, f, a, g = -1, c = -1, t = -1, x = this.container, J = this.context, ja = g = 0, la, r = [], w = 0, u = this.showNoEllipses ? "" : "...", g = this.lineHeight, V = function (a) { for (var a = a.replace(/^\s\s*/, ""), b = /\s/, g = a.length; b.test(a.charAt(g -= 1)); return a.slice(0, g + 1) }; la = J ? function (a) { return J.measureText(a).width; } : function (a) { x.innerHTML = a; return x.offsetWidth }; In some situations (generally when a = "") the call J.measureText (a) returns undefined and the next call (.width) throws the error. I could not identify why this call returns undefined, or why a = "". Can someone help me with this? Thanks in advance, Felipe Odoni

Hi, When I try to align the caption in a chart, it works fine in flash, but in javascript, the alignment does not get applied and it is always centered. Is there some other parameter I need? Here's an example: -<graph enableRotation="1" showValues="1" smartLabelClearance="" enableSmartlabels="1" pieRadius="" plotFillAlpha="100" imageSaveURL="rdTemplate/rdAnimatedChart/FCExporter.aspx" imageSave="1" showBorder="0" chartBottomMargin="" chartTopMargin="" chartRightMargin="" chartLeftMargin="" numberPrefix="" showLabels="1" bgColor="ffffff" Caption="Sales By Category" animation="1" showFCMenuItem="0" unescapeLinks="0">-<styles>-<definition><style type="font" bold="0" color="5b5b5b" size="15" font="Helvetica" name="DataLabelsFontStyle"/><style type="font" bold="1" color="5b5b5b" size="24" font="Helvetica" name="CAPTIONFontStyle" align="left"/></definition>-<application><apply styles="DataLabelsFontStyle" toObject="DataLabels"/><apply styles="CAPTIONFontStyle" toObject="CAPTION"/></application></styles><set color="00558e" name="Beverages" hoverText="" value="103924.3100"/><set color="e54c25" name="Condiments" hoverText="" value="55368.6000"/><set color="84986b" name="Confections" hoverText="" value="82657.7300"/><set color="8f72aa" name="Dairy Products" hoverText="" value="115387.6500"/><set color="e59138" name="Grains/Cereals" hoverText="" value="56871.8200"/><set color="00558e" name="Meat/Poultry" hoverText="" value="80975.1200"/><set color="e54c25" name="Produce" hoverText="" value="54940.7600"/><set color="84986b" name="Seafood" hoverText="" value="66959.2100"/></graph>

Hi, I would like to create labels on pie charts that correspond to the color of their slice. So if the slice is blue, the font should be blue. This will allow me to not have to show the lines that connect the label to the pie. Is this possible? Right now I see that I can only apply one color to a set of labels.

How to generate interactive graphs daily,weekly,monthly,yearly on it which pull their data from excel files from other website which get updated with time.

Using the following defintion I get different appearances between the flash and javascript versions. Edges are not rounded in javascript. <?xml version="1.0" encoding="UTF-8"?> -<graph lineDashed="0" useRoundEdges="1" rotateValues="1" showValues="0" divLineColor="000000" canvasBgColor="dad9da" rotateLabels="1" xaxisname="X-Axis" yaxisname="Y-Axis" imageSaveURL="rdTemplate/rdAnimatedChart/FCExporter.aspx" imageSave="1" unescapeLinks="0" showBorder="0" chartBottomMargin="" chartTopMargin="" chartRightMargin="" chartLeftMargin="" numberPrefix="" showLabels="1" bgColor="ffffff" Caption="" animation="1" showFCMenuItem="0"> -<styles> -<definition> <style type="font" color="5b5b5b" size="11" font="Helvetica" name="DataLabelsFontStyle"/> <style type="font" color="5b5b5b" size="11" font="Helvetica" name="YAXISVALUESFontStyle"/> <style type="font" color="5b5b5b" size="11" font="Helvetica" name="LegendFontStyle"/> </definition> -<application> <apply styles="DataLabelsFontStyle" toObject="DataLabels"/> <apply styles="YAXISVALUESFontStyle" toObject="YAXISVALUES"/> <apply styles="LegendFontStyle" toObject="Legend"/> </application> </styles> <set color="008000" alpha="100" label="Dairy Products" value="115387.6500"/> <set color="008000" alpha="100" label="Beverages" value="103924.3100"/> <set color="008000" alpha="100" label="Confections" value="82657.7300"/> <set color="008000" alpha="100" label="Meat/Poultry" value="80975.1200"/> <set color="008000" alpha="100" label="Seafood" value="66959.2100"/> <set color="008000" alpha="100" label="Grains/Cereals" value="56871.8200"/> <set color="008000" alpha="100" label="Condiments" value="55368.6000"/> <set color="008000" alpha="100" label="Produce" value="54940.7600"/> <trendlines/> </graph>

Hi, Using this defintion, the area under the line is green in flash but grey in javascript. Are you all aware of this problem? Is there a workaround I can use? I need both charts to look the same. Thanks. <?xml version="1.0" encoding="UTF-8"?> -<graph lineDashed="0" useRoundEdges="0" rotateValues="1" showValues="0" divLineColor="000000" canvasBgColor="dad9da" rotateLabels="1" xaxisname="X-Axis" yaxisname="Y-Axis" imageSaveURL="rdTemplate/rdAnimatedChart/FCExporter.aspx" imageSave="1" unescapeLinks="0" showBorder="0" chartBottomMargin="" chartTopMargin="" chartRightMargin="" chartLeftMargin="" numberPrefix="" showLabels="1" bgColor="ffffff" Caption="" animation="1" showFCMenuItem="0"> -<styles> -<definition> <style type="font" color="5b5b5b" size="11" font="Helvetica" name="DataLabelsFontStyle"/> <style type="font" color="5b5b5b" size="11" font="Helvetica" name="YAXISVALUESFontStyle"/> <style type="font" color="5b5b5b" size="11" font="Helvetica" name="LegendFontStyle"/> </definition> -<application> <apply styles="DataLabelsFontStyle" toObject="DataLabels"/> <apply styles="YAXISVALUESFontStyle" toObject="YAXISVALUES"/> <apply styles="LegendFontStyle" toObject="Legend"/> </application> </styles> <set color="008000" alpha="100" label="Dairy Products" value="115387.6500"/> <set color="008000" alpha="100" label="Beverages" value="103924.3100"/> <set color="008000" alpha="100" label="Confections" value="82657.7300"/> <set color="008000" alpha="100" label="Meat/Poultry" value="80975.1200"/> <set color="008000" alpha="100" label="Seafood" value="66959.2100"/> <set color="008000" alpha="100" label="Grains/Cereals" value="56871.8200"/> <set color="008000" alpha="100" label="Condiments" value="55368.6000"/> <set color="008000" alpha="100" label="Produce" value="54940.7600"/> <trendlines/> </graph>

Hello, we are using a purchased version of Fusion Maps in our web page. The maps and charts are renderized by Javascript and I have noticed that in Firefox browser (version 20.0.1 for example) is slower than in other browsers like IE or Chrome. Also I noticed that when the map is displayed with other charts in the same page, the map is even slower. Is this a normal behaviour? Can I speed up the map? Thanks John

Hi I am using FusionChart XT My charts are not rendering in javascript, After added that line in js file which renders the chart i.e. FusionCharts.setCurrentRenderer("javascript"); Still i am getting the charts in flash and i am using these charts in pentaho-fcplugin

Hi, We are working on RadarChart, dataset and cateogories are retrieved from JSON Data, We need to specify some datapoints to be highlighted. How this can be achived. Please help us immediately