I don't see the TiddlyWikiSVG tiddler at your site -- maybe you forgot
to upload?
The reference material I have says you have to define your gradients
in a <def> tag inside of the <svg> tag, and then link them with
fill:url() syntax when drawing the elements. I suppose this complexity
is the reason Raphael was developed.
I developed a little java program awhile back to generate a part in
SVG, but I only needed a handful of SVG instructions to make that
work. Guess I need to do some more homework.
Good luck!
Mark
On Jul 30, 3:26 pm, Jonnan <jonnan.w...@gmail.com> wrote:
> 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
-~----------~----~----~----~------~----~------~--~---
