Question

以下是条形图插件的链接：

http://www.jqueryscript.net/demo/Simple-Bar-Chart-Plugin-with-jQuery-Bootstrap-jchart/

但问题是我希望将所有条形图转换为链接，如果用户点击它，它会将用户重定向到该特定条形图中的给定链接。但我无法做到，请帮助我！提前致谢

以下是代码：

<div class="BodyGC">
    <div id="Div1" data-sort="true" data-width="300" class="jChart chart-sm" name="">
    <div class="define-chart-row"  data-color="#009182" title="1">13</div>
    <div class="define-chart-row" data-color="#009182" title="2">24</div>
    <div class="define-chart-row" data-color="#AFCD14" title="3">17</div>
    <div class="define-chart-row" data-color="#AFCD14" title="4">10</div>
    <div class="define-chart-row" data-color="#AFCD14" title="5">12</div>
    <div class="define-chart-row" data-color="#009182" title="6">8</div>
    <div class="define-chart-footer">10</div>
    <div class="define-chart-footer">20</div>
    <div class="define-chart-footer">30</div>   
</div>
<script>
    $(document).ready(function () {
        $("#Div1").jChart();
    });
</script>
</div>

js fiddle

Answer 1

您需要修改bar中的jchart.js变量，以包含具有变量<a>属性的href标记。我不会为你编码，因为它似乎你没有尝试过。如果你遇到困难，请随便回来。

脚本中的

Bar变量：

var bar = $("<div>", {
    class: "bar",
    "data-placement": "right",
    "data-toggle": "tooltip",
    title: commaSeparateNumber(settings.values[i]),
    style: "height:" + bar_height + "px;background-color:" + settings.colors[i % settings.colors.length],
    width: bar_width
});

html jquery条形图插件无法使条形链接

1 个答案: