首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >PrimeNG饼图随机显示,并在更改分辨率时显示

PrimeNG饼图随机显示,并在更改分辨率时显示
EN

Stack Overflow用户
提问于 2020-08-21 14:36:42
回答 1查看 87关注 0票数 0

我使用原始饼图和来自后端的动态数据。当我使用静态数据时,饼图按预期工作,但现在与动态数据集成后,它在页面刷新时随机显示。它会在屏幕分辨率(即宽度和高度)发生变化时进行渲染和显示。我尝试了多种方法,如ViewChild,响应性和设置图表的高度和宽度,但似乎都不起作用。

chart as default

chart after I clicked toggle device toolbar in dev console and un-clicked it

EN

回答 1

Stack Overflow用户

发布于 2020-08-21 15:30:18

我记得曾经遇到过类似的问题。它与变化检测相关。屏幕分辨率的改变触发了改变检测。还有一些事件,比如鼠标移动,如果你在任何地方有一些处理这些事件的处理程序的话。

考虑到我没有看到代码,我想可能有两种解决方案:

  • 数据绑定可以在不更改对包含数据的变量的引用的情况下完成。例如,使用push方法更新数据源。

代码语言:javascript
运行
复制
// this is not recognized by the change detection mechanism as update because the reference to this.data is not updated
this.resourceService.getResources().subscribe( data => { 
  var counts1 = {};
  this.chartHistory.forEach((x) => {
    counts1[x] = (counts1[x] || 0)+1; 
  });
  for (let i = 0; i < Object.keys(counts1).length; i++) {
    this.chartHistoryData.push(Object.keys(counts1)[i]);
    this.chartHistoryVal.push(Object.values(counts1)[i]);
  }
});

// this would be recognized
this.resourceService.getResources().subscribe( data => { 
  var counts1 = {};
  this.chartHistory.forEach((x) => {
    counts1[x] = (counts1[x] || 0)+1; 
  });
  Object.entries(counts1).forEach(([key, value]) => {
    this.chartHistoryData = [...this.chartHistoryData, key];
    this.chartHistoryVal = [...this.chartHistoryVal, value];
  });
});

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63517675

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档