UIImageにCIFilterをかけたimageのタップ座標から、そのpixelの色を取得したい。

Question

初めて質問させていただきます。

xcode内にリソースとして保存した画像を呼び出しimageViewとしてself.viewに配置します。
配置したimageViewにtapGestureでタップイベントを追加させます。タップしたimageViewの座標から、そのpointの色を取ろうとしています。

//インスタンス変数 
    var myImageView = UIImageView()

//xcode内に用意した.jpgファイルをimageViewとして表示。同時にimageViewにtapGestureを付与しました。
    override func viewDidLoad() {
        super.viewDidLoad()
        
        let image = UIImage(named: "testImage.jpg") 
        myImageView.image = image 

        myImageView.frame.origin = CGPointMake(0, 0) 
        myImageView.frame.size = image!.size 

        myImageView.userInteractionEnabled = true
        myImageView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: "tapAction:")) 

        self.view.addSubview(myImageView)
    }

//imageViewのタップ時にタップした座標のRGB値を表示する
    func tapAction(sender:UITapGestureRecognizer){ 
//タップした座標の取得 
        let tapPoint = sender.locationInView(self.myImageView)
//imageをdata化
        let pixelData = CGDataProviderCopyData(CGImageGetDataProvider(myImageView.image!.CGImage))
        let data: UnsafePointer = CFDataGetBytePtr(pixelData)

//タップした位置の座標にあたるアドレスを算出 
        let pixelAd: Int = ((Int(myImageView.image!.size.width) * Int(tapPoint.y)) + Int(tapPoint.x)) * 4
        
//それぞれRGBAの値をとる 
        let r = CGFloat(Int( CGFloat(data[pixelAd])/CGFloat(255.0)*100)) / 100 
        let g = CGFloat(Int( CGFloat(data[pixelAd+1])/CGFloat(255.0)*100)) / 100 
        let b = CGFloat(Int( CGFloat(data[pixelAd+2])/CGFloat(255.0)*100)) / 100 
        let a = CGFloat(Int( CGFloat(data[pixelAd+3])/CGFloat(255.0)*100)) / 100 

        let pixelColors = [r,g,b,a] 
        print(pixelColors) 
    }

上記のコードを実行すれば、たしかに指定の位置のRGBA値を出すことができます。
しかしimageにfilterをかけて同じことをしようとしても、うまくいきません。

//モノクロのフィルターを指定 
        let myFilter = CIFilter(name: "CIColorMonochrome")
        myFilter!.setValue(CIImage(image: myImageView.image!), forKey: kCIInputImageKey)
 //値の調整.
        myFilter!.setValue(CIColor(red: 0.5, green: 0.5, blue: 0.5), forKey: kCIInputColorKey)
        myFilter!.setValue(1.0, forKey: kCIInputIntensityKey)
 // フィルターを通した画像をアウトプット.
        let myOutputImage : CIImage = myFilter!.outputImage!
        let context = CIContext(options: nil)
        let cgImage = context.createCGImage(myOutputImage, fromRect: myOutputImage.extent)
        let newImage = UIImage(CGImage: cgImage)
 // 再びUIViewにセット.
        self.myImageView.image = newImage

このようにして上記と同様にtapActionを行っても、タップしたポイントとは異なるポイントのRGB値を表示します。
フィルターをかけたimageのタップした座標の正しいRGB値の取り方をご教授いただければと思います。

なお、UIImage(named: "testImage.jpg")のサイズは375667です。
別画像の10001000のサイズでは、フィルターをかけた場合でも、うまく指定の座標のrgb値を返しました。
このようなこともあり混乱しています。

どなたかお知恵を拝借できれば幸いです。
長文失礼しました。

雑なコードで申し訳ございませんでした。修正しました。

Comments

[fuzzball]

場所によって変数名がマチマチで検証できませんので、まともなコードを載せて下さい。

Answer 1

今回のケースは、画像の横サイズとデータの横サイズが一致しないために起こっている現象だと思われます。（1000x1000のときは両者が一致しているので問題にならない）

//1ピクセルのバイト数
let bytesPerPixel = CGImageGetBitsPerPixel(myImageView.image!.CGImage) / 8
//1ラインのバイト数
let bytesPerRow = CGImageGetBytesPerRow(myImageView.image!.CGImage)
print("bytesPerPixel=\(bytesPerPixel) bytesPerRow=\(bytesPerRow)")
        
//タップした位置の座標にあたるアドレスを算出
let pixelAd: Int = Int(tapPoint.y) * bytesPerRow + Int(tapPoint.x) * bytesPerPixel

ついでに、1ピクセルのサイズもキチンと取得するようにしてみました。
375x667のときはフィルタの有無でbytesPerRowが違っているはずです。

Comments

[compotaYAMADA]

早く正確な回答ありがとうございました。
正しいやり方までご教授いただき本当に感謝いたします。

どうしてもわからなかった部分がおかげさまでうまくいきました。
重ねてになりますが、本当にありがとうございました！