Note that there are some explanatory texts on larger screens.

plurals
  1. POCreate Vector Image in PHP to Allow Upscaling
    primarykey
    data
    text
    <p>This question is slightly long, so I'll try to be clear.</p> <p>On a website I co-develop, I created a drawing application that sends data about the lines drawn on the <code>&lt;canvas&gt;</code> element to the server to create an image and save it at multiple sizes, which works. There is the standard save which is saved to 320x212, with the smaller version at 240x176. However, some users on my site use a pretty antiquated device/browser for the application. It also has a smaller viewport, so the image is smaller, so server-side I'm currently multiplying the coordinates to compensate when saving the image to the standard size. But this has the side-effect of random unfilled parts of the image showing up, that were filled in on the canvas.</p> <p><a href="http://socialcu.be/Images/qn/fd3127b2a03dc5fddcb4c47bb40fc1d87dd2/e5567e491d0dabb1d494e326c671b10b4eaf09d8bf9d545a4d.png" rel="nofollow noreferrer">Example image http://socialcu.be/Images/qn/fd3127b2a03dc5fddcb4c47bb40fc1d87dd2/e5567e491d0dabb1d494e326c671b10b4eaf09d8bf9d545a4d.png</a></p> <p>(On the canvas for the smaller device's viewport, the entire bottom portion was green, while my method of multiplying the coordinates to compensate caused many unfilled portions to appear on the scaled-up image)</p> <p>So my first question is, would making the image as a vector image, scaling it up (while still a vector), and then saving it as a raster image fix that issue?</p> <p>And secondly (if the answer to the first is a yes), then what would be the best way of doing this in PHP? I've heard of Cairo, but the information on it (namely tutorials for the PHP package) is quite lacking. Optimally, is there a way to do this in Imagick, or a tutorial on how to use Cairo?</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload