问题标签 [drawingcontext]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
0 回答
141 浏览

c# - 巨大的 WPF 控件中缺少渲染的矩形

我需要一个Control300000000Width和的 WPF Height,我将Rectangles根据一些输入在其上绘制。我正在绘制Rectangle控件OnRender的。出于测试目的,我将控件放在 a 中ScrollViewer,并绘制Rectangles从 (0,0) 到 (1000,1000) 的每个像素。如果Width&Height是 1000000,Rectangles则正确绘制,如下所示,(Rectangles绘制在从 (0,0) 到 (1000,1000) 的所有像素上,因此看起来像下面链接中的 on)

https://social.msdn.microsoft.com/Forums/getfile/950012

但是,如果我将大小增加到 3000000,则图中缺少几行,如下所示, https://social.msdn.microsoft.com/Forums/getfile/950018

我的 Xaml:

我正在使用以下代码OnRenderWaferMapControl

包含 x , cellInfoy 坐标。点计算是从左下角开始绘制的。在我的示例中长度为 1。

谁能帮帮我,这里有什么问题。如果你需要我这边的任何东西,请告诉我。

0 投票
1 回答
1592 浏览

c# - 如何在 c# wpf 应用程序中绘制具有不同 z 索引的多条线

我正在使用DrawingContext.DrawLine函数来画线。但似乎线条会影响画布上其他线条的位置。所以我需要为所有行添加不同的 z-index 值。有什么方法可以绘制具有不同 z-index 的线条,这样它们就不会影响其他线条的位置。或者是否有任何其他方法可用于绘制线条,例如绘制我已将DrawText方法替换为TextBlock.

下面是我现在使用的示例代码:

0 投票
1 回答
627 浏览

wpf - 在 WPF 中使用 DrawingContext 进行奇怪的绘图

我正在开发一个自定义 WPF 控件,该控件应该在可滚动区域中可视化数千个图形基元。控件模板的核心部分如下:

为了获得更好的性能,所有绘图操作都在 ItemAreaElement 的 OnRender 方法中执行。为了获得清晰的绘图,我还在初始化代码中使用了以下设置:

但是,我的绘画有一些奇怪的问题。为了演示它们,我将 ItemAreaElement 的定义简化为以下内容:

当我在配备 282ppi 超高清屏幕(系统比例因子为 300%)的主开发笔记本电脑上启动此代码时,我得到了这张图片:

在此处输入图像描述

或者,在使用网格线放大paint.net 之后:

在此处输入图像描述

如您所见,我的 ItemAreaElement 的左边缘和上边缘被控件的边框部分覆盖。一定要这样吗?有没有我可以用来避免这种情况的设置?

第二个问题是不包括起点的线(请参阅我的“单元格”的左上角)。这是预期的行为吗?如果是这样,如何强制 WPF 绘制起始像素?

第三个问题是绿线应相交的位置或与设备无关的点(我的单元格的右下角)。如您所见,这一点是锯齿状的。我预计在那个地方只会看到一个绿色的广场。我可以在 DrawingContext.DrawLine 方法的帮助下实现吗?或者我是否需要使用更复杂的几何图形以及多点线的特殊设置等?

顺便说一句,当我在具有“经典”96 ppi 显示器且操作系统的比例因子设置为 100% 的测试电脑上启动此代码时,右下角的情况要好一些:

在此处输入图像描述

但我什至看不到顶行的水平红线或第一列的垂直红线。我希望在那里看到它们,但不会被控件的边界覆盖。如果您知道如何解决所有这些问题,请告诉我。

0 投票
1 回答
652 浏览

wpf - WPF DrawingContext DrawGlyphRun 模糊文本

我正在使用 DrawingContext DrawGlyphRun(GlyphRun) 函数使用https://smellegantcode.wordpress.com/2008/07/03/glyphrun-and-so-forth/中的解决方案在画布中绘制文本。

我在 FormattedText 上使用它,因为它更快,而且它也用于计算文本宽度。

除了两个问题外,这很好用:

  1. 文字模糊(见下图)。顶部的文本使用 GlyphRun 显示。底部文本使用质量更好的 FormattedText 显示。

模糊图像

  1. 无法显示日文或中文字符。

字符的问题似乎是 GlyphTypeface.CharacterToGlyphMap 找不到 jp 或 cn 字符,所以我不确定如何处理这些字符。

0 投票
1 回答
133 浏览

html - 访问 HTML5 Canvas 的 DrawingContext2D 保存/恢复堆栈?

有没有办法在后台访问 HTMLCanvas元素DrawingContext2D saverestore堆栈?

目的是为了save一个基本状态,clip它的一个区域,允许一些操作发生,这些操作可能适用clip于不确定的顺序(即saverestore可能有save2-3 个状态到堆栈并且永远不会恢复它们,或者它可能会restore多次,并且save在返回父函数之前丢失原始状态,然后父函数将尝试进入restore堆栈中不再存在的状态。)

