1

So I want to make a tool like this

http://www.kevs3d.co.uk/dev/lsystems/

Each of the pixels in these l-systems are meaningful, so ideally I would want to be able to be able to pan/zoom and I would want it to look good on retina.

My idea for this was originally to use SVG with individual rectangles for where all the pixels would go. However this seems like a weird solution and I'm not sure what kind of performance I can expect.

So my question is: does anyone think this can work? Or can anyone suggest a different course of action?

  • I don't really understand the connection between SVG and "pixels" here. SVG is a format specifically suited to _not_ deal with pixels but with forms instead. – arkascha May 14 '16 at 18:54
  • High resolution displays are quite easily supported by means of the `srcset` attribute in `` tags. Just offer different solutions to the browser along with a size in css and the browser will pick the best suited resolution for the current situation. – arkascha May 14 '16 at 18:55
  • Sorry if I was unclear, and maybe part of the problem is that my approach doesn't make sense. In the pictures I linked above, each pixel is supposed to correspond to a given part of the data. However, the pixels don't show up well because it's canvas. So I really want something _like_ canvas, but that works for retina displays. So I was going with SVG. I see what you're saying about it being totally backwards though. – Tyler Smith May 14 '16 at 19:26
  • The issue with the `` is that I don't actually have images. I suppose a solution could be to generate images separately from the webpage and then display them, though. Is that how you suggest I go about this? – Tyler Smith May 14 '16 at 19:27
  • That is what is typically done. The images are create on-the-fly, so in a dynamic manner, based on the requested resolution. So you implement a simple image creation service, not a collection of precreated images. However obviously this requires the service to be fast enough for the use case. – arkascha May 14 '16 at 19:28

0 Answers0