Google scatter chart for two arrays - php

Question

Hello People here is my Google scattered chart code what I am using:
require '/lib/GoogleChart.php';
require '/lib/markers/GoogleChartShapeMarker.php';
require '/lib/markers/GoogleChartTextMarker.php';
$Variance=array();
$Emp_RecFactor=array();
$Emp_Id=array();
//$Emp_FirstName=array();
$EquityGraph=new EquityGraph();
$EquityGraph->Graph();
$DrawGraph=$EquityGraph->DrawGraph;
foreach($DrawGraph as $key=>$value)
{
$Variance[]=$value["Variance"];//for multiple values ,array
$Emp_RecFactor[]=$value["Emp_RecFactor"];//single value
$Emp_Id[]=$value["Emp_Id"];//single value
}
$_GET['Variance']=$Variance;
$_GET['Emp_RecFactor']=$Emp_RecFactor;
print_r($Emp_RecFactor);
$chart = new GoogleChart('lc', 500, 200);
// manually forcing the scale to [0,100]
$chart->setScale(0,100);
// add one line
$data = new GoogleChartData($Variance);
$chart->addData($data);
// customize y axis
$y_axis = new GoogleChartAxis('y');
$y_axis->setDrawTickMarks(false)->setLabels(array(-5,0,5));
$chart->addAxis($y_axis);
// customize x axis
$x_axis = new GoogleChartAxis('x');
$x_axis->setTickMarks(5);
$chart->addAxis($x_axis);
// add a shape marker with a border
$shape_marker = new GoogleChartShapeMarker(GoogleChartShapeMarker::CIRCLE);
$shape_marker->setSize(6);
$shape_marker->setBorder(2);
$shape_marker->setData($data);
$chart->addMarker($shape_marker);
// add a value marker
$value_marker = new GoogleChartTextMarker(GoogleChartTextMarker::VALUE);
$value_marker->setData($data);
$chart->addMarker($value_marker);
//~ header('Content-Type: image/png');
echo $chart->toHtml();
As you can see in the code I have used $Variance array passing to $data now I need to use one more array $Emp_RecFactor and I need to draw a graph between those two...
I also want to add mouse over feature to this so that if someone hovers over the selected point it should display different things for different selected points -how do I do that?

Answer 1

To draw a Google scattered chart between two arrays you have to use code as below
var data = google.visualization.arrayToDataTable([
['Age', 'Array1', 'Array2'],
[8, 12, 15],
[4, 5.5, 0],
[11, 0, 14],
[4, 9, 5],
[3, 3.5, 9],
[6.5, 7, 13]
]);
And it has a default tooltip to show the data while hovering the selected point. We can also customize Tooltip content by using html tags.
To view a working sample for this go to the site jqfaq.com(Sample) and a customization of Tooltip content go to the site jqfaq.com(customizing Tooltip)