如何使用d3生成svg客户端，而不将其附加到DOM（使用React.js） [英] How to generate svg client-side with d3 without attaching it to the DOM (using with React.js)

问题描述

我使用React.js构建一个应用程序，其中包含了一些svg图表。我使用d3函数帮助图表创建，如鳞片，但然后使用React来生成svg元素。这里有一个很好的写法： http：// 10cultulting。 com / 2014/02/19 / d3-plus-reactjs-for-charting /

I'm using React.js to build an app, which includes quite a few svg charts. I'm using d3 functions that help in chart creation, such as scales, but then using React to generate the svg elements. Here's a great writeup on the approach: http://10consulting.com/2014/02/19/d3-plus-reactjs-for-charting/

为什么我要走这条路是为了表演 - 应用程序的第一个版本太慢。它有很多元素和很多用户交互性，所有客户端。我试图基本上在React中重新创建dc.js库。

Part of why I'm going down this road was for performance - the first version of the app was too slow. It has a lot of elements and a lot of user-interactivity, all client-side. I'm trying to basically recreate the dc.js library in React.

这是一个非常有趣的方法和直观的（更多比d3单独的IMO）。建筑轴是繁琐的，而d3做得很好。我会喜欢d3只是能够输出一个svg元素的代表轴（和可能其他元素）的字符串，我喂它到React包含在DOM。

It's a really fun approach and intuitive (more so than d3 alone IMO). Building axes is tedious though, and d3 does it so nicely. I would love d3 to just be able to output a string of svg elements that represent the axis (and maybe other elements) , and I feed it to React to include in the DOM.

我没有看到这个SO问题（如何使d3.js生成svg而不绘图？）答案是将它附加在DOM中并删除它，或创建一个DOM片段。这些方法违背了React方法，可能会影响React的性能优势。我也看到了jsdom和phantomjs解决方案，这将不会在我的情况下工作。

I did see this SO question (How to make d3.js generate an svg without drawing it?) and the answer was to append it in the DOM and remove it, or create a DOM fragment. Those approaches go against the React approach and likely negate the performance benefits of React. I also saw jsdom and phantomjs solutions, which will not work in my case.

d3可以生成svg，而不附加到DOM？

Can d3 generate svg without appending it to the DOM?

推荐答案

否。 D3通过设计直接对DOM进行操作。要让它生成字符串表示而不修改DOM，你需要修改它的源代码（这将是一个相当大的修改）。

No. D3 by design operates directly on the DOM through its selections. To have it generate string representations instead without modifying the DOM, you would need to modify its source code (and it would be quite a significant modification).

这篇关于如何使用d3生成svg客户端，而不将其附加到DOM（使用React.js）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！