Basic filter logic visual chart (+ selfcontained wikitext/html/svg tiddler (w graphics))

137 views
Skip to first unread message

A Gloom

unread,
Aug 19, 2019, 11:36:54 PM8/19/19
to TiddlyWiki
A sneak peek at something from WikiWitchery...

This demonstrates not just a visual guide of basic filter run logic that should be easier to understand, but also a self contained tiddler of mixed content-- wikitext, html and svg graphics.  Everything in one tiddler that is much smaller than using traditional external raster images for simple line art graphics.

This comes from a larger item-- a visual multi-stage filter with selective filter run selectors and filter (logic)/run function/prefix.  The graphics are to display in a panel to illustrate which (logic)/run function/prefix is being selected.

One interesting thing about svg is the ability to reuse pieces of other svg without having to retype the original svg code.  The first svg defines the common pieces that all 5 will use and the other 4 reuse the pieces from the first.

The self contained tiddler compares to a similar tiddler that uses transclusion of the same svg's in separate svg tiddlers, looks like this:

translusion tiddler export size: without svg's: 3 kb
with (in json file of 6 tiddlers): 15 kb

self contained tiddler export size: 9 kb

The self contained tiddler also will export as a static html file with the svg graphics embedded into the document-- also with a much smaller size than if raster images were embedded.  Perfect for charts and graphs-- WikiWitchery will have an example bar graph chart that was creared in TW with a very small file size and can be edited/altered in TW just like any tiddler.

Some browsers are finicky about svg's especially older ones so don't be surprised if the svg's don't display as advertised-- use the screenshots to compare your browser's displayed content against.

Also the svg's use the default font from the wiki they're being viewed in, so if you have nonstandard fonts, settings you may get usual results.

Any custom global css values you have set in your wiki could potentionally have an effect on this tiddler and could be a place to look if the tiddler doesn't display right.

the attached html version can be used if you don't wish to import the tiddler, use an iframe tiddler to display the hrml version in your wiki

A version using transclusion of svg tiddlers will be available on WikiWitchery.

filtervisual.jpg



powered by WikiWitchery
with K.A.O.S. inside >^.^<
Visual filter examples 2.tid
Visual filter examples 2.html

Jeremy Ruston

unread,
Aug 20, 2019, 5:02:32 AM8/20/19
to tiddl...@googlegroups.com
Hi Gloom

Great stuff, I love explanatory diagrams, and this example is very effective.

Best wishes

Jeremy


On 20 Aug 2019, at 05:37, A Gloom <barro...@gmail.com> wrote:



<filtervisual.jpg>



powered by WikiWitchery
with K.A.O.S. inside >^.^<

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/933cad3c-d1e8-45f2-948b-0ad255e41753%40googlegroups.com.
<Visual filter examples 2.tid>
<Visual filter examples 2.html>
<filtervisual.jpg>

A Gloom

unread,
Aug 25, 2019, 1:18:48 AM8/25/19
to TiddlyWiki
Great stuff, I love explanatory diagrams, and this example is very effective.

ty Jeremy, I actually remembered and used what I learned in school about sets-- they had similar illustrations.  I made a minor edit to the chart to connect the table text (tag examples) to connect with the diagram labels (tags=selection) since there seemed to be a disconnect between the differing terms used.
Reply all
Reply to author
Forward
0 new messages