javascript - 使用谷歌可视化将 html 标签放入谷歌图表

Question

我在一个网站中使用谷歌图表，并希望将列名变成链接而不是字符串。

但是当我将标签放入图表时，它会将它们显示为字符串。我已经设置了 {allowHtml:true} 但还是不行。

它将列名称显示为 <a href="http://www.w3schools.com">Visit W3Schools</a>而不是 Visit W3Schools并且是一个字符串而不是一个链接。我使用的代码如下:

<script type="text/javascript">
    function drawVisualization() {
        // Create and populate the data table.
        var data = google.visualization.arrayToDataTable([
              ['Job State',  'Job Numbers'],
              ['<a href="http://www.w3schools.com">Visit W3Schools</a>',   @Model.jobCount],
              ['<a href="http://www.w3schools.com">Visit W3Schools</a>',   @Model.liveJobCount],
              ['<a href="http://www.w3schools.com">Visit W3Schools</a>',   @Model.draftJobCount],
              ['<a href="http://www.w3schools.com">Visit W3Schools</a>',  @Model.closedJobCount]
            ]);

        // Create and draw the visualization.
        new google.visualization.ColumnChart(document.getElementById('visualization')).
            draw(data,{allowHtml:true},
            {title:"Current Jobs Statuses",
            width:600, height:400,
            hAxis: {title: "Job Type"}}
        );

    }


    google.setOnLoadCallback(drawVisualization);
</script>

Answer 1

您使用了错误的引号和斜线格式。您必须改用\"和/。

    var data = google.visualization.arrayToDataTable([
          ['Job State',  'Job Numbers'],
          ['<a href=\"http:\/\/www.w3schools.com\">Visit W3Schools<\/a>',   @Model.jobCount],
          ['<a href=\"http:\/\/www.w3schools.com\">Visit W3Schools<\/a>',   @Model.liveJobCount],
          ['<a href=\"http:\/\/www.w3schools.com\">Visit W3Schools<\/a>',   @Model.draftJobCount],
          ['<a href=\"http:\/\/www.w3schools.com\">Visit W3Schools<\/a>',  @Model.closedJobCount]
        ]);