首页 文章

Chart.js甜甜圈图表大小

提问于
浏览
1

我在Angular项目中使用ng2-charts . 我有两个版本的项目 . 当前的 生产环境 版本是旧版本并使用旧版本的ng2-charts(以及扩展名为chart.js) . 我虽然碰到了一些奇怪的东西 .

我正在使用ng2-charts中的圆环图,并且旧版本中图表加载的默认大小是1:1比率:

enter image description here

您可以看到它的加载高度和宽度为240px . 奇怪的是,在较新版本的ng2-charts / chart.js中,宽高比为2:1:

enter image description here

我在新版本中使用相同的选项,相同的设置等 . 唯一的区别是包版本 .

是否有Chart.js的设置可以帮我修复它?我喜欢旧图表的大小,但是如果不允许图表的 canvas 在我的组件外部流血,就不能让新的图表这样做,这显然是我不想要的原因 .

1 回答

  • 1

    在提供给Chart.js的 options 对象中设置 aspectRatio: 1 以获得您要查找的内容 . 当前版本中的默认值 aspectRatio 为2(曾经是1的时间,但是为了提高向后兼容性而恢复了它) . 正如您可能猜到的那样,将其设置为.5会导致元素的 height 加倍 .

    Codepen(此笔取自this Github问题)

相关问题