Symphony.

So i was thinking today. Is it possible to use symphony and javascript to make some dynamic graphics? Like a user would insert data and then a bar graph would move?

No reason why not. Ultimately Symphony wold provide a way to store the end result (the user input) into a database. But the actual HTML/JavaScript to build the graphs doesn’t need Symphony at all.

Recently we used Symphony to create graphs and charts using the Google Charts API.

oh wow. Is that hard to use? for a somewhat not good programmer?

Just so you know, there are a dozen different jQuery plugins that can do this for you. You would just need to tie in some variables to the content of a text input and then call a function on a change (jQuery can do that for you as well).

I think there’s a number of them that even output Canvas elements, even.

Looks pretty simple, you just put all your data in the url for he graph you’re requesting, correct? If you’re letting users edit the data in JS, I guess you’d best send little ajax requests to the api with the updated data to get a new graph image.

If you want to go the SVG route, there is Raphael also.

Ok after looking at the API and its real simple. thanks guys

well this Rapheal looks really cool! not to sure how to use it yet but ill have to dive into it later

Raphael is a bit like writing pure ActionScript code for developing SWF files using the Flex SDK. The difference is that you are not tied to a plugin that people have to download and install and there is no need to compile a binary file. The browser just needs to support JavaScript. If it doesn’t, it’ll simply display the table or list items that are used to provide the data for the graph or chart. What’s great is that there is VML or SVG support going back to IE6, so it’s a pretty good cross-browser solution for dynamic charts and graphs.

I was hoping to post some examples of how well this works with Symphony some time soon.

Well, i think im going to go the google chart API route. The Raphael isnt working for some reason. but i also cant add the image src for the imges either? symphony throws out an error

The following error was returned: loadXML(): EntityRef: expecting ‘;’ in Entity, line: 53

Ok Rapheal is awesome! not i am trying to figure out how to translate the data from input fields from sympony to the code? any idea

make sense?

loadXML(): EntityRef: expecting ‘;’ in Entity, line: 53

Did you encode your ampersand? &

umm, sorry i suck at this posting code stuff!…

<img src="http://chart.apis.google.com/chart?chs=500x500&amp;chd=t:60,40,<xsl:value-of select="weight"/>&amp;cht=lc&amp;chl=Start|Finish&amp;chco=000000&amp;chp=3.5" />

why doesnt that work? any ideas?

It should be like that:

<img src="http://chart.apis.google.com/chart?chs=500x500&amp;chd=t:60,40,{weight}&amp;cht=lc&amp;chl=Start|Finish&amp;chco=000000&amp;chp=3.5" />

ahhhhh XSLT 101!!!! i can take an element from XML and place it anywhere with the {} thanks!! should have remembered that

ok.. i tried to figure this out but now i must ask the pros

So i have that working but is there a way where for each entry number would be added to the image?

i have a for each loop that takes each number and makes a new image…but i would like it to be added to the same string to 1 image? thoughts?

thanks

<img src="http://chart.apis.google.com/chart?chs=500x500&amp;chd=t:{call-template name="name"}}&amp;cht=lc&amp;chl=Start|Finish&amp;chco=000000&amp;chp=3.5" />

is it possible to call a template name in there?

No, you can’t do that. I haven’t looked in depth at what you’re doing but you might try using a param…

Call templates usually return values. So you could use a call-template to return a value to a variable and use this in the chart URL:

<xsl:variable name="my-variable">
    <xsl:call-template name="my-template">
        // your with-param here
    </xsl:call-template>
</xsl:variable>
<img src="...{$my-variable}..."/>

But as czheng suggests, it depends on just what you’re trying to do. I suggest looking up a few beginner XSLT resources to see whether a call-template is really what you need.