Python 3.x Plotly dash-动态显示阵列图像

上下文：我正在尝试使用Plotly Dash创建一个简单的图像处理应用程序。它必须能够显示图像，并在更新图像显示时对图像执行一些操作。图像将动态生成或上载到应用程序

图像采用

numpy-ndarray

格式，因为我的处理基于使用这种格式的

numpy

和

matplotlib

操作

问题：什么样的Python代码允许显示数据阵列，同时能够通过一些GUI操作进行更新？

我基本上是在搜索dash能够提供给

matplotlib.pyplot.imshow（）

研究：在我的研究中，我发现其中可能包含了我开始工作所需的所有基本功能，但作为Plotly Dash的初学者，我很难提取我需要的代码，而且它似乎也没有使用numpy

---

我找到了一个与我所问的非常接近的方法，但唯一的答案是不包含numpy数组。

我找到了一个解决方案，使用

Flask.Response

和

html.Img

的

src

参数，以及

openCV

进行图像编码：

import dash
import dash_core_components as dcc
import dash_html_components as html
import cv2

from flask import Flask, Response
import numpy as np
import time


def get_image(seed=0):
    # strip slide
    size = 400
    res = np.mod((np.arange(size)[..., None] + np.arange(size)[None, ...]) + seed, [255])

    ret, jpeg = cv2.imencode('.jpg', res)

    return jpeg.tobytes()


def gen():
    i = 0
    while True:
        time.sleep(0.03333)
        frame = get_image(i)
        yield (b'--frame\r\n'
               b'Content-Type: image/jpeg\r\n\r\n' + frame + b'\r\n\r\n')
        i += 1


server = Flask(__name__)
app = dash.Dash(__name__, server=server)


@server.route('/video_feed')
def video_feed():
    return Response(gen(),
                    mimetype='multipart/x-mixed-replace; boundary=frame')


app.layout = html.Div([
    html.H1("Webcam Test"),
    html.Img(src="/video_feed")
])

if __name__ == '__main__':
    app.run_server(debug=True)

结果:

在浏览器上，条带正在缓慢移动，我想gif会做更好的演示

小心不要每秒发送太多图像，否则会使应用程序和浏览器溢出，最终导致崩溃。因此，在发电机回路中使用

time.pause

或其他等效限制器

很难，我仍然对其他人会怎么做感兴趣。此解决方案的一个缺点是，我认为用户必须共享路径

/video\u feed

中定义的相同显示