View Base64 PDF In ThingWorx

[TomerH]

Hi,

I am trying to view base64 pdf using thingworx mashup.

Came across old message that helped me view the pdf using a value display widget

https://community.ptc.com/t5/ThingWorx-Developers/How-to-show-base-64-content-of-PDF-in-Thingworx-Mashup/m-p/723472#M51519

The problem the value container height is 153px (width 1879) and not full screen

Tried changing min height property but did nothing.

Anyone can help view a base64 pdf to fit window?

[Arun_C]

Hi @TomerH 

Have you tried with the fixed height & width in pixels? 

result = '<iframe src="data&colon;application/pdf;base64,'+ IP_Data+ '"  height="153px" width="1879px" frameborder="0"></iframe>';

If its not okey for you. We will look for other sugestions.

 Thanks & Regards,

Arun C

[TomerH · Accepted solution]

Hi Arun,

Your suggestion did not fix my issue as I wanted the pdf to fit the screen.

But once I saw that using pixels indeed had effect, that gave me direction for a fix.

The problem is the widget placing the iframe inside a span, for some reason by default it is not 100%.

a little custom css did the trick and for others I will post it below.

.screen-100 .widget-ptcsvaluedisplay::part(item-value) {
width: 100%;
height: 100%;
}

.screen-100 .widget-ptcsvaluedisplay::part(item-value-container) {
width: 100%;
height: 100%;
}

.screen-100 .widget-ptcsvaluedisplay::part(value-container) {
width: 100%;
height: 100%;
}

.screen-100 .widget-ptcsvaluedisplay::part(overflow-control) {
width: 100%;
height: 100%;
}

"screen-100" is the custom css name placed in the widget CustomClass property.

Best Regards,

Tomer.

[Arun_C]

HI @TomerH ,

Great its looking good & Thank you for posting your fix here.

Thanks & Regards,

Arun C