openmv 图像一维数组_第N维数组和图像处理。

openmv 图像一维数组

跳舞语法 (Dancing Syntax)

介绍 (Introduction)

About a month into the Flatiron School Bootcamp, a friend of mine gave me this advice:

进入Flatiron学校训练营大约一个月后，我的一个朋友给了我以下建议：

“Learning to read code will help you become a better programmer.”

“学习阅读代码将帮助您成为更好的程序员。”

At first, I heard that and thought, “Yeah!” It made sense to me, but while working on labs, I came across some code that I struggled to make sense of:

一开始，我听到了，然后想：“是的！” 这对我来说很有意义，但是在实验室工作时，我遇到了一些难以理解的代码：

Unfamiliar code alert! What’s going on here? What’s a Pixel Matrix?

陌生的代码警报！ 这里发生了什么？ 什么是像素矩阵？

A function called rgbToHex, a pixel matrix, an npm package, some loops, hex codes, and a lot to do with arrays. Fascinating! At a high-level, data.js is loading a file into an npm package called get-pixels, that package is processing the data, which results in a nested array of hex codes. My brain was in overload! I wanted to understand, but so much was unfamiliar. Could I read my way into figuring this out?

名为rgbToHex的函数，像素矩阵，npm包，一些循环，十六进制代码以及与数组有很大关系的函数。 迷人！ 从高层次上讲，data.js正在将文件加载到名为get-pixels的npm包中，该包正在处理数据，这导致嵌套的十六进制代码数组。 我的大脑超负荷了！ 我想了解，但是非常陌生。 我可以读一下解决这个问题的方法吗？

After all, I didn’t need to try to understand it, it’s some helper code for the lab. The purpose of the lab was to learn how information flowed between components in React. The challenge was to finish implementing the functionality for an in-browser pixel drawing app.

毕竟，我不需要尝试去理解它，它是实验室的一些帮助代码。 实验室的目的是了解React中组件之间信息的流动方式。 挑战在于完成为浏览器内像素绘图应用程序实现功能。

Painting the learn symbol!

画学习符号！

Okay! Let’s move on, BUT WAIT… What about that code from earlier?

好的！ 让我们继续前进，但请等待...早先的代码呢？

At first glance, I didn’t know what was going on, but transforming images into pixel data and rendering those pixels as divs seemed pretty bomb.com. With my friend’s advice in mind, Let’s pick it apart!

乍一看，我不知道发生了什么，但是将图像转换为像素数据并以div形式渲染这些像素似乎是bomb.com。 考虑到我朋友的建议，让我们把它分开！

获取像素 (Get-Pixels)

Let’s start with the npm package! After taking a look at the documentation, I found out that Get-Pixels reads the pixel data from an image and returns the result as a ndarray (Nth-Dimensional Array).

让我们从npm包开始！ 查看文档后，我发现Get-Pixels从图像中读取像素数据，并将结果作为ndarray(第N维数组)返回 。

Specifically, it:

具体来说，它：

“Returns An ndarray of pixels in raster order having shape equal to [width, height, channels].”

“以栅格顺序返回形状等于[宽度，高度，通道]的像素nd阵列。”

Two things are new to me here: Raster order and ndarrays.After a quick search, I found out that Raster order describes the or