Google Chart Link to same page inside a Table (basically do bookmarking within the same page) -
from within google chart table; how create link "inside" same page (basically bookmarking within same page). know how link outside web pages using data.addcolumn('link', 'link'); there way can add link inside table representing bookmarks.
<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>
google.visualization.events.addlistener(table, 'select', function(e){ location.href = "#" + data.getvalue(table.getselection()[0].row,0); });
that's there (if i've understood question correctly)
demo here
Comments
Post a Comment