Inserting graphic-rendering widgets in tables?

110 views
Skip to first unread message

stefano franchi

unread,
Mar 6, 2019, 2:12:29 PM3/6/19
to tiddl...@googlegroups.com
Problem: Building a table with images by inserting some image-rendering widgets in table cells does not work directly, only by transclusion.

That is, if <$myWidget myField=" ..." /> is a widget that outputs an (SVG) image and whose myField field contains newlines, the following does not work:

| <$myWidget.... /> | <$myWidget.... /> | <$myWidget.... /> |

but the transclusion works (where the GraphicTiddlers simply contain the graphic-redendering widget):

| {{myGraphicTiddler1}} | {{myGraphicTiddler2}} | {{myGraphicTiddler3}} |

I can appreciate that the transclusion solution is more in tune with T's overall philosophy, but it would be more convenient for writing and editing to have a direct inclusion when a table contains several small images. I am (wildly) guessing the problem is that <$myWidget .. /> contains newlines and that breaks the table-building algorithm.
Is there any workaround?



Cheers,
S.

--
__________________________________________________
Stefano Franchi

stefano...@gmail.com
http://stefano.cleinias.org

BurningTreeC

unread,
Mar 6, 2019, 2:35:10 PM3/6/19
to TiddlyWiki
Hi, try this on tiddlywiki.com:

|<$image source="Motovun Jack.jpg"/> |<$image source="Motovun Jack.jpg"/> |<$image source="Motovun Jack.jpg"/> |

three widgets showing an image and the table seems to be built

stefano franchi

unread,
Mar 6, 2019, 2:39:08 PM3/6/19
to tiddl...@googlegroups.com
Thanks for the tip. That confirms my suspicion that the problem is with my custom widget, which takes a multi-line ASCII description of a diagram and outputs SVG code.

I wonder if here is some way to hide the newlines from the table-building algorithm.

Ton Gerner

unread,
Mar 6, 2019, 2:45:20 PM3/6/19
to TiddlyWiki
Hi Stefano,

You can try HTML tables.

Cheers,

Ton

Jeremy Ruston

unread,
Mar 9, 2019, 12:23:33 PM3/9/19
to tiddl...@googlegroups.com
Hi Stefano

The wikitext table syntax doesn’t allow the inclusion of newlines, so you’ll have to use the underlying HTML elements:

<table>
<tbody>
<tr>
<th>
Column A
</th>
<th>
Column B
</th>
</tr>
<tr>
<td>
23
</td>
<td>
32
</td>
</tr>
</tbody>
</table>

Best wishes

Jeremy

--
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 post to this group, send email to tiddl...@googlegroups.com.
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/CAJODLwaU9JbMTqQsbU9OUCokpkGQvs5g%3DWw3xUgo2vDR6LzWaQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

barro...@gmail.com

unread,
Mar 9, 2019, 7:04:27 PM3/9/19
to TiddlyWiki
The ways I display images (including svg's) without using transclusion.  Maybe it would be of help with your endeavour...

Test using external images in the same directory of wiki.  You can copy and paste the code below or import the attached tiddler to expetiment with.  Change the file names to match your local images.

3 ways to display jpg's in wikitext tables, (doesn't work for svg's (see further below))

| [img[wfortean.jpg]] |<$image source="wfortean.jpg"/> | <img src="file:wfortean.jpg" width="" height="" /> |

test svg display

<img src="file:arrowright2down2.svg" width="25%" height="" />

the 3 ways to display images in wikitext tables, doesn't work for svg's (but see further below)

| [img[arrowright2down2.svg]] | <$image source="arrowright2down2.svg"/> | <img src="file:arrowright2down2.svg" width="25%" height="" /> |

using html markup for tables, all 3 ways to display images work for jpg's and svg's

<table><tr>
<td>[img[wfortean.jpg]]</td>
<td><$image source="wfortean.jpg"/></td>
<td><img src="file:wfortean.jpg" width="" height="" /></td>
</tr><tr>
<td>[img[arrowright2down2.svg]]</td>
<td><$image source="arrowright2down2.svg"/></td>
<td><img src="file:arrowright2down2.svg" width="" height="" /></td>
</tr></table>
test113.tid
Reply all
Reply to author
Forward
0 new messages