Actually no - I'm moderately familiar with SVG, and when implemented
it works fairly spiffilly I suspect the issue is my ignorance and the
fact that I'm basically practicing voodoo programming and throwing
things together that I don't actually deeply understand. I seem to
have issues with object oriented systems and sometimes don't 'get' the
model properly.
That said - going by the original blog comments where I stole this
code from, and the particular way this is breaking, I *suspect* I'm
setting up the xlink namespace incorrectly in this context, where I'm
creating a 'pseudo-document' and placing it in the html via
javascript, as opposed to actually embedding a document.
My reasoning - none of the actual svg I've tested is broken - even the
<g> group command works properly (Do a transform on a group, and it
properly transforms each and every member - and that is probably the
most breakable 'pure' svg command I've tested so far) - the break
comes when you <use> an item by it's ID via the xlink:href="#id"
system - and xlink is a separate namespace from svg.
So far, all the items that are broken (Definitions, transforming a
group *by id*, gradients, et al) explicitly use xlink, which as I
understand it is pretty solid. And all these things work fine the way
I have it set up within an svg document, so I don't think svg or xlink
is broken.
Soooo - I suspect *I* have broken xlink in this context somewhere,
because I don't know what I'm doing and there's a subtle difference
between this 'pseudo-document' I've set up and a 'real' svg document
that's embedded via html - <G>. Given that I'm not getting some kind
of 'reference does not exist' error after the namespace was declared,
the ID's would appear to exist, but be empty - Worst case scenario is
that their empty due to the order of something in the DOM or
javascript, but that seems unlikely.
But I'm not liable to solve it tonight - posting from work and it's
been busy - <G>.
Jonnan
On Jul 30, 10:27 am, "Mark S." <throa...@yahoo.com> wrote:
> Hello Jonnan,
>
> Thanks for reporting back. Eric's Raphael library interface code can
> do amazing things, but my interest isn't animation (yet), and I'd like
> to avoid having to learn yet another interface language. But it might
> be unavoidable. It appears from your other post that the SVG
> implementation may be a bit broken. Perhaps its a kind of vapor-
> technology -- all the rage in 2002, but hasn't really been supported
> by the industry as well as one might like.
>
> My thought prior to this was that I could write a TW script that would
> create a separate file with the SVG code, and then embed it using the
> <embed> tags. A little bit clunky, but still portable in some sense of
> the word.
>
> Thanks for your work!
> Mark
>
> On Jul 29, 4:08 pm, Jonnan <jonnan.w...@gmail.com> wrote:
>
> > And Hah!!! Thank you sir - I'd have never thought about jQuery there;
>
> > And the tweak needed? Add the Namespace!!
>
> > config.macros.SVG =
> > { handler: function (place, macroName, params, wikifier, paramString,
> > tiddler)
> > { var svg = params[0]
> > var svgObject = document.createElement('object');
> > svgObject.setAttribute('type', 'image/svg+xml');
> > svgObject.setAttribute('data', 'data:image/svg+xml,'+ '<svg
> > width="100%" height="100%" version="1.1" xmlns="http://www.w3.org/2000/
> > svg">'+svg +'</svg>');
> > jQuery(place).append(svgObject);
> > }
> > };
>
> > And then <<SVG "<circle r='50' cx='50' cy='50' fill='green'/>">>
>
> > Gives you a green circle. There was some confusion on the original
> > blog about what SVG this would handle properly, but even simple svg
> > objects gives a bit more flexibility in TiddlyWiki, and I'd rather
> > lose some functionality and be able to stick with clean xml than
> > overreach for something that someone has to learn a specialized system
> > to work with (He said, like xml/svg is simple - <G>.)
>
> > Thanks again - I've been piddling with this off and on for awhile, and
> > knew I was missing something stupid and simple.
>
> > Jonnan
>
> > On Jul 29, 12:10 pm, "Mark S." <throa...@yahoo.com> wrote:
>
> > > I think you're making great progress. Embedding SVG would allow TW to
> > > be used for parts diagrams, games, maps ... lots of cool stuff.
>
> > > In your code, try replacing:
>
> > > $(place).appendChild(svgObject);
>
> > > with :
>
> > > jQuery(place).append(svgObject);
>
> > > And replace your macro with:
>
> > > <<SVG "<circle r='50' cx='50' cy='50' fill='green'/>">>
>
> > > Ok. Now you should get a working embedded "something".
> > > Unfortunately, as you will see, the code doesn't render as SVG -- it
> > > renders as embedded XML, and complains that it doesn't have a style
> > > sheet. Can't help but think that one more little tweak might be the
> > > ticket.
>
> > > -- Mark
>
> > > On Jul 29, 5:11 am, Jonnan <jonnan.w...@gmail.com> wrote:
>
> > > > I feel like I must be both reinventing the wheel, and the most
> > > > retarded caveman ever to do it,but to expand the functionality of
> > > > TiddlyWiki for writing stories, I have been trying to get a macro to
> > > > interpret/add inline svg graphics to tiddlywiki.
>
> > > > I have found all sorts of things where people have gone well beyond
> > > > the simple thing I want - science graphs, interactive charts, and so
> > > > on, and I've found a code snippet (http://softwareas.com/inline-svg)
> > > > for doing inline svg that, going by the reactions of seemingly
> > > > competent people that posted at the time, seems to obviously just be
> > > > something anyone even slightly competent could cut and paste into a
> > > > macro and at least get a simple graphic to work.
>
> > > > I'm at the "It's so obvious a child could see it - Go find me a
> > > > child!" point - I no longer care if I look like a blithering idiot, I
> > > > would just like to know what obvious thing I'm missing that makes
> > > > turning this:
> > > > <<SVG "<circle r=\"50\" cx=\"50\" cy=\"50\" fill=\"green\"/>">>
>
> > > > config.macros.SVG =
> > > > { handler: function (place, macroName, params, wikifier, paramString,
> > > > tiddler)
> > > > { var svg = params[0]
> > > > var svgObject = document.createElement('object');
> > > > svgObject.setAttribute('type', 'image/svg+xml');
> > > > svgObject.setAttribute('data', 'data:image/svg+xml,'+ '<svg>'+svg
> > > > +'</svg>');
> > > > $(place).appendChild(svgObject);
> > > > }
> > > > }
>
> > > > into a functional macro so much harder than it seems like it should
> > > > be?
>
> > > > I'm almost certain the actual error is on the last line (at least the
> > > > macro doesn't deliver an error when it's commented out), but I have
> > > > tried pointers, functions 'this', 'here', 'place', and a dozen other
> > > > things to get it to actually output the svg into the file as an
> > > > object, and I'm obviously missing something.
>
> > > > With apologies for the order of frustration and a side of being a
> > > > whiny ***** - <G>. I don't know javascript/DOM, but this looks like it
> > > > should be so bloody simple?
>
> > > > Thanks again - Jonnan
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To post to this group, send email to TiddlyWiki@googlegroups.com
To unsubscribe from this group, send email to
tiddlywiki+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/TiddlyWiki?hl=en
-~----------~----~----~----~------~----~------~--~---
