Controlling inline image display

29 views
Skip to first unread message

robatki...@gmail.com

unread,
May 24, 2021, 3:38:46 AM5/24/21
to TopBraid Suite Users
Are there any options for controlling image size in inline displays using the ImageViewer ?

Holger Knublauch

unread,
May 24, 2021, 6:43:56 PM5/24/21
to topbrai...@googlegroups.com

No sorry, there are no such options. The complete source code of the ImageViewer is basically

<img className="ImageViewer" src={this.props.value.uri ? this.props.value.uri : this.props.value.lex} />

If the size applies to all ImageViewers you could theoretically add them to the CSS class "ImageViewer".

What is your particular requirement: do you want to set a max-width?

One option that is guaranteed to work is to scale the images themselves :)

Holger


On 2021-05-24 5:38 pm, robatki...@gmail.com wrote:
Are there any options for controlling image size in inline displays using the ImageViewer ? --
You received this message because you are subscribed to the Google Groups "TopBraid Suite Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to topbraid-user...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/topbraid-users/1517a0e5-acad-4817-8108-ef2343db2fe7n%40googlegroups.com.

robatki...@gmail.com

unread,
May 24, 2021, 8:44:27 PM5/24/21
to TopBraid Suite Users

OK just checking - will have to scale the images..

while we are here - lets imagine two properties
ex:thumbnail <a image>
ex:graphic <a bigger image>

can we define a shape that displays the thumb with a link to the full image in a popup or new tab if present, otherwise just displays the full image ?

Holger Knublauch

unread,
May 24, 2021, 8:47:01 PM5/24/21
to topbrai...@googlegroups.com


On 2021-05-25 10:44 am, robatki...@gmail.com wrote:

OK just checking - will have to scale the images..

while we are here - lets imagine two properties
ex:thumbnail <a image>
ex:graphic <a bigger image>

can we define a shape that displays the thumb with a link to the full image in a popup or new tab if present, otherwise just displays the full image ?

You could even do all this with a single property. Simply make the values rdf:HTML literals such as

"""<a href="http://large.image><img src="http://thumbnail"></img></a>"""^^rdf:HTML

If you cannot use that approach, you'd need to define your own widget that takes the image URL and renders it in the way you want.

Holger



On Tuesday, 25 May 2021 at 08:43:56 UTC+10 Holger Knublauch wrote:

No sorry, there are no such options. The complete source code of the ImageViewer is basically

<img className="ImageViewer" src={this.props.value.uri ? this.props.value.uri : this.props.value.lex} />

If the size applies to all ImageViewers you could theoretically add them to the CSS class "ImageViewer".

What is your particular requirement: do you want to set a max-width?

One option that is guaranteed to work is to scale the images themselves :)

Holger


On 2021-05-24 5:38 pm, robatki...@gmail.com wrote:
Are there any options for controlling image size in inline displays using the ImageViewer ? --
You received this message because you are subscribed to the Google Groups "TopBraid Suite Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to topbraid-user...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/topbraid-users/1517a0e5-acad-4817-8108-ef2343db2fe7n%40googlegroups.com.
--
You received this message because you are subscribed to the Google Groups "TopBraid Suite Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to topbraid-user...@googlegroups.com.

robatki...@gmail.com

unread,
May 24, 2021, 9:19:16 PM5/24/21
to TopBraid Suite Users
ok - I've just been playing with HTML to embed cross references to taxonomy terms into text so understand

the thing about the img src= is that it will trigger a call to a uri automatically - is that perhaps a security issue that might get stopped in the future?

Holger Knublauch

unread,
May 24, 2021, 10:41:19 PM5/24/21
to topbrai...@googlegroups.com


On 2021-05-25 11:19 am, robatki...@gmail.com wrote:
ok - I've just been playing with HTML to embed cross references to taxonomy terms into text so understand
BTW you could even *infer* the <a href>... stuff using a sh:values rule, and thus keep the thumbnail and full image as separated properties that you keep hidden in view mode.


the thing about the img src= is that it will trigger a call to a uri automatically - is that perhaps a security issue that might get stopped in the future?

Isn't this how web browsers always work to fetch an image?

Holger


robatki...@gmail.com

unread,
May 24, 2021, 11:27:28 PM5/24/21
to TopBraid Suite Users
yep - but with an editor you can inject the URL its going to call from outside ..
Reply all
Reply to author
Forward
0 new messages