前端对opencv识图的尝试-一一网

一：初步调研：

1：新项目需求：

通过读取甲方上传的城市设计图，识别地块、类别，后面在做一堆自动化操作….

拿到这个需求，前端使用canvas实现操作和展示，读取图片和一堆自动化由opencv完成。

2：尝试：

（1）：js直接使用python打包好的opencv.js包，opencv的代码是这样的：

先展示一个读取图和重新绘图的案例，看起来非常麻烦，而且opencv.js居然高达10.9M。

<script id="codeSnippet" type="text/code-snippet">
let src = cv.imread('canvasInput');
let dst = new cv.Mat();
let gray = new cv.Mat();
cv.cvtColor(src, gray, cv.COLOR_RGBA2GRAY, 0);
cv.threshold(gray, gray, 0, 255, cv.THRESH_BINARY_INV + cv.THRESH_OTSU);
cv.imshow('canvasOutput', gray);
src.delete(); 
dst.delete();
 gray.delete();
</script>
复制代码

（2）：node.js尝试

opencv4nodejs比较成熟。但是我尝试了一个上午，第一步安装，按各种教程来，依然无法通过。

（3）：同事用Java尝试：

图形的矩阵，java写起来很难受。自动化需求部分，java案例较少。

二：定调python

python-opencv也仅仅是调用c++的封装而已，

不过python好处是

1：文档和案例很多:

2：算法种类多全

3：语法简单，适应图形的矩阵信息

1：用python实现一个简单的读取图形方法

花了半天学了简单的python，就开始学opencv，B站很多好的python-opencv教程。

目前实现了：

（1）：读取图片

（2）：取到的地块信息：

周长，面积，x,y构成的坐标信息[{x,y}]

问题：

（1）：adaptiveThreshold这边有问题，在处理

（2）：地块颜色还没取到。

# 边缘检测import cv2

import numpy as np
def cv_findCotours(src):    
   # 为了更高的准确率，使用二值图像    
   img = cv2.imread(src)    
   # 闭运算 先膨胀在腐蚀    
   kernel = cv2.getStructuringElement(cv2.MORPH_RECT, (5, 5))  
   # 定义结构元素    
   closing = cv2.morphologyEx(img, cv2.MORPH_CLOSE, kernel)  
   # 闭运算    
   #黑白蒙层    
   gray = cv2.cvtColor(closing,cv2.COLOR_BGR2GRAY)
   # 第一次展示图片    
   cv2.imshow('lena', gray)    
   cv2.waitKey(0)    
   thresh = cv2.adaptiveThreshold(gray,255, 
   cv2.ADAPTIVE_THRESH_MEAN_C,cv2.THRESH_BINARY, 11, 4)  
   # ret,thresh =  cv2.threshold(gray, 0, 255, cv2.THRESH_BINARY + cv2.THRESH_OTSU)    
   #这边已经出现了点问题，多个聚在一起的识别有误。   
   cv2.imshow('thresh', thresh)    
   cv2.waitKey(0)    
   edges  = cv2.Canny(thresh,70,100)    
   cv2.imshow('canny', edges)    
   cv2.waitKey(0)    
   # 开始绘制轮廓    
   contours, hierarchy = cv2.findContours(thresh, cv2.RETR_TREE, cv2.CHAIN_APPROX_SIMPLE)
   # 得到数据，绘制轮廓    
   draw_img = img.copy()    
   res =cv2.drawContours(draw_img,contours,-1,(255,0,0),1);    
   json_res = []    
   for item in contours:          
     #面积        
     area = cv2.contourArea(item)        
     # 周长        
     perimeter = cv2.arcLength(item,True)        
     # 图形矩        
     imgM = cv2.moments(item)        
     #矩阵点坐标        
     box = []        
     ###.进行多边形逼近，得到多边形的角点        
     epsilon = 0.01*cv2.arcLength(item,True)        
     approx = cv2.approxPolyDP(item, epsilon, True)        
     box = key_point_2_array(approx)        
     json_res.append({            
        'points':box,            
        'area':area,            
        'perimeter':perimeter,            
        'imgM':imgM        })    
    # # 坐标    
    # 展示   
     cv2.imshow('canny',res)    
     cv2.waitKey(0)
    
    # 调用
    cv_findCotours('../demo3.png')
复制代码