Need the ability to create pie charts and graphs based on data blocks.

Proposed Resolution

Create a pluggable support for graph/chart implementation. Considering image, flash based and SVG charts and graph support.

Remaining Tasks

Current implementation already has support for SVGGraph installed as a library in sites/all/libraries folder (without needing libraries api module).

  • Add support for an image based graphing solution
  • Add support for a Chart API
  • Create documentation/help videos


rconstantine’s picture

Are you thinking of integration with another module, or rolling your own? I always advocate integration with other modules to minimize code base - unless any enhancements to that other module which you may produce are not received by the maintainer and rolled into it.

metzlerd’s picture

I'm happy to integrate with other modules, if they're written general enough to do so. All of Forena is designed to be VERY pluggable. The trick is/will be finding modules that support graphing in a sane way that is database agnostic. There's definitely some flex based stuff I'd like to add based on my experience, but I'm open to anything that works. Working code wins, right?

mojzis’s picture

this could be it ?

mojzis’s picture

this made think of you :-)

does it have to be flash (as mentioned in the roadmap issue) ? i dont like flash :-)


metzlerd’s picture

Flash graphs are great for interactivity, but not for printing,etc. I'm planning on a pluggable mechanism that supports multiple gaphing mechanisms. SVG is a possibility. Server side graph generators are a possibility. HTML5 graphing is definitely a possibility. It will probably come down to which I can get integrated the easiest or others supply patches for. But no, it doesn't have to be flash.... I just know I can probably get that working the easiest. Thanks for the url.

Marcin Pajdzik’s picture

