Workarounds to displaying an SVG image?

[gonzule]

Hi, I'm trying to display an SVG image using FBink but its not part of the features. I'm looking for a workaround to it but haven't been able to find anything that works by running python on my Kobo Aura. Any ideas of an already existing workaround to get this working in fbink?

I was thinking maybe converting the SVG to another format, but after trying a few recommendations i found online (e.g. cairo) they don't seem to work well on my kobo (while installing some, the reader would crash, or i would get an error that there isn't enough storage while downloading the necessary packages/libraries)

[DNSB]

If they are fixed images, can you convert them before sending to your Kobo? Assuming you are not downloading the images directly to your Kobo.

[gonzule]

ah, forgot to mention that I am generating these inside my Kobo through a python script. I'm using a script that collects weather data and replaces some text on a preexisting SVG image with the weather info, but them i am struggling to display this on my kobo.

[Szybet]

python can't convert images via a simple library? rust can do that, even chatgpt will tell you such a program then simply compile it using cross

[geek1011]

Originally Posted by gonzule

I was thinking maybe converting the SVG to another format, but after trying a few recommendations i found online (e.g. cairo) they don't seem to work well on my kobo (while installing some, the reader would crash, or i would get an error that there isn't enough storage while downloading the necessary packages/libraries)

How exactly are you trying to install them? I'd recommend just compiling them yourself.

Alternatively, with a bit of code, it should be possible to make some nice bindings between FBInk and resvg.

[sublipri]

Originally Posted by geek1011

Alternatively, with a bit of code, it should be possible to make some nice bindings between FBInk and resvg.

I had a quick try at using resvg with the bindings I've been working on. Got a basic SVG to print but haven't figured out how to scale it to the screen size yet, and might need to deal with transparency too.

Spoiler:

use fbink_rs::FbInk;
use resvg::tiny_skia;
use resvg::usvg::{self, fontdb, Size};

fn main() {
    let svg_data = include_bytes!("../test.svg");
    let fbink = FbInk::new(Default::default()).unwrap();
    let state = fbink.state();
    let width = state.view_width;
    let height = state.view_height;
    let size = Size::from_wh(width as f32, height as f32).unwrap();

    let tree = {
        let opt = usvg::Options {
            default_size: size,
            dpi: 300.0,
            ..Default::default()
        };
        let mut fontdb = fontdb::Database::new();
        let font = include_bytes!("../DejaVuSans.ttf");
        fontdb.load_font_data(font.to_vec());
        usvg::Tree::from_data(svg_data, &opt, &fontdb).unwrap()
    };
    let mut pixmap = tiny_skia::Pixmap::new(width, height).unwrap();
    resvg::render(&tree, Default::default(), &mut pixmap.as_mut());
    fbink
        .print_raw_data(pixmap.data(), width as i32, height as i32, 0, 0)
        .unwrap();
}

Originally Posted by gonzule

I'm using a script that collects weather data and replaces some text on a preexisting SVG image with the weather info, but them i am struggling to display this on my kobo.

If you don't have any experience with Rust I could try creating a binary that'll display the SVG if you attach an example file that's been processed by your Python script.

[gonzule]

Originally Posted by sublipri

If you don't have any experience with Rust I could try creating a binary that'll display the SVG if you attach an example file that's been processed by your Python script.

Thanks. My experience is VERY limited, so I'm just googling and ChatGPT-ing everything, using some basic coding knowledge i have from years ago.

Attached is an example SVG I'm getting as output. As mentioned, easiest thing would be to be able to get FBink to display it as is, or t convert it to png or another format supported by FBink.

I have been able to create this SVG both on my computer, and by running a Python script on my Kobo Aura. This is the source script
https://github.com/mattzzw/kindle-we...weather2svg.py

[sublipri]

Originally Posted by gonzule

Attached is an example SVG I'm getting as output. As mentioned, easiest thing would be to be able to get FBink to display it as is, or t convert it to png or another format supported by FBink.

Try the binary I've attached. It works on my Glo with your example file. You'll need to provide the path to the SVG file as the first argument when you call it from the python script.

[gonzule]

Thanks for this. Will test it over the weekend and report back!

[gonzule]

Originally Posted by sublipri

Try the binary I've attached. It works on my Glo with your example file. You'll need to provide the path to the SVG file as the first argument when you call it from the python script.

Hi, i finally managed some time to test this, after struggling with a lot of personal things!it works perfectly, and i was able to properly display the SVG after it was created by the script, so thank you so much!

Quick question re your binary. Does it support other fbink commands/options? I tried displaying the image using some parameters that work for mewith fbink, but they don't seemt to be recognised here:

fbink -c -f -i weather-script-output.png -g w=-1,h=-1 works ok, but neither of these other 2 seem to work

fbink-svg -c -f -i weather-script-output.svg -g w=-1,h=-1
or
fbink-svg weather-script-output.svg -c -f -i -g w=-1,h=-1

I need those extra parameters to force a complete refresh of the screen. I haveone of those screens that are VERY prone to ghosting effects, so I need a full refresh to be able toproperly see the image.

The workaround i'm using now is displaying a blank png using fbink and the desired parameters, and then using your binary to display the SVG.

[sublipri]

Originally Posted by gonzule

i was able to properly display the SVG after it was created by the script, so thank you so much!

No problem!

Quick question re your binary. Does it support other fbink commands/options? I tried displaying the image using some parameters that work for mewith fbink, but they don't seemt to be recognised here:

The binary doesn't support any of the commands/options from the fbink CLI. It's just a simple utility that's hard-coded to print an SVG with the same properties as your example file. I've modified it to do a flashing clear in (I think) the same way your fbink command does, so hopefully this new version won't require a workaround. Also changed it so that if given a directory as a second argument it will load any font files from there instead of using a hard-coded font, which might make it usable with different SVGs. So you should either use it as:

fbink-svg weather-script-output.svg

or

fbink-svg weather-script-output.svg /path/to/fonts

Here's the code, FWIW:

Spoiler:

use std::{env, fs};

use fbink_rs::{FbInk, FbInkConfig};
use resvg::tiny_skia;
use resvg::usvg::{self, fontdb};

fn main() {
    let Some(svg_path) = env::args_os().nth(1) else {
        println!("Usage: ./fbink-svg SVG_FILE FONT_DIR");
        return;
    };
    let svg_data = fs::read(svg_path).expect("Failed to read SVG file");
    let config = FbInkConfig {
        is_flashing: true,
        is_cleared: true,
        ..Default::default()
    };
    let fbink = FbInk::new(config).expect("Failed to initialize FBInk");
    let state = fbink.state();
    let width = state.view_width;
    let height = state.view_height;

    let tree = {
        let mut fontdb = fontdb::Database::new();
        let default_font = include_bytes!("../default.ttf");
        if let Some(font_dir) = env::args_os().nth(2) {
            fontdb.load_fonts_dir(font_dir);
        } else {
            fontdb.load_font_data(default_font.to_vec());
        }
        usvg::Tree::from_data(&svg_data, &Default::default(), &fontdb)
            .expect("Failed to create SVG tree")
    };
    let mut pixmap = tiny_skia::Pixmap::new(width, height).expect("Failed to render SVG");
    resvg::render(&tree, Default::default(), &mut pixmap.as_mut());
    fbink
        .print_raw_data(pixmap.data(), width as i32, height as i32, 0, 0)
        .expect("Failed to print SVG to screen");
}

[gonzule]

Thanks again! This worked like a charm! I'll work now using kfmon to launch the script to generate the svg and then displaying it using your binary and should be all set! Thank you for taking the time to coding this