コルドバ：クリックした場所の色を取得

Question

私はcordovaを使用しています6.1.1。画面上に画像があり、クリックした場所のピクセルの色を知りたい。私はネイティブのアンドロイドでそれを行う方法を知っていますが、私はcordovaでそれをしたいです。

以下は、私がタッチイベントをキャプチャするために使用しているコードです。

document.getElementById('image').addEventListener('touchstart', function(event) { 
    console.log('got click start event' + event); 
}); 

タッチイベントが発生していますが、ピクセルとそのタッチの色を識別する方法がわかりません。

ありがとうございました。

Answer 1

JavaScriptを使用してこれを行うことができます。しかし<image>の代わりに<canvas>を使用する必要があります。イベントリスナー関数でこのコードを入力します。

var myImg = new Image(); 
myImg.src = 'image.jpg'; 
var x1, y1, x2, y2; // change your coordinates value according to your need; 
x1 = 1; 
y1 = 1; 
x2 = 0; 
y2 = 0; 
var context = document.getElementById('canvas').getContext('2d'); 
context.drawImage(myImg, 0, 0); 
data = context.getImageData(x1, y1, x2, y2).data; 

次に、dataはピクセルの色を持つ配列です。配列は、r、g、b、およびaの値を持ちます。

Answer 2

はあなたがタッチ要素を持ったら、

function touchStart(event){ 
    var currentElement = event.target; 
} 

、次のコードを使用してタッチ要素を取得し、その属性がまっすぐでなければなりません取得することができます。