I think that Google Charts ( could be a good option.

R.J. Steinert’s picture

Charts and Graphs API port to D7 in the works ->

I also have a jqplot and flot plugin for charts_graphs around somewhere. The bottleneck there is browser's ability to graph LOTS of data. Most browsers crash +5,000 last I checked.

charts_graphs module has Google Charts support, but I bet the Google Charts module supports it better. Be aware, there is a limit to how much data you can send to the Google Charts API (for starters, most browsers have a URL length limit) which is why I wrote my own version of Google's Chart API so folks can set up their own chart server. If you need to get around the URL length limit, it accepts a remote data file as a source.


It's a node.js project that could be integrated with Drupal in the same way that the Google Charts module integrates with Google Charts API.

metzlerd’s picture

Version:6.x-1.x-dev» 7.x-2.x-dev

I have started an implementation of native support for SVGGraph php library for creating charts. Its functional in the current 7.x-2.x dev branch, but there's not much documentation for it yet. If you have a pressing need for it, let me know. I have not yet developed a UI for creating them, but I plan to embed examples in the sample reports that should be sufficient.

The reason for SVG support first is that this seems to be HTML5's future direction for graphs. I'm implementing in a pluggable way though, so we should be able to reference others.

hpang’s picture

How do I use more options that SVGGraph supports? I see in the example bar color can be changed easily, but I want to deeply alter the look, such as font, size, etc. I tried to add supported option commands into the frx:options line, does not work. Any instruction will be greatly appreciated!

SMTF’s picture

I'm also interested in more documentation on this. I've had some trouble working backwards from the included samples; I may post more details about my particular plight if I can't resolve it on my own.

+ 1 Following

SMTF’s picture

Issue summary:View changes

Creating an issue summary

metzlerd’s picture

Component:Code» Documentation

Changing to a documentation issue since the basic SVG graphing support is there.

flarrinaga’s picture

Version:7.x-2.x-dev» 7.x-3.0-alpha5
Component:Documentation» Report
Category:feature» support

I have recently installed the Forena module. Everything works fine but I am having problems to view the graphs. I installed the SVG library as pointed out in the Readme.txt
When I try to view the Master Summary with drill down example, the SVG graph does not show and a pop-up error appears instead. The rest of the report works fine.
I have tried to view it with Firefox and Chrome but in both cases I get the same result. The error showing when using Chrome is
"This page contains the following errors:

Error on line 2 at column 1: Extra content at the end of the document
Below is a rendering of the page up to the first error."

I believe that the SVG plugging for both browsers is correctly installed because I manage to see

I also tried to create an SVG graph as a standalone report as mentioned in comment ( but I am not sure if I am doing it correctly.

Any clues on what might be happening?

Is there any documentation available on how to build graph reports?

Thank you in advance for your help.

metzlerd’s picture

Did you enable the SVG document type in your forena document types configuration?

flarrinaga’s picture

Yes, I did.

Pierre.Vriens’s picture

for what it is worth, I thought adding this extra info about what I noticed might help to find out what the actual issue might be for @flarrinaga ...

- in my case I'm still using the 7.x-3.0-alpha2 version (haven't retried yet with the alpha5 version).
- related to the same sample report (= Master Summary with drill down).
- the SVG (= sample.state_graph.svg ) is not actually shown (only the text "This report links back to the sample report 2. You can begin to see the possibilities for inter-connecting reports" preceding the graph, and the actual table following the graph are shown). I don't see any special messages / errors anywhere though.
- when I click the "PDF" link though (upper right in the same rpt), the resulting sample.state_summary.pdf looks OK to me: it does show the graph, preceded by the same text (this report links ...) and followed by the actual table.
- the scenario above is via XAMPP under windows 7 (localhost).

It appears to me that because the PDF looks fine, I correctly installed the SVG library (if not how come that the PDF version works fine?). Though I don't have an idea (yet) why the graph is not showing up in the original (sample) report.

A similar scenario (with the 7.x-2.2 version) using quickstart (virtualbox) with ubuntu works perfect (haven't had a chance to verify the 7.x-3.0-alpha version there yet).

I'd be happy to further investigate in my environment(s) any other suggestions to understand what the actual issue might be (and get back on it with more info of course).

I'd be curious to learn from @flarrinaga what the result of the PDF-link is (does that show the graph or not?).

PS to David: great module, great work! Contact me for more feedback.

flarrinaga’s picture

The PDF option was not enabled in my installation by default. My scenario is also via XAMPP under windows (localhost) but in this case windows XP (just a prototype).
I tried to install the PDF option to verify what Pierre.Vriens mentioned but I do not manage to make it work.
I have installed mpdf correctly.
I follow the steps set on to install prince libraries but the fifth step it is not show clear to me. That is how do you "set the path to the binary in the PDF settings under admin/config/user-interface/print/pdf/princexml"?
See the attached file for configuration options.

After rebooting the server I get the following message:

"Warning: include_once(sites/all/libraries/prince.php) [function.include-once]: failed to open stream: No such file or directory in FrxPrincePDF::__construct() (line 12 of C:\xampp\htdocs\drupal7\sites\all\modules\forena\docformats\
Warning: include_once() [function.include]: Failed opening 'sites/all/libraries/prince.php' for inclusion (include_path='.;C:\xampp\php\PEAR') in FrxPrincePDF::__construct() (line 12 of C:\xampp\htdocs\drupal7\sites\all\modules\forena\docformats\
Prince XML Not Properly Installed"

The report has also change. Before I activated the PDF option I show the result as a table and now, although in html is still a table, the look is different.

metzlerd’s picture

Certainly PDF support is not required for SVG. I don't yet know how well SVG embedded in PDF works with mPDF as this is a pretty new addition, but I'm willing to work with folks on this.

Some things to verify:
1. Verify that you can see a folder called sites/all/libraries/SVGGraph. Is that true?
2. Try visiting yoursiteur/report_doc/sample.state_graph.svg?width=600&height=400

Do a view page source on this page. What does it show?

metzlerd’s picture

It also just occured to me to check to make sure your filter configuration is set to full html in the forena configuration screen. If the SVG tags are being stripped out this could cause the behavior that pierre is talking about.

Pierre.Vriens’s picture

@flarrinaga: I'm using mPDF only. Within admin/config/content/forena/pdf I have PDF generation method set to MPDF and the MPDF library has an install path = sites/all/libraries/mpdf . I didn't do / install anything for Prince XML. Which I think is also why I have "Prince XML library not found. Please install so sites/all/libraries/prince/prince.php exists." below the PHP Library path (David please correct if I'm wrong). So if you want to also try what I wrote before about the PDF-part, I would try to do so via the mPDF (not via Prince XML). Can you be more specific about the "but I do not manage to make it work" (what's the PDF-result you get, and/or can you create a PDF for any other report)?

@metzlerd: my PDF-suggestion was intended as a hint for flarrinaga to do some other check (not that PDF is a prereq for SVG). And the "SVG embedded in PDF (with mPDF)" seems to work fine so far in my case. To answer your extra suggestions:

1) I can see sites/all/libraries/SVGGraph

2) filter configuration is indeed set to full html in the forena configuration screen

