Save Website as .jpg with ESP32

[Vogeldodel]

Hi Guys,
I implemented a simple weather station with an ESP32 which then uploads the Data as a webserver with Google charts to display nice charts.
Now i want to display my charts on a Display (e-paper display to save energy) attached on a second ESP32.

Because I don't want to draw my charts pixel by pixel my plan was to save my existing website as an .jpg on a SD Card and then simply upload it on the Display.
Is it somehow possible to download and save a website as .jpg with an ESP 32 periodically ?
If you have other ideas to implement my purpose please let me know.
Thank you very much.

[ESP_Sprite]

With an ESP32? Not really. In order to render any website, you'd have to parse the HTML, CSS, javascript, download the images, etc. Look in task manager (or your OSses equivalent) how much memory your browser uses and try to imagine if that would fit in an ESP32, either with or without 4MiB of PSRAM.

You may be better off using something on your website to 'flatten' the HTML page to a JPG/PNG. Either use a library that directly outputs image data instead of html/css/javascript, or use something like Chrome or Firefox in headless mode (headless = don't open a window, render directly to jpg/png) on your server.

[Vogeldodel]

Thank you for your reply!
I now got a little further and was able to convert my google charts to a png on my webserver.
(https://developers.google.com/chart/int ... s/printing)
It creates an URI in base 64.

With my browser I am now able to simply download the png or just copy the base64 format from the adress line.
Is it now somehow possible to just get this base 64 code with my ESP32 from my webserver?
Currently I am just able to get the xml code and print it on serial with

Code: Select all

char server[] = "IP adress of my webserver";

  if (client.connect(server, 80)) {
    Serial.println("connected");
     client.println("GET  HTTP/1.1");  
    client.println("Host: server");                 
    client.println("Connection: close");
    client.println();}
 
 if (client.available()) {
      while (client.connected()) {
          char c = client.read();
Serial.print{c}
}
}

With this i unfortunately i dot get the base 64 code of the displayed image but only my "chart.getImageURI()" java command.
Is it possible to get the full URI of the png here?

[ESP_Sprite]

I don't think that will work. Google Charts will generate this PNG using the Javascript on the page that runs... in your browser. No browser means no Javascript execution means no PNG.

[Vogeldodel]

Too bad...but thanks.
do you have another elegant Idea to get my graph without pixel by pixel drawing on my display?
Is there a method to draw charts into a picture or any format which can be uploaded to a display with an esp32?

[ESP_Sprite]

You could use a server-side library that can draw charts... maybe even use the Google chart thing in a Node.js environment on your server or something, but to be honest, that's a bit out of my area of expertise.