问题标签 [onrender]

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 投票
1 回答
1660 浏览

javascript - BIRT 中的全局函数和全局变量,并从元素的 onRender 访问它

我正在研究 BIRT 交叉表报告。在我的报告中,我需要创建一个全局数组变量,并且需要根据交叉表的列数填充数组变量。我正在计算交叉表的 onRender 事件中的 columnCount,并且我需要将此值传递给全局函数,并且需要从全局函数的结果中填充全局变量。然后在其他一些交叉表或同一个交叉表中,我需要访问这个数组变量。

我只是根据交叉表中数据元素的 onRender 中生成的列计数生成列名 A、B、C...Z、AA、AB...等,我需要通过传递此计数来填充数组变量到全局函数,然后函数返回它作为参数接收的数字的 excel 名称(如 1-A、2-B、3-C、....26-Z、27-AA...等)结果被添加到数组变量中。此数组变量将用于数据元素 onRender 的交叉表的另一行,我不能对数据集执行此操作,因为交叉表中应用了排序函数(以克服交叉表的默认排序)。

我怎样才能做到这一点,或者任何其他简单的方法来处理这个?

0 投票
1 回答
1249 浏览

c# - How to paint a custom Progress Bar by code (WPF)

I created a WinForms custom progress bar, but it flickers a little. It's double buffered, but it still flickers a little bit, so I'm trying WPF to see if the little flickering can get away.

I'm completely new to WPF. As far as I've read, WPF's OnPaint(PaintEventArgs e) method is called OnRender(DrawingContext drawingContext).

The problem:

enter image description here

My image is not "overriding" the green bar. Now, if I change Rect myRect = new Rect(0, 0, ((Width * Value) / (Maximum - Minimum)) + 5, Height); to... let's say, Rect myRect = new Rect(0, 50, ((Width * Value) / (Maximum - Minimum)) + 5, Height);, the result is this:

enter image description here

So, the rainbow bar is drawn, but not over the progress bar. If I write Rect myRect = new Rect(0, 0, ((Width * Value) / (Maximum - Minimum)) + 5, Height);, it's drawn but UNDER the progress bar. What do I do to have a rainbow progress bar (and other custom progress bars for that matter)?

Thank you for your help.

Edit: The original progress bar (that one that flickers a little bit) has way more than the rainbow. I just started with the rainbow to make a quick test in WPF and then try and add the other stuff. Just in case if you're wondering why such a simple progress bar was flickering in WinForms. It was because the WinForms one had more than the rainbow. Thank you.

0 投票
1 回答
8187 浏览

c# - 如何在 WPF 中动态绘制时间线

我正在尝试在 WPF 中绘制时间线。它应该基本上由3个矩形组成。

它应该看起来像这样(使用 XAML 硬编码): 时间轴

大的白色矩形应该填充所有可用空间,绿色矩形代表时间线上发生的事件的开始和持续时间。

代表这一点的模型是一个 TimeLineEvent 类,它有一个 TimeSpan 开始和一个时间跨度持续时间来表示事件何时开始以及持续多长时间(以滴答声或秒数或其他单位)。还有一个 TimeLine 类,它有一个 ObservableCollection,它保存时间线上的所有事件。它还有一个 TimeSpan 持续时间,表示时间线本身有多长。

我需要做的是能够根据事件的持续时间和开始以及它们之间的比率在时间轴上动态绘制事件(绿色矩形),以便根据事件发生的时间和持续时间绘制事件。时间线上可以有多个事件。

到目前为止,我的方法是制作一个仅包含一个画布元素的 TimeLine.xaml 文件。在代码隐藏文件中,我重写了 OnRender 方法来绘制这些矩形,它适用于硬编码值。

在 MainWindow.xaml 我创建了一个数据模板并将数据类型设置为 TimeLine:

为此尝试了不同的设置,但说实话我不确定我在做什么。然后,我有一个堆栈面板,其中包含一个列表框,该列表框使用我的数据模板和绑定 TimeLines,这是一个包含 TimeLine 对象的 ObservableCollection,在我的 MainWindow 代码隐藏中。

当我创建新的时间线对象时,这会绘制新的时间线,如下所示: 时间线

这样做的问题是它没有正确渲染绿色矩形,为此我需要知道白色矩形的宽度,以便我可以使用不同持续时间的比率来转换到一个位置。问题似乎是调用 OnRender 方法时 width 属性为 0。我尝试过覆盖 OnRenderSizeChanged,如下所示:在 WPF 中,如何在控件实际呈现之前获取控件的呈现大小? 我在调试打印中看到首先调用 OnRender,然后调用 OnRenderSizeChanged,然后通过调用 this.InvalidateVisual(); 让 OnRender 再次运行;在覆盖中。我可以得到的所有宽度属性仍然始终为 0,但这很奇怪,因为我可以看到它被渲染并具有大小。还尝试了其他帖子中显示的 Measure 和 Arrange 覆盖,但到目前为止还没有得到除 0 以外的值。