3) when I visit sample.state_graph.svg?width=600&height=400 (using firefox) I select to open it in firefox (not save it to disk), I get something like this (for the last line I only included part of that line here):

XML Parsing Error: junk after document element
Location: file:///C:/Users/PIERRE~1.VRI/AppData/Local/Temp/sample.state_graph.svg
Line Number 2, Column 1:

metzlerd’s picture

Could you check your full_html configuration and make sure the following entries are turned off for your full_html filter:
Limit allowed HTML tags
Display any HTML as plain text
Convert line breaks into HTML
Correct faulty and chopped off HTML

Pierre.Vriens’s picture

I checked my full_html configuration (via admin/config/content/formats/full_html). These are the 2 entries that were turned on (the others were already off):

Convert line breaks into HTML
Correct faulty and chopped off HTML

After I turned these entries off also, I visited (using firefox) sample.state_graph.svg?width=600&height=400 again. This time my XML parsing error did not show up anymore. Instead I now get a popup titled 'Opening sample.state_graph.svg' to either open this SVG (with firefox), or save the SVG to disk. When I then select to open it (in firefox), it actually does show me the SVG graph. So turning off the 2 full_html entries mentioned above, appears to be the solution from my XML Parsing error. To double check this, I ran a similar experiment with IE 9 and with Chrome, with similar results.

However, to come back to what I wrote in #15 above: the graph is still not shown now in the sample report (= Master Summary with drill down), using Firefox. Without any extra message or popup anywhere. Though the PDF-link continues to work fine (as I wrote in #15 also). When I try the same scenario (open the sample report (= Master Summary with drill down)) with IE 9 or with Chrome, I get a slightly different result:
- IE 9 asks me "Do you want to open or save sample.state_graph.svg from localhost?" Selecting "open" actually opens a browser window (Firefox, my default browser to view SVGs) showing sample.state_graph.svg.
- Chrome shows a warning like "this type of file can harm your computer. do you want to keep sample.state_graph.svg anyway?" Selecting "Keep" actually opens a browser window (Firefox) showing sample.state_graph.svg also (so similar to IE 9 scenario).

