在 OpencvJS 中绘制不同颜色的图形元素？答案

【问题标题】：Draw graphical elements with different color in OpencvJS?在 OpencvJS 中绘制不同颜色的图形元素？
【发布时间】：2021-03-24 11:04:38
【问题描述】：

我正在尝试使用 Opencv.js 绘制不同的图形元素，并且我正在尝试为不同的元素使用不同的颜色。无论我为表示颜色的 Scalar 对象设置什么参数，我显示的唯一颜色似乎都是白色。关于我应该如何解决这个问题的任何想法？

例如 cv.line(mat, new cv.Point(midPoints[1][0], midPoints[1][1]), new cv.Point(midPoints[3][0], midPoints[3][1]), new cv.Scalar(188, 255, 0), 3);

上面的代码画了一条线，但是当它应该是绿色的时候它是白色的。

【问题讨论】：

标签： javascript opencv colors

【解决方案1】：

您确定您没有在灰色图像上绘图吗？

input_image = cv2.imread("./docs/images/test_image.jpg", cv2.IMREAD_COLOR)
cv2.namedWindow("RGB Image", cv2.WINDOW_NORMAL)
cv2.namedWindow("Gray Image", cv2.WINDOW_NORMAL)

gray_image = cv2.cvtColor(input_image, cv2.COLOR_BGR2GRAY)

line_in_color = cv2.line(input_image, (10, 300), (800, 300), (188, 255, 0), 15)
line_in_gray = cv2.line(gray_image, (10, 300), (800, 300), (188, 255, 0), 15)
    
cv2.imshow("RGB Image", line_in_color)
cv2.imshow("Gray Image", line_in_gray)

cv2.waitKey(0)

这是上面代码的结果：

【讨论】：

是的，我确定。图像本身是彩色的。然而，无论我输入什么值，结果线总是白色的。
@Vlad 你能检查一下这是否有效吗？ cv.line(mat, new cv.Point(20, 160), new cv.Point(100, 160), [0, 0, 255, 255], 10)
谢谢。我知道 alpha 通道，但是我之前无法让它工作。现在它起作用了。谢谢。