I'm building a cordova-based app using Ionic framework (http://ionicframework.com/) and part of my application has to show very large images (± 5000px x 2300px). The images are converted from PDF to PNG using ghostscript and are then stored on the server. In my web-app, these images are first cached locally and then displayed in an ionScroll container (http://ionicframework.com/docs/api/directive/ionScroll/) inside an "img" tag.
When I open the app in the browser (Google Chrome) on my PC the image is rendered nicely and looks like this:
On my iPhone 6 Plus running iOS 8.1.1 the same image is rendered like so:
http://pasteboard.co/2hHvsNZU.png
As you can see, the text is not even readable on mobile device.
Does anyone know what is going on? I wonder if this is because of the device limitations. Any suggestions on how to display an image this large differently? I've tried using a HTML5 canvas but it's too big and drawImage does not show anything on the mobile device.
Thanks!