To further investigate what might be happening (like why doesn't IE 9 or chrome just show the SVG in the same browser window in IE 9 or chrome itself (in the webpage containing the sample report), I investigated the html (using view source) of the sample report (right after the DIV with ID=forena-1). Before I turned off the 2 full_html entries (see above), the generated html looks like this (the '...' reflects extra info within the embed that seems unchanged to me), all on a single line:

<?xml version="1.0"??>

And after I turned off the 2 full_html entries (see above), the generated html looks like this, now spread over 2 lines, and followed by an extra blanko line:

<?xml version="1.0"?>

I noticed these 3 differences:
- the XML tag now ends with a single '?', instead of with '??'
- the br-tag is transformed into a line break
- the /embed is replaced by a /

They are probably due to turning of the 2 full-html entries. Though I wonder if anything can be done within forena-coding, so that one wouldn't have to turn off those 2 full_html entries. What I also wonder: what about those '??' in the XML tag? I'm just guessing, but shouldn't that entire XML tag look like this (as I also see in e.g. repos\forena_help\admin_topics.xml):

<?xml version="1.0" encoding="UTF-8"?>

1 more result of my extra validations: I went back to by Virtualbox / Quickstart / Ubuntu environment also (running the 7.x-2.2 forena version though), see my #15 above. The same full_html options are still turned on there. And the html lines around the XML tag also have '??', the br-tag, and the /embed . But in that environment I don't have the problem at all. Which leads me to believe that the missing clue might be a combination of running under windows 7 and the missing UTF-8 (which might also explain why IE 9 and chrome bring up that extra window to ask for opening or saving the SVG file (just guessing here, sorry).

I'd be happy to further investigate in my environment(s) any other suggestions to get the rest of my scenario to work (as it does in the 7.x-2.2 version). While I also plan some more testing of the 7.x-3.0-alphaX version in ubuntu, and the 7.x-2.2 version in windows.

metzlerd’s picture

The problem with the "convert line breaks to html" is that it doesn't seem to convert it to xhtml which forena needs in order to parse the data. There is some question regarding the others. I'm just running the generated and filtered html into an XML parser. Forena will always generate valid XHTML, but if these filters mangle that HTML, there's not much I can do except to try and correct it which seems like a losing battle to me. You could set up a new filter just for forena if you needed to keep those settings on for non-forena purposes.

Regarding the ?? I don't see that in my environment, so I'm wondering what is producing that at your end. What the code is doing from the SVG end is parsing the data, xpathing out the svg tag and then serializing the XML using simplexml asXML() function. I suspect that is related to one of the filters altering the data again.

Looking through my commit logs, it looks like I was using an attachment content disposition for SVG about 3 weeks ago, which would cause the behavior that you're experiencing, So if you're usiing an old alpha rev, you might consider updating to the latest. I'll be rolling a new alpha rev today if I can get a bug fixed regarding skin css adds to PDF documents.

Pierre.Vriens’s picture

Thanks for the extra feedback David. Here are my newest results after some extra testing of the 7.x-3.0-alpha5 version in windows (and some extra 7.x-2.2 version testing, also in windows): I upgraded from 7.x-3.0-alpha2 to 7.x-3.0-alpha5 now. Combined with the 2 full_html filter options unchecked (as you suggested before), the SVG graph now shows up right away. And this in FF, IE 9 and Chrome. So it seems that the "attachment content disposition" you wrote about in #22 is also the solution that made it work for me now (thanks!).

However, in an attempt to further investigate (in my envir) why in the 7.x-3.0-alpha5 version one now must uncheck those 2 full_html filter options, I did some extra tests (all in Firefox):

- test 1: check those 2 full_html filter options (turn them both on again). This results in an error like this ('...' represents extra data not included here):

XML Parsing Error: junk after document element
Location: http://localhost:8080/drupalog/reports/sample.state_graph.svg?height=400...
Line Number 2, Column 1: ... d="M51 378h539M5 ...

So we're back to what I wrote near the end of #19, which confirms what David suggested before (to uncheck those 2 full_html filter options, the other options were always turned of in my case).

- test 2: uncheck 'Convert line breaks into HTML' and check 'Correct faulty and chopped off HTML'. In this case the SVG graph is shown correctly also. Which makes me believe that, at least in my case, there is no need to also uncheck 'Correct faulty and chopped off HTML'. Does anybody know another scenario to illustrate the need to uncheck this option also?

- test 3: check 'Convert line breaks into HTML' and uncheck 'Correct faulty and chopped off HTML'. This produces an error like this (**1** is actually an 'end-svg tag' and **2** is actually a 'rect-tag'):

XML Parsing Error: mismatched tag. Expected: **1**.
Location: http://localhost:8080/drupalog/reports/sample.state_graph.svg?height=400...
Line Number 2, Column 100: **2*** width="100%" height="100%" fill="rgb(240,240,240)" stroke-width="1px" stroke="rgb(0,0,0)" **3**

At the end of what I pasted above (not shown here), near **3**, it continues with a /P-tag (end paragraph). So I seem to understand that for unknown reason that /P-tag gets added somehow, and that is why this XML Parsing error shows up.

- test 4: repeat the tests as in test 1, test 2 and test3, but now using the 7.x-2.2 version again. In all those 3 testcases the graph showed up perfectly (as was already the case also if you leave both full_html options checked.

The combination of all these test 1, 2, 3 and 4 results, appear to me that in the 7.x-3.0 versions "some piece of html" (like that /P-tag as in test 3 ? And/or some linebreak somewhere) gets produced (via forena and/or the related SVGGraph library?) that should not be produced (and wasn't produced in the 7.x-2.2 version). Until it becomes clear what that actually is and how to fix that, one should perform an uncheck of the 'Convert line breaks into HTML' in the full_html option (as a work around?).

With that, 'my' issue (as I first wrote in #15) is sorted out (I got it to work, even though for now it requires that 1 uncheck). Nevertheless, I still think the Forena module is great. And so is David's support! Maybe somebody should start a FDI (=Forena Documentation Initiative) soon? To help David to further extend the available Forena docu (and videos) that David produced so far (and compile all sorts of extra details contained in various Forena support issues) ...

flarrinaga’s picture

I followed the recommendations and I can also see the graphs now in my environment.

Thank you both Pierre.Vriens and metzlerd for your excellent support and effort in solving this issue.

I also believe the module is an excellent tool.

flarrinaga’s picture

After following your recommendations I manage to see the graphs provided with the module but I can not built my own using the template.I can build other type of reports.
Is there a tutorial on how to build a graph with forena?
Thank you in advance.

metzlerd’s picture

I'd like to know which version you are using to help better.

I don't yet have a tutorial, but I plan to produce one once I have the 7.x-3.x code tree a little more stabilized.

Which browser are you using to build the reports with the templates? Inline SVG support is sketchy still for many browsers.

I noticed just now that the current Alpha release is a bit buggy with the templates, it's supposed to be more ajaxy, but press preview between selecting templates. I'll work on that straight away.

The other thing that hangs most people up is that you need to specify the series using the token syntax, for example:

label: {state}
series1: {total}

Hope that helps.... feel free to ask more direct questions.

flarrinaga’s picture

Status:Active» Closed (fixed)

Thank you for the reply. The token syntax did the trick.
Now I can built my own graphs.

Thank you very much for all your help.

metzlerd’s picture

For those interested:

I just pushed out 7.x-3.0 beta1 which allows for an easier to ready Frx Graphing syntax, for those who are hand editing the Frx file. You can specify SVG options in frx: attributes. You used to have to do frx:options="series[]={total}" and specify everything in the options tag but now you can do frx:series_1="{total}" which allows you to put each option in its own XML attribute. This lets you
make more readable frx code (not all on one line).

metzlerd’s picture

Issue summary:View changes

Changed to reflect the fact that SVGGraph is supported in current release.

Vishal Shirguppi’s picture

Hi David,
This is quiet an old post but is really helpful. I have been able to use and edit forena reports module quiet well.
But there seems to be an issue with the legend.
Legends appears only when I click on document transformation options eg. HTML.
I have checked the FULL HTML configuration as well. Everything seems to be in the correct place. The module that I have installed also has patch for legends that came out during late last year.
Could you please suggest a possible solution to this.

metzlerd’s picture

Uh probably best to file a new issue as using old issues hides all kinds of information about versions being used. I'm not quite sure I understand your problem correctly, but if you are still having it would you mind creating a new issue?

metzlerd’s picture

Uh probably best to file a new issue as using old issues hides all kinds of information about versions being used. I'm not quite sure I understand your problem correctly, but if you are still having it would you mind creating a new issue?