1

Processing.js references state that the @pjs preload directive supports loading base64 images. However, it does not state how to use those prelaoded images via loadImage() or by other means.

The closest equivalent is base64 font preloading using the same method; which can be used via createFont() by their font-name (without the extension.)

But I don't understand how to use preloaded images in the same manner, as images have no embedded names like fonts do. What am I doing wrong?

As for using base64 data:uri without preloading, I have found that loadImage() takes such data readily.

Is it possible to load base64 images via loadImage() and what other options do I have with this API?

Gilles 'SO- stop being evil'
  • 104,111
  • 38
  • 209
  • 254
Scio
  • 13
  • 1
  • 5
  • So far, I have learned what the "data:image/png;base64" part means. I have also noticed that the linked reference page uses a comma in place of the semi-colon before "base64" but I haven't been able to get the preloading to work regardless. **However, base64 encoded data:uris work directly in `loadImage()` without any `@pjs preload` directive.** But this does not answer the original question, and the query still remains valid. – Scio Sep 17 '11 at 08:44
  • This is probably a good issue to raise on the processing.js issue tracker, https://processing-js.lighthouseapp.com/projects/41284-processingjs/overview – Mike 'Pomax' Kamermans Oct 06 '11 at 21:40
  • Ah, of course. I am quite late, but see that the error remains unchanged so I'll file an issue. – Scio Dec 22 '11 at 17:26
  • Hi. Did you preloaded a base64 image? – gal007 Apr 16 '13 at 19:24

1 Answers1

1

You actually implicitly answered your own question. Base64 data actually doesn't need preloading because it is immediately available (i.e. no images need to be downloaded, you just provided the function with all the data it needs) so you can just pass it to loadImage and things will work.

I'll make a note to adjust our documentation, because it's a bit silly to note that you can preload from Base64 data, when there is no functional point in doing so.

Mike 'Pomax' Kamermans
  • 49,297
  • 16
  • 112
  • 153
  • I apologize for being so very late. – Scio Dec 22 '11 at 17:18
  • 1
    for all i know, it works as described in processing.js, but base64 encoded images do take time to 'load' even if they are inline. There is a delay, roughly mapped to the complexity of the image, to initially decode the data. – jedierikb Sep 07 '12 at 13:28
  • http://stackoverflow.com/questions/4776670/should-setting-an-image-src-to-data-url-be-available-immediately – jedierikb Sep 07 '12 at 14:22
  • while true, preloading binds an image's URL as cache resource identifier. It would be very odd to preload a base64 URL, and then have to loadImage() using that same (very long) base64 url! =) – Mike 'Pomax' Kamermans Sep 23 '12 at 22:11