我宁愿在没有包装类的情况下执行此操作,DrawingContext2D因为 JavaScript 在每个函数调用时都会变慢一些,并且渲染往往是时间敏感的。

能够限制被restore调用函数中可能的调用次数而不依赖被调用函数来维持该限制也很棒。

0 投票
1 回答
217 浏览

c# - WPF TreeView 删除画线(ReDraw)

因为普通的 TreeView 不符合我的需要,所以我创建了自己的 TreeView,继承自 TreeView 并在我的 TreeViewItems 之间画线。像这样的东西在此处输入图像描述

到目前为止一切顺利,但我想在树构建和绘制后重新绘制(删除添加线)。目前我在 OnRender 方法中做所有事情,该方法已经提供了 DrawingContext 来绘制线条。

但是在控件渲染一次后,我无法访问 DrawingContext。保存在 lokal 变量中,我无法删除已绘制的形状或重绘任何内容,因为 DrawingContext 已被释放。

0 投票
2 回答
1126 浏览

c# - 如何为我的矩形设置不透明度(绘图上下文)

这是我的矩形

所以我的问题是如何设置我的不透明度,这是正确的方法吗?

0 投票
1 回答
1584 浏览

c# - WPF MouseMove InvalidateVisual OnRender 更新非常慢

我在 Google 或 Stack Overflow 上都没有找到任何有用的东西,或者根本没有答案(或者我可能只是不知道要搜索什么)——我能得到的最接近的问题是这个:性能缓慢的原因WPF

但是我想在这个简单的程序中找到这个滞后的底部,也许我只是没有做正确的事情。

我在 UI 元素的 OnRender() 中渲染了大约 2000 个点和它们之间的线,本质上是创建一个折线图。没关系,但我想用 MouseMove 平移图形。这很好用,但问题在于 LAG。每当用鼠标拖动时,我都希望能顺利更新,我认为用它们之间的线重新绘制 2000 个点对于 i5 CPU 来说就像在公园里散步一样。但它非常慢,即使在我家里的笔记本电脑上的低分辨率也是如此。所以我检查了性能分析器。OnRender() 函数几乎不使用任何 CPU。

MouseMove 和 OnRender 几乎不占用多少 CPU

事实证明,是布局发生了变化并使用了如此多的 CPU。

布局使用最多的 CPU

“布局”完成时间最长

布局花费的时间最多 它说对 Visual 树进行了更改——但没有进行任何更改——只是调用了 InvalidateVisual

现在,我听说了 Visual Tree 这个术语,但在这个简单的项目中几乎没有任何视觉效果。只是主窗口上的一个 UI 元素。它使用的是绘图上下文,我曾认为绘图上下文像位图一样绘制,还是使用自己的事件/命中框等绘制 UI 元素?因为我想要的只是 UIElement 像图像一样,但也可以处理鼠标事件,所以我可以拖动整个事物(或使用鼠标滚轮缩放)。

所以问题:

  1. 如果布局导致缓慢/滞后,我该如何防止这种情况?
  2. 我还注意到很多垃圾收集是有道理的,但我不希望它在渲染期间发生。我宁愿在它空闲的时候这样做。但如何?

这是来源:

.cs 文件

.XAML 文件

0 投票
0 回答
339 浏览

wpf - WPF - 频繁重新创建和绘制非常大的位图时性能下降

在我的应用程序中,每当用户移动鼠标时,我都必须重新创建一个具有非常高分辨率的新位图(它的最大尺寸可能达到 3000 像素 x 3000 像素)。位图的大小取决于鼠标的位置。例如:鼠标在屏幕左上角时尺寸最小,鼠标在屏幕右下角时尺寸最大。

在此处输入图像描述

问题是当鼠标离左上角很远时,位图的尺寸很大。我检查并意识到在OnRender中通过DrawingContext重新创建和绘制位图的时间很好。但是框架可能存在瓶颈,将DrawingContext中的绘图数据传输到屏幕上需要很长时间。这会影响 WPF 鼠标输入系统,因此下一个鼠标移动事件触发得很晚,我的应用程序变得迟钝。这是该站点上与我的问题有关的另一个问题: WPF 性能缓慢的原因

你有什么想法可以解决我的问题吗?

PS:每当用户移动鼠标时,我都会创建一个新的位图并在其上绘制一些东西,然后调用 InvalidateVisual() 并将位图绘制到 DrawingContext 中。

0 投票
1 回答
320 浏览

javascript - Javascript ImageData 绘图缩放不正确

该程序的想法是拥有一张地图图像并在该地图上覆盖黑色画布。然后用户将点击画布的某个部分,类似于喷漆工具,鼠标附近的像素将在画布上变得透明。因此,将显示地图(就像战争迷雾类型的功能)。当我在画布的左上角附近单击时,喷漆按预期工作,但是当我在画布上进一步向右和向下单击时,变得透明的像素在向右和向下更远......知道这里有什么问题吗?这是代码: