Basechart (Ng2-Charts)画布最大宽度<= 16384px在火狐？

Question

我准备了这个(如在stackblitz - https://stackblitz.com/edit/github-nlvlrr-mwudnj?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.component.html,tsconfig.json&preset=node中).你可以在国际足联看到16384像素后的一切都没有被渲染，而在Chrome中，图表被完全渲染。这就是Firefox的局限性吗？难道不可能在浏览器中渲染更多像素吗？因为在canvas大小表中，他们通常会编写firefox呈现最多32768px的内容。也许我做错了什么？

铬：在这里输入图像描述

火狐：在这里输入图像描述

Answer 1

16384 x2= 32768

如果在浏览器的控制台中键入devicePixelRatio，可能会找到2。你很可能在高分辨率监视器上。

Chart.js是在您的Ng2-Charts库的引擎盖后面使用的，它有一个可用的选项。它的默认值是window.devicePixelRatio ( dPR )，因此如果不显式设置它，库将自动调整画布的大小以匹配此dPR。他们这样做是因为在这样的监视器上要有清晰的像素，我们需要将画布缓冲区设置为监视器像素的实际大小，然后使用CSS缩小呈现的画布。

如果确实需要将画布设置为更大的初始值，则可以使用此选项将dPR限制为1，例如

lineChartOptions: ChartOptions<'line'> = {
  devivePixelRatio: 1,
  responsive: true,
  ...

或者，您可以保留默认设置，只需检查查找到的关于画布最大大小的表，但将其除以window.devicePixelRatio。