Using (Raster) Images with VizHub

Any idea on how I can incorporate a raster image (JPEG, PNG, etc.) in my D3/React code on VizHub? I have two specific problems in mind.

  1. Image file is local on my computer… Is there a more direct way than hosting the image someplace else and using its URL?

  2. Making the image follow a similar behavior to SVG, in the sense that they maintain their relative positions and sizes and scale accordingly (ignoring that it won’t zoom in well, of course).

Oh yes this is currently something that’s not as smooth as I’d like in VizHub.

The story is, VizHub does not have any “file upload” feature, so at the moment binary files like images need to be hosted elsewhere. You can use, for example, GitHub Gist, in just the same way as is done for larve CSV files. You can also paste into a GitHub issue, then grab the URL from there.

We do hope to implement the “file upload” or “file attachment” feature one day. This is tracked here: vizhub-issue-tracker: File Upload

2 Likes

you can also store images as base64-encoded string, so you can store an image in javascript file:

3 Likes

Thank you @stushurik and @curran!

Whoah @stushurik that’s so cool! I had not even thought of that. Amazing idea.