如何使用 jsPDF 生成仪表板 PDF 文件?

问题描述 投票:0回答:0

我有将仪表盘导出为PDF文件的需求。上面的一些图表很容易通过将它们转换成图片来显示。但是有些图表包含文本,有些图表包含也需要显示为文本的表格。

我停下来的要点是如何获取嵌入文本以及如何正确拼写样式和间距。

示例 HTML

            <div
              class="dashboard-component dashboard-component-chart-holder"
            >
              <h1>COVID-19 Vaccine Dashboard</h1>
              <p>
                Everywhere you look, you see negative news about COVID-19. This
                is to be expected; it''s been a brutal year and this disease is
                no joke. This dashboard hopes to use visualization to inject
                some optimism about the coming return to normalcy we enjoyed
                before 2020! There''s lots to be optimistic about:
              </p>
              <ul>
                <li>
                  the sheer volume of attempts to fund the R&amp;D needed to
                  produce and bring an effective vaccine to market
                </li>
                <li>
                  the large number of countries involved in at least one vaccine
                  candidate (and the diversity of economic status of these
                  countries)
                </li>
                <li>the diversity of vaccine approaches taken</li>
                <li>
                  the fact that 2 vaccines have already been approved (and a
                  hundreds of thousands of patients have already been
                  vaccinated)
                </li>
              </ul>
              <h3>The Dataset</h3>
              <p>
                This dashboard is powered by data maintained by the Millken
                Institute (
                <a href="#">
                  link to dataset
                </a>
                ). We researched each vaccine candidate and added our own best
                guesses for the country responsible for each vaccine effort.
              </p>
              <p>
                <em>Note that this dataset was last updated on 07/2021</em>.
              </p>
            </div>

看起来如何

javascript jspdf
© www.soinside.com 2019 - 2024. All rights reserved.