It's becoming a nightmare for me solving this problem. I am developing an app using phonegap. I have used highcharts in it for Graphs. The graph is coming properly but not the tooltip in the graph. Please check the code below, I need this code to be able to show the tooltip with proper data. There has to be a loop of the following code and it has to be for every user or series in the graph. So I have ran a for loop in PHP and saved it in a variable and got the whole output of the loop using AJAX in a JSON format.
When I use the variable in the Javascript code in which I have saved the AJAX output, it just doesn't do anything but if I alert than it alerts the exact code which I want to make tooltip work. I have tried eval() also but no benefit. Any help or guidance will be much appreciated.
Loop Code
$toolTip = '';
for($i=0;$i<$teamControllerW->total_user;$i++){
$toolTip .= "var chart = $('#team_containerWF').highcharts();";
$toolTip .= "var figures".$i." = [".join($teamControllerW->new_yAxesData1[$i], ",") ."]; ";
$toolTip .= "var fatVals".$i." = [". join($teamControllerW->fatVal[$i], ',') ."]; ";
$toolTip .= "var weightVals".$i." = [". join($teamControllerW->weightVal[$i], ',') ."]; ";
$toolTip .= "var result_playing_dates = [". join($teamControllerW->new_playing_dates_data[$i], ',') ."]; ";
$toolTip .= "
$.each(figures".$i.", function (j, figure".$i.") {
var curDanger = (figure".$i."[0] - danger[0][0]) * delta + danger[0][1];
var play_date = false;
for (var k = 0; k < result_playing_dates.length ; k ++ ) {
if (figure".$i."[0] == result_playing_dates[k]) {
play_date = true;
break;
}
}
";
$toolTip .= "if (figure".$i."[1] > curDanger) {
if (play_date) {
if (chart.series[".$i."].data[j] && chart.series[".$i."].data[j].graphic) {
chart.series[".$i."].data[j].graphic.attr({ fill: '#a31515' });
chart.series[".$i."].data[j].update({
fatVal : fatVals".$i."[j],
weightVal : weightVals".$i."[j],
marker:{
fillColor: '#a31515',
radius: 6,
states: {
hover: {
fillColor: '#a31515',
lineColor: '#a31515',
radius: 10
}
}
}
});
}
}
else {
if (chart.series[".$i."].data[j] && chart.series[".$i."].data[j].graphic) {
chart.series[".$i."].data[j].graphic.attr({ fill: 'red' });
chart.series[".$i."].data[j].update({
fatVal : fatVals".$i."[j],
weightVal : weightVals".$i."[j],
marker:{
fillColor: 'red',
states: {
hover: {
fillColor: 'red',
lineColor: 'red'
}
}
}
});
}
}
}else{
if (play_date) {
if (chart.series[".$i."].data[j] && chart.series[".$i."].data[j].graphic) {
chart.series[".$i."].data[j].graphic.attr({ fill: '#02491a' });
chart.series[".$i."].data[j].update({
fatVal : fatVals".$i."[j],
weightVal : weightVals".$i."[j],
marker:{
fillColor: '#02491a',
radius: 6,
states: {
hover: {
fillColor: '#02491a',
lineColor: '#02491a',
radius: 10
}
}
}
});
}
}
else {
if (chart.series[".$i."].data[j] && chart.series[".$i."].data[j].graphic) {
chart.series[".$i."].data[j].graphic.attr({ fill: 'green' });
chart.series[".$i."].data[j].update({
fatVal : fatVals".$i."[j],
weightVal : weightVals".$i."[j],
marker:{
fillColor: 'green',
states: {
hover: {
fillColor: 'green',
lineColor: 'green'
}
}
}
});
}
}
}
});
";
}//end for
I'm calling the data like this
var teamweighinLMgameAction = window.localStorage.getItem("teamweighinLMgameAction");
AGWeigh = JSON.parse(teamweighinLMgameAction);
var toolTip = AGWeigh.toolTip;
alert(toolTip);//On alert it comes fine
if(data_avail=='yes') { //check if data available
var danger = myDangerLine,
deltaX = danger[1][0] - danger[0][0],
deltaY = danger[1][1] - danger[0][1],
delta = deltaY / deltaX;
alert("In: "+toolTip);//the data also alerts fine here
toolTip; //This is the place where I need the loop output but it nothing comes up
}
