Databases
StackOverflow2013
Postsdbo
POCordova iOS - CANVAS image resolution
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POCordova iOS - CANVAS image resolution
    primarykey
    data
    text
    <p>I have an application where the users shoots or selects a picture and it gets displayed on a <strong>canvas</strong> (<strong>Cordova 3, iPhone4S</strong>) with Cordova Camera API.</p> <p>Now I am experiencing a problem with image sizes. iPhone Screenshots, Landscape Photos, Portrait Photos all have different resolutions and sizes. And often the image gets cut or stretched in my canvas.</p> <p>I tried it with image tag before. That worked well. But I am having problem with <strong>canvas</strong>.</p> <p>At the moment I have</p> <pre><code>var canvas = document.getElementById("myCanvas"); canvas.width = 640; canvas.height = 960; canvas.style.width = "100%"; canvas.style.height = "100%"; </code></pre> <p><strong>It works if I load a screenshot in the canvas</strong>, but if I load a photo in the canvas it gets cut.</p> <p>Here two photo examples (portrait and landscape) loaded from iPhone's photo library.</p> <h2>How it is:</h2> <p><img src="https://i.stack.imgur.com/JEvPem.jpg" alt="enter image description here"></p> <h2>How it should be:</h2> <p>(the one at the bottom)</p> <p><img src="https://i.stack.imgur.com/qozx2m.jpg" alt="enter image description here"></p> <h2>How it is:</h2> <p><img src="https://i.stack.imgur.com/nQXdTm.jpg" alt="enter image description here"></p> <h2>How it should be:</h2> <p><img src="https://i.stack.imgur.com/qrZiPm.jpg" alt="enter image description here"></p> <p><strong>Any Idea how to get the canvas to display the full image with every ing size/resolution?</strong></p> <p>Thank you.</p>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USKallewallex
    1. USKallewallex
    plurals
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. COPlease also show the code where you use `drawImage()` . I assume you're trying to achieve something [like this](http://abdiassoftware.com/easycanvas/samples/sample_drawimageprop.html)?
      singulars
      1. POCordova iOS - CANVAS image resolution
      1. USepistemex
    2. CO`canvas.drawImage(img, 0, 0);` but I already managed to find a solution. I am now using targetWidth and targetHeight parameter in camera.getPicture function. But I have another problem now, regarding getting the clicked pixels color (**see below**). I don't know if I should open a new question for that.
      singulars
      1. POCordova iOS - CANVAS image resolution
      1. USKallewallex
    3. COA new question is probably best for this as it differs from the original question.
      singulars
      1. POCordova iOS - CANVAS image resolution
      1. USepistemex
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

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