Использование функциональности оси D3 на холсте

#d3.js #svg #html5-canvas

#d3.js #svg #html5-холст

Вопрос:

Я пытаюсь нарисовать ось на холсте, используя функциональность D3 (как показано здесь на примереhttps://www.tutorialsteacher.com/d3js/axes-in-d3). Однако в каждом примере, который я видел, используется SVG, в то время как я хочу использовать canvas. С другой стороны, я не видел никаких указаний ни в их документации, ни где-либо еще, что это не может быть сделано в canvas.

Возможно ли это? Если да, то каким образом?

Ответ №1:

Короче говоря: нет, это невозможно.

D3 в значительной степени не зависит от рендеринга, что означает, что его можно использовать для создания SVG, Canvas, других HTML-элементов и т.д. Однако некоторые модули действительно довольно специфичны, и это относится к d3-axis .

Если вы посмотрите на d3-axis исходный код, вы увидите, что в нем добавлены элементы SVG <path> , <line> и <text> для создания оси. Например:

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

Наконец, здесь у вас есть обсуждение на эту тему, где Босток (создатель D3) отказывается от идеи модификации d3-axis модуля для создания осей на HTML canvas.