jayj

Members
  • Content count

    2
  • Joined

  • Last visited

Everything posted by jayj

  1. I have noticed that the export functionality only exports what is visible on the screen (screen shot) as opposed to the entire chart. I first want to ask if there is an update to topics related to this that I have stumbled upon from many years prior - is there a method to allow you to export all data instead of what is visible within the predefined height and width? If not, I am attempting to bypass this by changing the width and height programmatically before and after the export. The problem I'm running into is that it resizes, but does not export the resized chart. It exports the chart as it was initially. My code is below. Any helps is appreciated. <button id="export_chart" class="form_btn" title="Click to export the chart to PDF">Export to PDF </button> <div id="chart-container">FusionCharts will render here</div> FusionCharts.ready(function () { var smoPlan = new FusionCharts({ type: 'gantt', renderAt: 'chart-container', width: '1500', height: '850', //'850' dataFormat: 'json', dataSource: { // Chart Configuration "chart": { "dateformat": "mm/dd/yyyy", "caption": "IMT Major Projects", "subcaption": title_subcaption, //"showTaskStartDate": 1, "legendCaption": "Project Status", "legendCaptionFontSize": "14", "legendCaptionBold": "1", "legendItemFontSize": "12", "legendIconScale": "1.5", "legendAllowDrag": "1", "legendBgColor": "#CCCCCC", "legendBgAlpha": "20", "legendBorderColor": "#666666", "legendBorderThickness": "1", "legendBorderAlpha": "40", "legendShadow": "1", "theme": "ocean", "canvasBorderAlpha": "40", "showBorder": "1", "gridbordercolor": "#666666", "gridborderalpha": "20", "exportEnabled": "1", "exportMode": "auto", "exportFileName": "TestExport" } }).render(); function export_chart() { smoPlan.resizeTo('1500', '2000'); smoPlan.exportChart({"exportFormat": "pdf"}); smoPlan.resizeTo('1500', '850'); } $("#export_chart").on('click', function () { export_chart(); }); });
  2. Export Entire Chart

    Thanks for the response. It was very helpful. I was able to almost get the desired result. The only issue I'm running into is the height of the tasks seems to increase beyond reason. I attached a screenshot of the result. Do you have any suggestions? The current height for all tasks is "32%"... "tasks": //These are the actual bars associated with the projects. Usdes start and target dates of projects { "animation": "1", "processid": "1", "id": "1-1", "color": "#5AC752", "height": "32%", "toppadding": "12%", task: tasks }, For those looking for the solution to my original question: function export_chart() { // current chart attributes/values var pdu=smoPlan.getChartAttribute("ganttPaneDurationUnit"); var pd=smoPlan.getChartAttribute("ganttPaneDuration"); var vs=smoPlan.getChartAttribute("useVerticalScrolling"); var h=smoPlan.getChartAttribute("height"); var w=smoPlan.getChartAttribute("width"); smoPlan.setChartAttribute ( "showFullDataTable", "0"); smoPlan.setChartAttribute ( "ganttPaneDurationUnit" , "" ); smoPlan.setChartAttribute ( "ganttPaneDuration" , "" ); smoPlan.setChartAttribute ( "useVerticalScrolling" , "0" ); smoPlan.resizeTo('1500', '2000'); // expand chart size smoPlan.exportChart({"exportFormat": "pdf"}); // export smoPlan.resizeTo(w, h); // restore chart to original size smoPlan.setChartAttribute ( "useVerticalScrolling" , vs ); smoPlan.setChartAttribute ( "ganttPaneDuration" , pd ); smoPlan.setChartAttribute ( "ganttPaneDurationUnit" , pdu ); } $("#export_major_chart").on('click', function () { export_chart(); });