UIWebView w/HTML5 कैनवास और रेटिना डिस्प्ले

Question

मेरे ऐप में UIWebView है जो स्थानीय सामग्री को प्रस्तुत करता है। अगर मैं रेटिना आकार की छवि लेता हूं और इसे शरीर के लिए पृष्ठभूमि के रूप में उपयोग करता हूं, तो मैं इसे सीएसएस -webkit-background-size संपत्ति का उपयोग करके ठीक से स्केल कर सकता हूं। यह मुझे आईफोन 4 पर एक कुरकुरा, स्पष्ट छवि देता है।

एचटीएमएल 5 कैनवास टैग इतना सहकारी नहीं है। जब मैं drawImage कमांड को एक ही रेटिना आकार छवि को HTML5 कैनवास में रखने के लिए उपयोग करता हूं, तो यह विशाल स्क्रीन - भौतिक स्क्रीन की सीमाओं से पहले है। इस कोड को मैं उपयोग कर रहा हूँ है:

ctx.drawImage(retinaImage, 0, 0) 

अगर मैं drawImage पर ऊंचाई और चौड़ाई मापदंडों रखने की कोशिश, चित्र नीचे पैमाने स्क्रीन फिट करने के लिए, लेकिन यह ब्लॉक वाले और pixelated है। सीएसएस पृष्ठभूमि की तरह कुरकुरा नहीं है।

क्या कोई चाल है जो मैं HTML5 कैनवास के लिए उपयोग कर सकता हूं जो सीएसएस -webkit-background-size संपत्ति के बराबर है?

धन्यवाद!

अद्यतन:

यहाँ अंतिम कोड मैं इस समस्या को हल करने के लिए इस्तेमाल है।

 if (window.devicePixelRatio == 2) { 
      myCanvas.setAttribute('height', window.innerHeight * 2); 
      myCanvas.setAttribute('width', window.innerWidth * 2); 
      ctx.scale(2, 2); 
     } else { 
      myCanvas.setAttribute('height', window.innerHeight); 
      myCanvas.setAttribute('width', window.innerWidth); 
     } 

Answer 1

चेक बाहर http://joubert.posterous.com/crisp-html-5-canvas-text-on-mobile-phones-and: उम्मीद है कि यह भविष्य में किसी और में मदद करता है। ऐसा लगता है कि यदि आप डिवाइस पिक्सेलरेटियो द्वारा आयामों को एकाधिक करते हैं तो उस अनुपात के साथ-साथ इसे काम करना चाहिए।

यहां कुछ छद्म कोड है जो मेरे लिए काम करता है।

var ctx = myCanvasElem.getContext("2d"); 
ctx.attr("width", width * window.devicePixelRatio); 
ctx.attr("height", height * window.devicePixelRatio); 
ctx.scale(window.devicePixelRatio, window.devicePixelRatio); 
ctx.drawImage(img, x, y, width, height); 

मुझे बताएं कि क्या यह आपके लिए हल करता है!