如何在html表格中制作图形？

Question

我正在寻找类似https://coinmarketcap.com/中的表格的内容。制作此图的最简单方法是什么？我将使用表中其他地方存在的数据点。

Answer 1

它被称为“火花线”

您可以找到Wikipedia文章here。通常这是一个非常小的图表，通常在表格中使用。

适当的jQuery库

在JavaScript中创建迷你图有点复杂，最好使用一个库。 here可以找到最适合您需求的jQuery插件。导入后，您可以执行以下操作：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-sparklines/2.1.2/jquery.sparkline.min.js"></script>

<script>
    $(function() {
        $(".inlinesparkline").sparkline();
        $(".inlinesparkline-large").sparkline("html", { width: "300px", height: "75px" });
    });
</script>

Default
<p class="inlinesparkline">1,4,5,4,4,6,6,7,8</p>

Large
<p class="inlinesparkline-large">1,4,5,4,4,6,6,7,8</p>

如果这些尺寸对您来说太小，也可以更改尺寸。有关插件，请参见Common Options。