那么如何在时间轴上以正确的位置和大小动态绘制矩形呢?

抱歉,如果我在这里遗漏了一些明显的东西,我刚刚使用 WPF 工作了一周,我没有人可以问。如果您想查看更多代码示例,请告诉我。任何帮助表示赞赏:)。

0 投票
1 回答
142 浏览

javascript - 在 JavaScript 中检索 R 对象属性

我有一个包含 100 个观察值的双变量数据集。我使用了六边形分箱,最终得到了 26 个六边形分箱。为了保存 26 个六边形 bin 中的每一个中的 100 个观测值的行,我使用了base::attrR 中的函数。在下面的代码中,这是在以下位置完成的:

我正在尝试创建Plotly六边形分箱的交互式 R 对象,以便如果用户单击给定的六边形箱,他们将获得分组到该箱中的 100 个观察值的行。我已经完成了这个目标的一部分。我的 MWE 如下:

当我运行此代码并在 Web 浏览器中打开它时,我获得了一个如下所示的交互式绘图(绿色框不在绘图中;它被叠加用于解释目的):

在此处输入图像描述

如果我点击绿色框内的六边形,正确hexID的 40 和counts3 将打印到控制台。此时,我想获取放入那个六边形 bin 的 3 行原始数据框。

我知道如何在 R 中通过使用该函数onRender()htmlwidgets包的函数之外执行此操作base::attr。例如,我可以执行以下操作:

并收到以下正确的 3 个数据点,这些数据点被放入我点击的那个 bin 中:

我正在处理比这个 MWE 更大的数据集。出于这个原因,我使用该base:attr函数的目的是防止更大的数据帧四处飘荡。但是,我不确定如何转换函数的base::attr功能,以便我可以访问onRender()JavaScript 代码中单击的六边形 bin 中出现的适当数据点行。我确实将该pS$data对象包含在onRender()JavaScript 代码中,但仍然卡住了。

任何建议将不胜感激!

0 投票
1 回答
87 浏览

javascript - 在 JavaScript 中检索 R 对象属性 - 第 2 部分

我之前发布了一个类似的问题(在 JavaScript 中检索 R 对象属性)。在较早的帖子中,我过度简化了我的 MWE,因此不幸的是,我得到的答案并不真正适用于我的真正问题。在这里,我展示了为什么我可能需要在 JavaScript 中检索 R 对象属性(除非有另一个我不知道的选项)。

我有一个包含 100 个观察值的 5 变量数据集。我使用六边形分箱并创建了一个散点图矩阵。10 个散点图中的每一个都有 12-18 个六边形。为了保存所有 10 个散点图的每个六边形箱中的 100 个观察值的行,我使用了 R 中的 base::attr 函数。在下面的代码中,这是在以下位置完成的:

我正在尝试创建六边形分箱的交互式 R Plotly 对象,以便如果用户单击给定的六边形箱(无论哪个散点图),他们将获得分组到该箱中的 100 个观察值的行。我已经完成了这个目标的一部分。我的 MWE 如下:

这将创建一个图像,如下所示:

六边形分箱的散点图矩阵

例如,如果我点击绿色框中突出显示的六边形,我可以确定它出现在哪个子图中(“myX”和“myY”),点击的六边形的 ID(“hexID”),以及被分箱到该六边形中的观察点(“计数”)。对于这个特定的六边形,myX=5,myY=2,hexID=39,counts=1。因此,用户只需在第五行和第二列的散点图中单击 ID39 的六边形,应该有 1 个数据点被分箱。

如果我离开 onRender() 函数,只需在 R 中输入以下代码:

然后,我可以获得数据框的行,该行包含被合并到单击的六边形中的一个观察值:

我的问题只是在最后一步。我无法弄清楚如何从 onRender() 函数中使用 base::attr() 函数来获取“obsns”对象。这个问题是否有任何解决方法,或者我应该考虑采取其他可能的方法?感谢您的任何想法/建议!

0 投票
1 回答
298 浏览

javascript - 在不重绘背景图的情况下以交互方式将点添加到 plotly R 中的子图

这是上一篇文章的延续(在不重绘背景图的情况下以交互方式向绘图 R 添加点)。我正在制作一个包含 32 个 mtcars 数据集值的散点图矩阵(使用 R 包 ggpairs)。我的目标是允许用户点击任何子图中的一个点。这将导致原始数据框中的行的随机子集(大小可以变化,但在下面的示例中为 2)覆盖在所有散点图子图中(散点图的数量可以变化,但在下面的示例中为 3)。

