CODEWITHSUNDEEP
canvashighchartstypeerrorjspdf
Johnny
Johnny

Reputation: 549

Highcharts clientside export plugin. TypeError 'C is undefined'

There is a new plugin available from Highcharts to allow for client side rendering of charts.

Clientside Exporting

The fiddle for it seems to work flawlessly, but I’m having some trouble replicating the fiddle on my server. Specifically, I get a ‘TypeError: c is undefined’ message in my Firebug console window.

I have setup my page in the following way …

<!-- jquery -->
<script type="text/javascript" charset="utf8" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/overcast/jquery-ui.css"/>

<!-- HighCharts -->  
<script src="//code.highcharts.com/highcharts.js"></script>
<script src="//code.highcharts.com/modules/exporting.js"></script>

<!-- Highcharts Exporting Dependencies --> 
<script src="//a----.github.io/highcharts-export-clientside/bower_components/export-csv/export-csv.js"></script>        

<!—Uncommenting will produce the TypeError ‘C is undefined’ -->                                                               
<!-- <script src="//a----.github.io/highcharts-export-clientside/bower_components/highcharts/modules/canvas-tools.js"></script>
<script type="application/javascript" src="//a----.github.io/highcharts-export-clientside/bower_components/jspdf/dist/jspdf.min.js"></script>  -->

<!-- Export Client-Side module -->
<script src="//a----.github.io/highcharts-export-clientside/bower_components/highcharts-export-clientside/highcharts-export-clientside.js"></script>

If I remove or comment out everything other than ‘export-csv.js’ within the ‘Highcharts Exporting Dependencies’ section. I can render a chart as an SVG and download the csv/xls file without any issues at all. However, as soon as I enable canvas-tools or jspdf, I get the TypeError mentioned earlier.

Initially, I thought perhaps it was somehting related to the files being accessed via a github account. But moving canvas-tools and jspdf to a directory local to my server still results in the TypeError.

May I ask for some pointers, please? I don’t know javascript very well at all and I’m struggling to identify what I have done wrong with this plugin.

I guess I’m missing some other dependancy for using canvas-tools and jspdf.

Upvotes: 0

Views: 1413

Answers (1)

Johnny
Johnny

Reputation: 549

The Type C Error shown in my browser (FireFox) turned out to be a non issue. After a little more diagnosis, I noticed the issue of failing to export a chart locally using the client side rendering plugin was because I had added an image to the chart ... think of a watermark image.

Removing the image from the chart allowed it to be rendered client side, even with the Type C Error in the browser console.

After posting a question in the HighCharts forum, it was suggested that I make the plugin author aware and open a ticket on Github. Which I did.

The author responded within a few hours and has since fixed this issue. A new fiddle that uses client side rendering (with an embedded image) can be seen here ...

`http://jsfiddle.net/xa8wke0b/4/`

As I seem to be getting an awful lot of 'Oops, your SVG is too big' messages from the HighCharts export server, I think this is going to prove to be an extremely useful plugin.

Upvotes: 1

Related Questions