2

从谷歌图表表中;如何在同一页面上创建“INSIDE”链接(基本上在同一页面内做书签)。我知道如何使用 data.addColumn('link', 'link'); 链接到外部网页;但是有没有办法我们可以在代表书签的表格中添加一个链接。

<html>
  <head>
    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script type='text/javascript'>
      google.load('visualization', '1', {packages:['table']});
      google.setOnLoadCallback(drawTable);
      function drawTable() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('number', 'Salary');
        data.addColumn('boolean', 'Full Time Employee');
        data.addRows([
          ['Mike',  {v: 10000, f: '$10,000'}, true,],
          ['Jim',   {v:8000,   f: '$8,000'},  false,],
          ['Alice', {v: 12500, f: '$12,500'}, true,],
          ['Bob',   {v: 7000,  f: '$7,000'},  true,]
        ]);

        var table = new google.visualization.Table(document.getElementById('table_div'));
        table.draw(data, {showRowNumber: true});
      }
    </script>
  </head>

  <body>

<h2><a id="Mike">Mike</h2>
<p>Mikes Finance details ba bla bla</p>
<p></p>

<h2>Chapter 1</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 2</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 3</h2>
<p>This chapter explains ba bla bla</p>

<h2><a id="Alice">Alice</h2>
<p>Alice Finance details ba bla bla</p>

<h2><a id="Bob">Bob</a></h2>
<p>Bob Finance details ba bla bla</p>

<h2>Chapter 4</a></h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 5</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 6</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 7</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 8</h2>
<p>This chapter explains ba bla bla</p>

<h2><a id="Jim">Jim</h2>
<p>Jims Finance details ba bla bla</p>

<h2>Chapter 9</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 10</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 11</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 12</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 13</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 14</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 15</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 16</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 17</h2>
<p>This chapter explains ba bla bla</p>  

<div id='table_div'></div>

<a href="#Mike">Mike's Finance</a>
<a href="#Jim">Jim's Finance</a>
<a href="#Mike">Alice's Finance</a>
<a href="#Jim">Bob's Finance</a>

    </body>
</html>       
4

1 回答 1

0
 google.visualization.events.addListener(table, 'select', function(e){
  location.href = "#" + data.getValue(table.getSelection()[0].row,0);
 });

这就是它的全部内容(如果我正确理解了你的问题)

在这里演示

于 2013-05-06T06:47:55.813 回答