Image integration in the dashboard

I tried but it doesn't work

Nodered starts automatically. I'll try the command lines to see if I get the information.

image

my static folder is c:\temp

the file is saved in c:\temp\test\gate_open.gif

so i type :1881/test/gate_open.gif

@Udina did you restart the machine after changing as @krambriw suggested ?

Yes, I restart the server whenever I make a change to a configuration file.

Here is the nodered startup report :

I have a broker problem at startup but I don't think it poses a problem for my image concerns. I don't see anything in the report that talks about "HTTPStatic"

I may be wrong, but do check if the changes you made for httpstatic in the settings file is the same file shown above?

2 Likes

Just as example from one of my computers, I have httpStatic: '/var/www/html/pics/'

So my images are in the pics folder and I can view them directly by typing http://192.168.0.241:1880/captured21.jpg

Therefore in my code in the ui-node I have:

<table>
    <tr><!-- Row 1 -->
    		<td style="text-align: center"><img src="/captured31.jpg" id='p31' width="405px"/></td>
   		    <td style="text-align: center"><img src="/captured12.jpg" id='p12' width="405px"/></td>
    		<td style="text-align: center"><img src="/captured41.jpg" id='p41' width="405px"/></td>
    		<td style="text-align: center"><img src="/captured11.jpg" id='p11' width="405px"/></td>
    </tr>
</table>
<table>
    <tr><!-- Row 2 -->
    		<td style="text-align: center"><img src="/captured32.jpg" id='p32' width="405px"/></td>
     		<td style="text-align: center"><img src="/captured22.jpg" id='p22' width="405px"/></td>
    		<td style="text-align: center"><img src="/captured21.jpg" id='p21' width="405px"/></td>
    <!--	<td style="text-align: center"><img src="/captured42.jpg" id='p42' width="405px"/></td> -->
   </tr>
</table>

As an example this works as expected. I think you need to double-check your settings

I think you found my problem !

I therefore have two instances of NodeRed, the first in this location ( This is where I make all my changes since installing Nodered ) :

The second instance found here :

I don't understand, I don't have the impression that this second instance was there a few days ago.

An idea ?

so make the httpstatic changes in the 'correct' settings file (which shows up in the startup log when you start node-red) and see if the problem is resolved ?

Modification succeeds, when starting nodered, the option of my static folder is mentioned

That's it, I managed to put an image, on the other hand, for a PNG image, how come I have a whole white surround ?

What is your ui-template size?

where can I find this information ?

It's good, I found it, I work on my template directly on the web browser with the inspector element (f12), it works well. Thanks for taking the time to help me :ok_hand: :+1:

1 Like

glad you could find the solution. if you dont mind can you post the final solution picture and also please mark the relevant post as solution and mark the thread as closed.

Here is the final image that I recreated for the occasion. thanks again

5 Likes