diff options
| author | Pliable Pixels <pliablepixels@gmail.com> | 2017-09-27 12:42:48 -0400 |
|---|---|---|
| committer | Pliable Pixels <pliablepixels@gmail.com> | 2017-09-27 12:42:48 -0400 |
| commit | 210e8feae2fb4842bfb2de38666e6c41671fef3c (patch) | |
| tree | cbdafa34b1a6260bb20236d7e9de9eb1b690a1c5 /www/lib/vis/examples/graph3d/11_tooltips.html | |
| parent | e7e7baeaad90229ccb3e0f45f4ebd77be7d79b14 (diff) | |
removed lib
Diffstat (limited to 'www/lib/vis/examples/graph3d/11_tooltips.html')
| -rw-r--r-- | www/lib/vis/examples/graph3d/11_tooltips.html | 118 |
1 files changed, 0 insertions, 118 deletions
diff --git a/www/lib/vis/examples/graph3d/11_tooltips.html b/www/lib/vis/examples/graph3d/11_tooltips.html deleted file mode 100644 index c37b35f4..00000000 --- a/www/lib/vis/examples/graph3d/11_tooltips.html +++ /dev/null @@ -1,118 +0,0 @@ -<!doctype html> -<html> -<head> - <title>Graph 3D tooltips</title> - - <style> - body {font: 10pt arial;} - div#info { - width : 600px; - text-align: center; - margin-top: 2em; - font-size : 1.2em; - } - </style> - - <script type="text/javascript" src="../../dist/vis.js"></script> - - <script type="text/javascript"> - var data = null; - var graph = null; - - function custom(x, y) { - return (-Math.sin(x/Math.PI) * Math.cos(y/Math.PI) * 10 + 10); - } - - // Called when the Visualization API is loaded. - function drawVisualization() { - var style = document.getElementById('style').value; - var withValue = ['bar-color', 'bar-size', 'dot-size', 'dot-color'].indexOf(style) != -1; - - // Create and populate a data table. - data = new vis.DataSet(); - var extra_content = [ - 'Arbitrary information', - 'You can access data from the point source object', - 'Tooltip example content', - ]; - - // create some nice looking data with sin/cos - var steps = 5; // number of datapoints will be steps*steps - var axisMax = 10; - var axisStep = axisMax / steps; - for (var x = 0; x <= axisMax; x+=axisStep) { - for (var y = 0; y <= axisMax; y+=axisStep) { - var z = custom(x,y); - if (withValue) { - var value = (y - x); - data.add({x:x, y:y, z: z, style:value, extra: extra_content[(x*y) % extra_content.length]}); - } - else { - data.add({x:x, y:y, z: z, extra: extra_content[(x*y) % extra_content.length]}); - } - } - } - - // specify options - var options = { - width: '600px', - height: '600px', - style: style, - showPerspective: true, - showLegend: true, - showGrid: true, - showShadow: false, - - // Option tooltip can be true, false, or a function returning a string with HTML contents - //tooltip: true, - tooltip: function (point) { - // parameter point contains properties x, y, z, and data - // data is the original object passed to the point constructor - return 'value: <b>' + point.z + '</b><br>' + point.data.extra; - }, - - keepAspectRatio: true, - verticalRatio: 0.5 - }; - - var camera = graph ? graph.getCameraPosition() : null; - - // create our graph - var container = document.getElementById('mygraph'); - graph = new vis.Graph3d(container, data, options); - - if (camera) graph.setCameraPosition(camera); // restore camera position - - document.getElementById('style').onchange = drawVisualization; - } - </script> - <script src="../googleAnalytics.js"></script> -</head> - -<body onload="drawVisualization()"> - -<p> - <label for="style"> Style: - <select id="style"> - <option value="bar">bar</option> - <option value="bar-color">bar-color</option> - <option value="bar-size">bar-size</option> - - <option value="dot">dot</option> - <option value="dot-line">dot-line</option> - <option value="dot-color">dot-color</option> - <option value="dot-size">dot-size</option> - - <option value="grid">grid</option> - <option value="line">line</option> - <option value="surface">surface</option> - </select> - </label> -</p> - -<div id="mygraph"></div> - -<div id="info">Hover the mouse cursor over the graph to see tooltips.</div> - -</body> -</html> |