Javascript - Simulare il viewport

Buongiorno ragazzi
Sono alle prese con il mio motore in javascript.
Ho una domanda da fare.

In pratica ho realizzato una sorta di simulatore del Viewport di come accade sulle DirectX o OpenGL.

95.254.226.192/MireWeb/

in pratica ho utilizzato due div.

uno chiamato viewport l'altro chiamato canvas ovviamente.

il viewport l'ho impostato di una dimensione minore del canvas questo per fare da contenitore.
ad al momento giusto, mi basta semplicemente scrollare

viewport.ScrollLeft per ottenere uno scrolling perfetto.

C'è un problema però.

Se lancio questo html dal browser, lo scroll funziona senza nessun problema.
ma quando vado a farlo da mobile, non sembra funzionare.

Cioè. Se apri dal cellulare quell'indirizzo, ok dal browser del cellulare mi funziona.
Ma creando l'app utilizzando il browser della CrossWalk e compilando con Cordova
lo scroll non risponde.
è come se quel comando non vale.

Avevo pensato ad un'altra alternativa.

visto che la funzione drawImage ha sia il source che la destinazione, potevo
provare ad usare quella funzione. ma come posso simulare la stessa cosa con le coordinate?
cioè utilizzano il void drawImage anziché utilizzare direttamente lo scroll del div?

Principalmente mi interesserebbe far funzionare lo scroll del div
perché così facendo mi risparmio un bel pò di seccature.

Caso mai non c'è soluzione, allora opto per il drawImage.

Consigli?

Edit:
L'app in questione è questa

play.google.com/store/apps/…

Per quel che può aiutare, lanciando il tuo link con l'ultima versione di Chrome non mi permette di premere i pulsanti di navigazione correttamente (su giù destra sinistra).

Ogni browser gestisce il scrollTop / scrollLeft in maniera leggermente diversa. Non ti consiglierei di andare per quella strada, se puoi evitarlo.

uhm credo che il mio browser incorporato nell'app sia quello di chrome.
credo... il browser si chiama crosswalk

crosswalk-project.org/

ho provato a cercare in giro, e vedo che effettivamente ci sono persone che utilizzano il mio stesso metodo
ma non ho capito se a loro funziona o meno

github.com/crosswalk-project/chromium-crosswalk/blob/master/third_party/WebKit/LayoutTests/fast/overflow/…

ma ho capito che l'unica cosa che cambia da questa pagina ed il mio sorgente è l'overflow


Mio sorgente

<div id="Viewport" style="width:640; height: 480; overflow:hidden;">
<canvas id="canvas" width="800" height="600"></canvas>
</div>

Mentre li è usato un iframe
non sò se può significare qualcosa...

<div style="height:100px; width:100px; overflow: scroll; display: block;" id="main">

Qui vedo overflow impostato su scroll.

Ma sinceramente eviterei di mostrare una scrollbar in un gioco.
sarebbe ridicolo.

a mali estremi poi seguirò il tuo consiglio piero.
quello di ingorare lo scroll del contenitore e di gestirlo tramite il translate

Personalmente trovo una pessima idea mischiare operazioni su generici blocchi HTML e il disegno su canvas. Un sistema come il tuo poteva aver senso quando il canvas non era disponibile. Se trovi il lavoro troppo complesso rifatti a qualche framework come processing.js.