我的半工作MWE如下 -

当前发生的是随机选择的行仅绘制在左下角的一个子图中(以绿色显示)(而不是在所有三个散点图中)。我很难访问和绘制左下角旁边的任何其他散点图。

ScatMatrix

我可能正在研究具有更长数据框(大约数千行观察)和更宽数据框(超过三列,导致绘制超过三个散点图)的方法。所以,我试图找到一种有效的方法来实现这个目标,这样积分就不会花费太长时间来绘制。我相信(从阅读中)每个 Plotly.addTraces() 都可以减慢绘图时间。如果数据框有 6 列,那么就会有 15 个散点图,如果每个散点图都有自己的 addTraces(),那么就会有 15 个 addTraces()。我想知道这是否会使点的绘制速度太慢?如果是这样,我将非常渴望听到有关如何最有效地实现这一目标的建议(允许在所有散点图上尽可能快地绘制绿点)。

如果有任何帮助或想法,我将不胜感激!

编辑:

感谢来自 NiceE 的输入,我能够更新这个脚本,这样它就不需要硬编码要在每个子图中使用的轴标签和变量。更新后的 MWE 如下:

0 投票
1 回答
39 浏览

r - Removing old trace and adding new trace each time user interacts in onRender htmlwidgets

I am aiming to make a plot using the onRender() function in the R package htmlwidgets in which a user can click on a point and a thick gray semi-transparent line is drawn. I have the crux of it working as is shown in the code below.

The problem that remains for me is the fact that each time the user clicks on a point, the opacity of the gray line becomes darker and darker. That is not my intention. In my real application, the gray line line thickness can change as well depending on other parameters not included in this MWE. As a result, in terms of this MWE, I would like to determine a way that, when a user clicks on a point, the old gray line is removed and the new gray line is drawn.

After some research, it seems that my best bet is to use the Plotly.deleteTraces(el.id, trace1) function. I tried to insert that command in two places (currently commented out in the code above). However, in both of these locations, that command seems to prevent any gray line from being drawn. I am unsure why this is happening and how to resolve it. As a result, any information on why this happens and how I can resolve it would be very helpful! Thank you.

Note: This is somewhat of a continuation of a previous post (Changing line thickness and opacity in scatterplot on onRender() htmlWidgets in R).

0 投票
1 回答
221 浏览

r - Line width related to x and y values (rather than pixel size) - htmlwidgets plotly R

I am aiming to make a plot using the onRender() function from the htmlwidgets package in which a user can click on a point and a gray line is drawn. I am trying to make the thickness of the gray line set to a variable.

I have a tentative MWE working as shown below. However, I currently have a problem. Basically, the width of the line changes depending on the resizing of the image and/or browser. This creates a problem because some of the dots change from being inside or outside the gray line depending on the changing line width (as a result of the image or browser resizing). However, whether the dots are inside or outside the gray line has a meaning that I need to keep consistent.

As a result, I am trying to designate the thickness of the line as a value that is relative to the x and y axis values (and not to the pixel values on the screen that can change size). I am hoping this would create a consistent gray line width that does not change relative to the dots even if the user resized the image or browser. Is this something can be accomplished in the onRender() function?

Note: This question is an additional tweak to a previous question I asked (Changing line thickness and opacity in scatterplot on onRender() htmlWidgets in R).

0 投票
2 回答
94 浏览

wpf - 如何在 WPF 表单中显示渲染状态?

我正在重写 WPF 的 OnRender 来绘制复杂的图形。这可能很少需要很长时间。我想向用户表明该应用程序没有崩溃,但“只是”需要很长时间才能呈现。

我该怎么做?在 OnRender 调用期间似乎无法以任何方式修改 UI。

0 投票
2 回答
266 浏览

r - 在 htmlWidgets 的 onRender() 函数中使用 Shiny actionButton() 函数

我有一个闪亮的应用程序,其中用户可以使用 Plotly “框选择”图标在 Plotly 散点图中选择黑点。用户选择的点将以红色突出显示。我在下面有这个应用程序的 MWE:

我现在正在尝试更新这个闪亮的应用程序,以便选定的黑点不会自动变成红色。相反,在用户选择黑点后,他们可以单击带有“突出显示选定点”标签的操作按钮。如果用户单击该操作按钮,则所选点变为红色。下面是我试图让它发挥作用的尝试。不幸的是,此应用程序无法正常工作,实际上失去了绘制原始黑点和首先提供框选择图标的功能。

编辑:

我想包括一张图片来展示我的目标。基本上,如果用户选择下面显示的 15 个点,它们将保持黑色:

在此处输入图像描述

但是,如果用户选择“突出显示所选点”闪亮按钮,则 15 个点将变为红色,如下所示:

已选择红点