最近在做一个feature，在地图中布置道具，想法是可以绘制任意图像曲线的轨迹，思路是，读取一个图像，二值化，根据地图中需要的长宽，缩放图像，然后将图像转化为二维数组做为绘制图像的数据源。

这里要用到几个图像处理的操作，所以查找了下当前的图像处理库，觉得OpenCV是个不错的选择，而且由于新版本的openCV是用C++编写，很多git上的开源项目将opencv封装后给javascript调用，我用的是node-opencv

其实图像文件除了像素信息还存储了很多数据，我需要的，只是像素信息，那么首先要知道图像的通道是多少，像灰度图，它的通道是1，常用的RBG图，通道就是3， 也就是说，一个100100的图像，每一行，其实是有1003个项，就是说，每一个像素，存储了R，G，B三个像素的信息。

知道了这些信息，事情就好办多了，下边是我是用node-opencv写的代码：

    function BinaryArrayFromImage(imagePath, width, height)

    {

    var cv = require('../opencv/lib/opencv');

    cv.readImage(imagePath, function(err, im) {

      if (err) throw err;

      var w = im.width();

      var h = im.height();

      if (w < 1 || h < 1) throw new Error('Image has no size');

      var binaryImage = im.threshold(200, 255, "Binary");

      console.log("image converted to binary image");

      binaryImage.resize(width,height);

      //  binaryImage.convertGrayscale();

      console.log(binaryImage.channels());

       var imageMatrix = new Array();

       for(i=0;i<height;i++)

       {

       imageMatrix[i] = new Array();

       var index = 0;

       for(j=0;j<width*3;j+=3)

       {

       if(binaryImage.pixelRow(i)[j]<100)

       {

       imageMatrix[i][index]=1;

       }

       else

       {

       imageMatrix[i][index]=0;

       }

       index++;

       }

       }

       binaryImage.save('./convertedImage.jpg');

       return imageMatrix;

    });

    }

本文由职坐标整理并发布，了解更多内容，请关注职坐标WEB前端Node.js频道！