How can I make a template that automatically lays a grid over images?

Finally I have what I wanted: A scalable, customisable, fullscreen gridviewer which now follows the first concept proposed by @saqimtiaz
ImageGridViewer.json (6.6 KB)

  • $:/plugin/ImageGrid/ViewerModal is a modal covering the entire screen, autosizing the grid either to squares or to a customizable grid. To have a square grid set vertical to zero
  • $:/plugin/ImageGrid/Macro defines the macro <<gridpic "url" "caption">> to call the modal
  • $:/config/ImageGrid stores the config data in (lines, size of squares) in a config tiddler

To see the modal at work just press the image generated by the macro … and enjoy.

There has been multiple great propositions in the thread: If you need static grids per image applied by a viewTemplate you should consider @Scott_Sauyet’s solution.

I want to thank for all the help @saqimtiaz , @buggyj , @Charlie_Veniot and @Scott_Sauyet

One discovery of this thread for me was the syntax for beautiful optionfields that Charlie showed in his demo, I am sure I will use this again.

<fieldset> <legend>''Zoom''</legend>
<$range tiddler="$:/temp/ImageGrid" field="scale" min="150" max={{{ [{$:/info/browser/screen/width}multiply[4]]}}} increment="1" default="0.5"/><$edit-text tiddler="$:/temp/ImageGrid" field="scale" tag="input" size="3"/> <br>
</fieldset>
3 Likes