d3.js - 在 Canvas 上使用 D3 轴功能

标签 d3.js svg html5-canvas

我正在尝试使用 D3 功能在 Canvas 上绘制轴(如此处 https://www.tutorialsteacher.com/d3js/axes-in-d3 所示)。然而,我见过的每个例子都使用 SVG,而我希望使用 Canvas 。另一方面,我在他们的文档或其他地方没有看到任何迹象表明它不能在 Canvas 中完成。

这可能吗?如果是这样,怎么办?

最佳答案

简而言之:不,这是不可能的。

D3 几乎与渲染无关,这意味着它可用于创建 SVG、Canvas、其他 HTML 元素等。但是,某些模块确实非常具体, d3-axis 就是这种情况。 .

如果您查看d3-axis source code你会看到它附加了 SVG <path> , <line><text>用于创建轴的元素。例如:

path.enter().insert("path", ".tick")

最后,here您对此主题进行了讨论,其中 Bostock(D3 创建者)放弃了修改 d3-axis 的想法用于在 HTML Canvas 上创建轴的模块。

关于d3.js - 在 Canvas 上使用 D3 轴功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63559691/

相关文章:

javascript - D3 不显示 SVG 文本元素

javascript - d3.js 将图像显示为圆形

javascript - D3 调整linkText位置

SVG 滤镜动画 feColorMatrix

javascript - SVG像素比为1 :2 from code to rendering

javascript - 如何在二次曲线上跟踪坐标

javascript - 类型错误:无法读取未定义的 D3.js 的属性 '1'

html - 嵌套 SVG 的对齐方式

javascript - 通过 AJAX 发布 Canvas blob : prevent/delete local cache

javascript - Canvas /照片 - getImageData 不起作用