From my research, i understand there are three ways to place an svg file inside HTML:
using embed:
<embed src="plot1.svg" width="500" height="320" type="image/svg+xml" />
using object:
<object data="plot1.svg" width="500" height="320" type="image/svg+xml" />
using iframe:
<iframe src="plot1.svg" width="500" height="320"> </iframe>
I've experimented with all three on a test rig (django built-in dev server, rendering the pages in Firefox 3.6). Under this obviously sterile environment, i haven't noticed any difference between the three--w/r/t performance or resolution.
My Question is whether one of these is better than the other two, and if so, which one. The answer might of course depend on the facts, which i've tried to limit to what's relevant:
We frequently display data (e.g, time series) on our website, usually created in response to some user action; based on that user action, a call is made to a database, the data returned is crunched and sent to the plotting engine, which renders a static image which is then embedded in the page--very standard stuff.
This works fine, but i would like to add some interactive features to these charts (e.g., tooltips, hyperlinked axis labels, highlighting a group of points w/in a plot). Some of the charts are fairly sophisticated (e.g., multi-panel conditioning) and i have not found a javascript chart library that includes these features. I finally settled on using the same plotting library (Lattice in R) but rendering each chart in svg and then adding the user-interaction features in a post-processing step, which consists essentially of javascript functions which manipulate the XML directly.