Skip to Content
| | {code:html}http://www.sdn.sap.com/irj/servlet/prt/portal/prtroot/docs/webcontent/uuid/40d903f9-0b01-0010-4fab-cbea484aa0a3|border=0!

You might remember my earlier Sign of the times{code} concerning the generation of bar codes via an Object-Oriented Graph creating library for PHP, called JPGraph. As you might remember, this library is also eminently suitable for creating all kinds of charts. Being a PHP library, it’s rather obvious that – in a web context – the charting engine runs on the server side which creates (mostly) a graphical image for that chart. But what if you need to create charts on the client side? In the search for such a solution for our well known SDN World (From the Grumpy Old Man: Hoy en el mundo), Valery and I have been trying things out. *Kit* The first attempt was based on the Javascript library, already covered in my earlier web log (The Great Library Misery), MochiKit (http://mochikit.org/) with the charting library Plotkit (http://www.liquidx.net/plotkit/) on top of it. As such it’s a rather straight forward thing. First initialise the scripts: Plotkit needs a canvas to draw on. See this web log (Blank Canvas) for details on the tag. layout.addDataset(“demo”, [[10, 20], (15, 30) , (20, 40)) Things need to be calculated layout.evaluate(); The chart needs to be drawn on the canvas var canvas = MochiKit.DOM.getElement(“my_canvas”); Link things together var plot = new PlotKit.SweetCanvasRenderer(canvas, layout); And finally render stuff plot.render(); image *Flash* As you can see, it isn’t that complicated at all. We didn’t stop at this solution though. Despite the nice end result, it wouldn’t run on the preferred platforms. On top of that, it would make the application much heavier, which was certainly to be avoided. The next obvious step was to have a look for an alternative in Flash. I found a really nice solution in XML/SWF (http://www.maani.us/xml_charts/) by maani.us. These guys have lots of nice stuff like charting for PHP, Gauge charts, etc.*Conclusion* As you can see, one can implement charts easily with little effort. “Why didn’t you use it in SDN World (From the Grumpy Old Man: Hoy en el mundo) then?” you might ask. Despite being a perfect solution, the Flash chart didn’t have any javascript interface for passing the data. The data was already there and we wanted to avoid having to retrieve the data a second time via an XML feed and thereby putting unnecessary stress on the server. Therefore a home brew Flash (by Valery and his team) was the most suitable solution in our case. image

To report this post you need to login first.

7 Comments

You must be Logged on to comment or reply to a post.

  1. Dirk Herzog
    Hi Eddy,
    did you do something to your blog? All the lines are cut at the right side, somehow making the whole text a bit hard to read.

    Best regards
    Dirk

    (0) 
      1. Dirk Herzog
        It’s not only the code. Your first line reads like
        “You might remember my earlier web log concerning the generation of bar codes via an Object-Oriented Graph creating library for PHP, called JPGraph. As you might remember, this libra”
        Only when I use the mouse and move to the right side with clicked button (to mark the whole text) I can read the whole text.

        Best regards
        Dirk

        (0) 
        1. Eddy De Clercq Post author
          Hi,

          Strange, I don’t have this problem.
          Anyway, I’ve done some additional tweaking and hopefully, it shows properly at your end too now.

          Eddy

          (0) 
          1. Dirk Herzog
            Now it’s fine. The strange thing was that it was only your blog that appeared so strange, the others were fine.

            Best regards
            Dirk

            (0) 

Leave a Reply