|
@ -8,18 +8,12 @@ |
|
|
td {font: 10pt arial} |
|
|
td {font: 10pt arial} |
|
|
</style> |
|
|
</style> |
|
|
|
|
|
|
|
|
<script type="text/javascript" src="http://www.google.com/jsapi"></script> |
|
|
|
|
|
<script type="text/javascript" src="../graph3d.js"></script> |
|
|
|
|
|
|
|
|
<script type="text/javascript" src="../../dist/vis.js"></script> |
|
|
|
|
|
|
|
|
<script type="text/javascript"> |
|
|
<script type="text/javascript"> |
|
|
var data = null; |
|
|
var data = null; |
|
|
var graph = null; |
|
|
var graph = null; |
|
|
|
|
|
|
|
|
google.load("visualization", "1"); |
|
|
|
|
|
|
|
|
|
|
|
// Set callback to run when API is loaded |
|
|
|
|
|
google.setOnLoadCallback(drawVisualization); |
|
|
|
|
|
|
|
|
|
|
|
function custom(x, y) { |
|
|
function custom(x, y) { |
|
|
return (Math.sin(x/50) * Math.cos(y/50) * 50 + 50); |
|
|
return (Math.sin(x/50) * Math.cos(y/50) * 50 + 50); |
|
|
} |
|
|
} |
|
@ -51,31 +45,20 @@ |
|
|
// Called when the Visualization API is loaded. |
|
|
// Called when the Visualization API is loaded. |
|
|
function drawVisualization() { |
|
|
function drawVisualization() { |
|
|
// Create and populate a data table. |
|
|
// Create and populate a data table. |
|
|
data = new google.visualization.DataTable(); |
|
|
|
|
|
data.addColumn('number', 'x'); |
|
|
|
|
|
data.addColumn('number', 'y'); |
|
|
|
|
|
data.addColumn('number', 'value'); |
|
|
|
|
|
|
|
|
|
|
|
var JSONdata = []; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var data = new vis.DataSet({}); |
|
|
// create some nice looking data with sin/cos |
|
|
// create some nice looking data with sin/cos |
|
|
var steps = 50; // number of datapoints will be steps*steps |
|
|
var steps = 50; // number of datapoints will be steps*steps |
|
|
var axisMax = 314; |
|
|
var axisMax = 314; |
|
|
var axisStep = axisMax / steps; |
|
|
var axisStep = axisMax / steps; |
|
|
for (var x = 0; x < axisMax; x+=axisStep) { |
|
|
for (var x = 0; x < axisMax; x+=axisStep) { |
|
|
JSONdata.push([]); |
|
|
|
|
|
for (var y = 0; y < axisMax; y+=axisStep) { |
|
|
for (var y = 0; y < axisMax; y+=axisStep) { |
|
|
var value = custom(x,y); |
|
|
var value = custom(x,y); |
|
|
JSONdata[x].push(value); |
|
|
|
|
|
|
|
|
data.add([ |
|
|
|
|
|
{x:x,y:y,z:value,t:0,style:value} |
|
|
|
|
|
]); |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
for (var x = 0; x < axisMax; x+=axisStep) { |
|
|
|
|
|
for (var y = 0; y < axisMax; y+=axisStep) { |
|
|
|
|
|
var value = custom(x,y); |
|
|
|
|
|
data.addRow([x, y, value]); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// specify options |
|
|
// specify options |
|
|
var options = { |
|
|
var options = { |
|
@ -92,10 +75,6 @@ |
|
|
// Instantiate our graph object. |
|
|
// Instantiate our graph object. |
|
|
graph = new links.Graph3d(document.getElementById('mygraph')); |
|
|
graph = new links.Graph3d(document.getElementById('mygraph')); |
|
|
|
|
|
|
|
|
// Add event listeners |
|
|
|
|
|
google.visualization.events.addListener(graph, 'camerapositionchange', |
|
|
|
|
|
oncamerapositionchange); |
|
|
|
|
|
|
|
|
|
|
|
// Draw our graph with the created data and options |
|
|
// Draw our graph with the created data and options |
|
|
graph.draw(data, options); |
|
|
graph.draw(data, options); |
|
|
//graph.redraw(); |
|
|
//graph.redraw(); |
|
@ -103,7 +82,7 @@ |
|
|
</script> |
|
|
</script> |
|
|
</head> |
|
|
</head> |
|
|
|
|
|
|
|
|
<body> |
|
|
|
|
|
|
|
|
<body onload="drawVisualization()"> |
|
|
<h1>Graph 3d camera position</h1> |
|
|
<h1>Graph 3d camera position</h1> |
|
|
<table> |
|
|
<table> |
|
|
<tr> |
|
|
<tr> |