EthanLWillis
EthanLWillis

Reputation: 950

How to export a cytoscape web graph before serving a page to a browser

Scenario: A client is on a page with a search bar, they enter a query. This query is passed along to a second page that is generated dynamically with php by the server. Along with the query information given to the php script a variable is passed that allows the php script to determine if flash is available to the client's browser. Now the php script displays a png of a network graph generated by cytoscape web if flash is unavailable and a swf of the graph if flash is available.

Problem/Question: 1.) Cytoscape web is a javascript library for displaying graphs. It has an export function(http://cytoscapeweb.cytoscape.org/documentation#section/exportNetwork) but that only allows for a browser to download an exported file. I want to be able to export and save this file during the php runtime and then embed it as content in place of a swf if flash is not enabled. How would I go about doing this if the javascript method has to be run in the client's browser?

Resources

Graph export method 1: http://cytoscapeweb.cytoscape.org/documentation#section/png

Graph export method 2: http://cytoscapeweb.cytoscape.org/documentation#section/exportNetwork

Upvotes: 1

Views: 1042

Answers (1)

Alos
Alos

Reputation: 2715

A similar question was asked over on the cytoscape web google groups page.
Here is the link to the question and answer

Here is what the said:

If you use png(), you only get the bytes of the image as String (as Base64). It does not export the image to the server-side and does not make it available for download. In order to do that, you have to submit the string to the server side yourself, convert from base64 to bytes again and then make the server component (e.g. PHP, Java Servlet) stream the bytes back to the browser, so users can download the image.

There is also the option of using a Flash component/plugin for getting the bytes and making it downloadable without the need of the web server. That's exactly what the Cytoscape Web demo application (http://cytoscapeweb.cytoscape.org/demo) does when you select the "Save file" menu option. You can copy the examples from the demo's JavaScript file and use the Flash library we developed for that. It is not well documented, so I guess it may be a little bit complicated. Anyway, if you want to give it a try, take a look at:

- http://cytoscapeweb.cytoscape.org/js/content/demo.js - search for "org.cytoscapeweb.demo.Exporter"
- http://chianti.ucsd.edu/svn/cytoscapeweb/trunk/file/ - you can download the component project from Subversion with the command:  svn checkout http://chianti.ucsd.edu/svn/cytoscapeweb/trunk/file cwfile-read-only

If you search the internet, you may find similar plugins.

Remember that the png() function must be called from inside the ready() function, before you call vis.draw() - example:

vis.ready(function() {
    var png = vis.png();
// handle the png bytes here:
    alert(png);
});
vis.draw(draw_options);

An easier option is to use the exportNetwork() function, which requires a server-side part. See http://cytoscapeweb.cytoscape.org/documentation/cytoscape_web#section/exportNetwork ; it even includes a PHP example. The JavaScript part would be something like this:

vis.ready(function() {
    // ...
vis.exportNetwork('png', 'export.php?type=png');
    // ...
});

The name of the output file is done by the server-side code -- the "export.php" file in this example.

I hope that helps

Upvotes: 0

Related Questions