使用基于 DirectShow 的虚拟相机和 Electron 框架来渲染内容<div>元素</div><div id="text_translate"><p>我正在尝试使用<a href="https://en.wikipedia.org/wiki/Electron_(software_framework)" rel="nofollow noreferrer">Electron</a>框架构建桌面应用程序，该框架可以将特定&lt;div&gt;元素的 output 内容发送到基于<a href="https://docs.microsoft.com/en-us/windows/win32/directshow/directshow" rel="nofollow noreferrer">DirectShow</a>的虚拟相机。</p><p> 在著名的<a href="https://github.com/roman380/tmhare.mvps.org-vcam" rel="nofollow noreferrer">Viveks 虚拟相机</a>和<a href="https://docs.microsoft.com/en-us/windows/win32/directshow/push-source-filters-sample" rel="nofollow noreferrer">Sample Push Source Filter</a>的帮助下，我能够创建在虚拟相机中渲染桌面的虚拟相机。</p><p> 现在我想将此虚拟相机与 electron 应用程序一起使用到&lt;div&gt;的 output 内容。 我无法弄清楚应该采取什么方法来实现这一目标？ 我想我必须开发 DirectShow Capture Filter 它将与我不确定的虚拟相机交互。</p><p> 将&lt;div&gt;内容渲染到虚拟相机的方法应该是什么？</p></div>

Question

I am trying to build Desktop application using Electron framework which can output content of particular <div> element to DirectShow based virtual camera.

With the help of famous Viveks virtual camera and Sample Push Source Filter I am able to create virtual camera which is rendering Desktop in virtual camera.

Now I want to use this virtual camera with electron app to output content of <div> . I am not able to figure out what should be approach to achieve this? I guess I have to develop DirectShow Capture Filter which will interact with virtual camera which I am not sure.

What should be approach to render <div> content to virtual camera?

Answer 1

https://docs.microsoft.com/en-us/windows/win32/directshow/step-2--declare-cvideorenderer-and-derived-classes

It appears you'd need to get the window handle HWND for the Electron window and write to a RECT within that window, similar to how you'd do it with a DirectX swapchain. I'm not sure there's a way specifically to render to an element within the window, but you may be able to expose some variable that your C++ component could read to determine the viewport.