我环顾四周,但似乎找不到任何一起使用这两个库的示例。我的项目当前使用react-pdf 生成pdf 报告,但我需要将chartjs 图表添加到我们将生成的一些新文件中。我不想使用两个不同的 pdf 库,也不必重新编码应用程序的某些部分以匹配 2 个标准。如果有一个不同的库可以完成工作,我将愿意接受建议。
我尝试转换的页面具有如下结构:
<section className={classes.dashboardContainer}>
<PerfectScrollbar>
<Grid container classes={{ root: classes.dashboardDetails }}>
<Grid item xs={12} lg={8} classes={{ root: classes.dashboardDetailsLeft }}>
<ChartOne
isLoading={isLoading}
totalItems={state && state.chartOneData}
/>
<ChartTwo
isLoading={isLoading}
data={metrics ? chartTwoData : undefined}
/>
<ChartThree
isLoading={isLoading}
data={metrics ? chartThreeData: undefined}
/>
<ChartFour
isLoading={isLoading}
data={metrics ? chartFourData : undefined}
/>
</Grid>
</Grid>
</PerfectScrollbar>
</section>
图表组件内部有几种不同类型的图表,下面是一个示例:
<section className={classes.barChartContainer}>
<div>
<HorizontalBar
data={chartData}
height={50}
options={chartOptions({ beginAtZero: true, stacked: true, xAxesMax })}
/>
</div>
</section>
这只是来自react-chartjs-2库的barCharts。我似乎不知道如何使用react-pdf 库将它们转换为PDF。有没有一个库可以更好地完成这项任务?
我能想到的唯一解决方案是使用 refs 获取每个图表的画布元素,然后使用 jsPdf 将它们转换为 imgs 以嵌入到文档中...
None
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)