I have an array created in wos.php which I then json_encode and echo to use in another file, data.php, using jQuery. The data is not being picked up for some reason.
This is an example of the array ($recordArray) created in wos.php:
Array
(
[0] => Array
(
[author1] => QIN, JUN-SHENG
[citations] => 61
)
[1] => Array
(
[author1] => KOHANE, DANIELS
[citations] => 60
)
[2] ...etc...
This is what the data looks like after I perform echo json_encode($recordArray):
[
{
"author1" : "QIN, JUN-SHENG",
"citations" : "61"
},
{
"author1" : "KOHANE, DANIELS",
"citations" : "60"
}, ...etc...
Which all appears to be in the correct format. This data is then used in data.php where it is displayed in a bar graph using jQuery/D3. Here is a snippet of that code up to the point it is supposed to read the data from wos.php using getJSON:
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Academic Intelligence</title>
...etc...
</head>
<body>
...etc...
<script type="text/javascript">
// this is just so I know it has reached this point
console.log("Works to here...");
$(document).ready(function() {
$.getJSON('wos.php', function(data) {
alert(data);
...code that uses data to with D3 to display a bar graph...
}
}
</script>
...etc...
</body>
</html>
The console.log prints "Works to here..." just before the jQuery, but alert(data) returns nothing so it's obviously failing to pick up the data. Can anyone see why this fails?
I know the rest of the code works as I used to save the JSON data to a file in wos.php using file_put_contents('data.json', json_encode($recordArray) and then read that file in data.php with $.getJSON('data.json', function(data). This displayed the bar graph correctly and worked fine but is obviously not a good solution to be saving to and reading from the server, which is why I'm trying to AJAX it instead.
**** ADDITIONAL ****
Full code for wos.php as requested:
<?php
// TIMING INITIALISE
$mtime = microtime();
$mtime = explode(" ",$mtime);
$mtime = $mtime[1] + $mtime[0];
$starttime = $mtime;
// set processing time for browser before timeout
ini_set('max_execution_time', 3600);
// override default PHP memory limit
ini_set('memory_limit', '-1');
// ensures anything dumped out will be caught, output buffer
ob_start();
// set WSDL for authentication and create new SOAP client
$auth_url = "http://search.webofknowledge.com/esti/wokmws/ws/WOKMWSAuthenticate?wsdl";
// array options are temporary and used to track request & response data in printout below (line 65)
$auth_client = @new SoapClient($auth_url, array(
"trace" => 1,
"exceptions" => 0));
// run 'authenticate' method and store as variable
$auth_response = $auth_client->authenticate();
// set WSDL for search and create new SOAP client
$search_url = "http://search.webofknowledge.com/esti/wokmws/ws/WokSearch?wsdl";
// array options are temporary and used to track request & response data in printout below (line 130)
$search_client = @new SoapClient($search_url, array(
"trace" => 1,
"exceptions" => 0));
// call 'setCookie' method on '$search_client' storing SID (Session ID) as the response (value) given from the 'authenticate' method
$search_client->__setCookie('SID',$auth_response->return);
// =================================================================== //
// ============== PASS IN PARAMETERS FOR SOAP REQUEST ================ //
// =================================================================== //
// data passed in from user via form in index.html
// search type for journals (publication name)
$queryType1 = "SO";
// keyword(s)
$queryJournal1 = $_POST["journal1"];
// check if journal2 field has been populated, if not entered then set to blank
if (!$_POST["journal2"]) {
$queryJournal2 = "";
} else {
$queryJournal2 = $_POST["journal2"];
$queryJournal2 = " OR " .$queryType1. "=" .$queryJournal2;
}
// check if journal3 field has been populated
if (!$_POST["journal3"]) {
$queryJournal3 = "";
} else {
$queryJournal3 = $_POST["journal3"];
$queryJournal3 = " OR " .$queryType1. "=" .$queryJournal3;
}
// search type for titles
$queryType2 = "TI";
// keyword(s)
$queryTitle1 = $_POST["title1"];
// check if title2 field has been populated
if (!$_POST["title2"]) {
$queryTitle2 = "";
} else {
$queryTitle2 = $_POST["title2"];
$queryTitle2 = " OR " .$queryType2. "=" .$queryTitle2;
}
// check if title3 field has been populated
if (!$_POST["title3"]) {
$queryTitle3 = "";
} else {
$queryTitle3 = $_POST["title3"];
$queryTitle3 = " OR " .$queryType2. "=" .$queryTitle3;
}
// sort type
$sortType = "TC";
// check if timespan fields have been populated
if (!$_POST["timeStart"]) {
$timeStart = "1864-01-01";
$timeEnd = "2080-01-01";
} else {
$timeStart = $_POST["timeStart"];
$timeEnd = $_POST["timeEnd"];
}
// create an array to store all the search parameters to pass to data.html to display with the graph
$searchParams = array('journal1' => $queryJournal1,
'journal2' => $queryJournal2,
'journal3' => $queryJournal3,
'title1' => $queryTitle1,
'title2' => $queryTitle2,
'title3' => $queryTitle3,
'from' => $timeStart,
'to' => $timeEnd,
);
// turn top cited authors data into JSON file for displaying with JavaScript in data.html
// file_put_contents('search.json', json_encode($searchParams));
// pass in relevant parameters for search, this is the format necessary for Web of Science Web Service
$search_array = array(
'queryParameters' => array(
'databaseId' => 'WOS',
'userQuery' => $queryType1.'='.$queryJournal1 . $queryJournal2 . $queryJournal3 . ' AND ' .$queryType2. '=' .$queryTitle1 . $queryTitle2 . $queryTitle3,
'editions' => array('collection' => 'WOS', 'edition' => 'SCI'),
'timeSpan' => array('begin' => $timeStart, 'end' => $timeEnd),
'queryLanguage' => 'en'
),
'retrieveParameters' => array(
'count' => '100',
'sortField' => array(
array('name' => $sortType, 'sort' => 'D')
),
'firstRecord' => '1'
)
);
// =================================================================== //
// ======== PERFORM SEARCH USING PARAMETERS & SOAP CLIENT ============ //
// =================================================================== //
// try to store as a variable the 'search' method on the '$search_array' called on the SOAP client with associated SID
try {
$search_response = $search_client->search($search_array);
} catch (Exception $e) {
echo $e->getMessage();
};
// number of records found by search, used to finish loop
$len = $search_response->return->recordsFound;
echo "</br>RECORDS FOUND: </br>";
print "<pre>\n";
print $len;
print "</pre>";
// =================================================================== //
// ============ CREATE VARIABLES TO STORE REQUIRED DATA ============== //
// ================== FROM XML & DISPLAY IN TABLE ==================== //
// =================================================================== //
// create an array to store data for each record per iteration
$recordArray = array();
// create an array to represent citation values to ignore, i.e. not interested in any publications with less than 4 citations
$ignore = array(0, 1, 2, 3, 4);
// iterate through all records, perform search for each 100 records and tabulate data
for ($i = 1; $i <= $len; $i+=100) {
// set search parameters for current iteration (first record = 1, 101, 201, 301 etc.)
$search_array = array(
'queryParameters' => array(
'databaseId' => 'WOS',
'userQuery' => $queryType1.'='.$queryJournal1 . $queryJournal2 . $queryJournal3 . ' AND ' .$queryType2. '=' .$queryTitle1 . $queryTitle2 . $queryTitle3,
'editions' => array('collection' => 'WOS', 'edition' => 'SCI'),
'timeSpan' => array('begin' => $timeStart, 'end' => $timeEnd),
'queryLanguage' => 'en'
),
'retrieveParameters' => array(
'count' => '100',
'sortField' => array(
array('name' => $sortType, 'sort' => 'D')
),
'firstRecord' => $i
)
);
// gather search response for current iteration
try {
$search_response = $search_client->search($search_array);
} catch (Exception $e) {
echo $e->getMessage();
};
// turn Soap Client object from current response into SimpleXMLElement
$xml = new SimpleXMLElement($search_response->return->records);
// save variable names for global use
$author1 = "";
// $author2 = "";
// $author3 = "";
$citations = "";
// iterate through current data set and tabulate onto webpage plus store in variable
foreach($xml->REC as $record) {
// first author
$author1 = (string)$record->static_data->summary->names->name[0]->full_name;
// second author
/* if (isset($record->static_data->summary->names->name[1]->full_name)) {
$author2 = (string)$record->static_data->summary->names->name[1]->full_name;
echo '<td>'.$author2.'</td>';
} else {
echo '<td>'."no record".'</td>';
$author2 = "no record";
}
// third author
if (isset($record->static_data->summary->names->name[2]->full_name)) {
$author3 = (string)$record->static_data->summary->names->name[2]->full_name;
echo '<td>'.$author3.'</td>';
} else {
echo '<td>'."no record".'</td>';
$author3 = "no record";
} */
// number of citations, if zero then finish populating array then 'break' out of loop entirely (not interested in zero cited records)
if (!in_array($record->dynamic_data->citation_related->tc_list->silo_tc->attributes(), $ignore)) {
$citations = (string)$record->dynamic_data->citation_related->tc_list->silo_tc->attributes();
} else {
break 2;
};
// for this iteration map all the values recorded into a temporary array variable, aRecord (equivalent to one row of data in table)
$arecord = array("author1"=>strtoupper($author1),
// "author2"=>$author2,
// "author3"=>$author3,
"citations"=>$citations
);
// pass the data from this iteration into the array variable '$recordArray', after all iterations, each element in $recordArray will be a single record or row of data for a single journal
array_push($recordArray, $arecord) ;
}
};
// need to replace single quotes in text to avoid escaping when inserting to mysql, and other charas to help remove duplicates
for ($i = 0; $i < count($recordArray); $i++) {
$recordArray[$i]['author1'] = str_replace("'", " ", $recordArray[$i]['author1']);
$recordArray[$i]['author1'] = str_replace(".", "", $recordArray[$i]['author1']);
$recordArray[$i]['author1'] = str_replace(". ", "", $recordArray[$i]['author1']);
$recordArray[$i]['author1'] = str_replace(" ", "", $recordArray[$i]['author1']);
// $recordArray[$i]['author2'] = str_replace("'", " ", $recordArray[$i]['author2']);
// $recordArray[$i]['author3'] = str_replace("'", " ", $recordArray[$i]['author3']);
}
echo "</br>RETRIEVED DATA: </br>";
print "<pre>\n";
print_r($recordArray);
print "</pre>";
// as length of $j loop will decrease each time because of 'unset' its elements, create a variable to dynamically store its length
$length = count($recordArray);
$count = 0;
// iterate each author in $recordArray, ignore last value otherwise would end up comparing it to itself in inner loop
for ($i = 0; $i < (count($recordArray) - 1); $i++) {
// iterate each author in $recordArray a step ahead of the outer loop, compare each author with every other author in array
for ($j = ($i + 1); $j < $length; $j++) {
// if there is a match between author names then (@ignores undefined offset error occuring due to 'unset'):
if ($recordArray[$i]['author1'] === $recordArray[$j]['author1']) {
// add second citations value to first
$recordArray[$i]['citations'] += $recordArray[$j]['citations'];
// remove second instance
unset($recordArray[$j]);
// add to a variable the number of times 'unset' has been used for this iteration of $i
$count++;
}; // end if
}; // end inner loop ($j)
// decrease length of inner loop by $count, i.e. the number of elements that were removed in the last iteration, to make the length of the inner loop correct
$length -= $count;
// reset $count for next iteration of $i
$count = 0;
// reset indices
$recordArray = array_values($recordArray);
}; // end outer loop ($i)
// sort array according to citation values
// make sure that data is sorted correctly (citations_sum, high -> low)
usort($recordArray, function ($a, $b) {
return $b['citations'] - $a['citations'];
});
// only include first ten elements in array
$recordArray = array_slice($recordArray, 0, 10);
// make sure all the values are strings, when encoding the summed ints seem to cause problems
for ($i = 0; $i < (count($recordArray)); $i++) {
$recordArray[$i]['citations'] = (string)$recordArray[$i]['citations'];
};
echo "</br>FINAL DATA: </br>";
print "<pre>\n";
print_r($recordArray);
print "</pre>";
// turn top cited authors data into JSON file for displaying with JavaScript
// file_put_contents('data.json', json_encode($recordArray));
// clear the output buffer
while (ob_get_status()) {
ob_end_clean();
}
header("Location: data.php");
// include "data.php";
// output $recordArray in JSON format to be picked up by JavaScript in data.php
echo json_encode($recordArray);
// =================================================== //
// ================ TIMING END ======================= //
// =================================================== //
$mtime = microtime();
$mtime = explode(" ",$mtime);
$mtime = $mtime[1] + $mtime[0];
$endtime = $mtime;
$totaltime = ($endtime - $starttime);
echo "This page was created in ".$totaltime." seconds";
?>
**** ADDITIONAL ****
Full code for data.php as requested:
<!DOCTYPE HTML>
<html lang="en">
<head>
</head>
<body>
<!-- BREADCRUMBS -->
<div class="sg-orientation">
<a href="#content" class="sg-button sg-skiptocontent">Skip to Content</a>
<span class="sg-breadcrumbs">
<a href="http://www.ncl.ac.uk/">Newcastle University</a> >>
<a href="https://resviz.ncl.ac.uk/">Research Visualisation</a> >>
<strong href="#">Academic Intelligence</strong>
</span>
</div>
<!-- TITLE BAR -->
<div class="sg-titlebar">
<h1><a title="Newcastle University Homepage" accesskey="1" href="http://www.ncl.ac.uk/"/><span title="Newcastle University">Newcastle University</span></a></h1>
<h2><a href="https://resviz.ncl.ac.uk/wos/">Academic Intelligence</a></h2>
</div>
<div class="sg-navigation"> </div>
<div class="sg-content">
<!-- NAVIGATION BAR -->
<nav class="navbar navbar-default" role="navigation">
<div class="container">
<div class="navbar-header">
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li><a href="https://resviz.ncl.ac.uk/"><span class="glyphicon glyphicon-home"></span></a></li>
<li><a href="https://resviz.ncl.ac.uk/chords/">Research Visualisation</a></li>
<li><a href="index.html">Academic Intelligence</a></li>
</ul>
</div> <!-- navbar-collapse -->
</div> <!-- container -->
</nav> <!-- navbar -->
<section class="container">
<h1>Authors with Largest Number of Citations</h1>
<div class="chart well bs-component"></div>
<div class="jumbotron">
<h2>Information</h2>
<p>The y-axis represents the number of citations for publications for the author on the x-axis. Click on one of the bars to perform a search on name of the associated author in Google.</p>
<p>Try to find these authors on <a href="https://uk.linkedin.com/">LinkedIn</a> or the <a href="http://gtr.rcuk.ac.uk/" id="mail">Gateway to Research</a> sites.</p>
</div>
<script type="text/javascript">
console.log("Works to here...");
$(document).ready(function() {
// call to 'data.json' created in wos.php
$.getJSON('wos.php', function (data) {
alert(data);
// javascript variable to store json data
var topCited = data;
console.log(topCited);
// establish some margins for the graph area to avoid overlap with other HTML elements
var margin = {
top: 30,
right: 30,
bottom: 180,
left: 100
};
// initiate variables for max width and height of canvas for chart, determine largest citation value for domain and scaling
// width, 10 bars at 75px each plus 3px padding
var height = 500;
var width = 870;
var maxY = topCited[0].citations;
// set scale to alter data set so that it fits well in the canvas space
// map the domain (actual data range) to the range (size of canvas)
var linearScale = d3.scale.linear()
// 0 -> largest citations value
.domain([0, maxY])
// 0 -> 600
.range([0, height]);
// create canvas for chart
var svgContainer = d3.select(".chart").append("svg")
.attr("width", width)
// max size from data set plus 20px margin
.attr("height", height + margin.bottom);
// create an SVG Grouped Element (<g>) to contain all the 'bars' of the graph
var barGroup = svgContainer.append("g")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")");
// bind the data to SVG Rectangle elements
var bar = barGroup.selectAll("rect")
.data(topCited)
.enter()
.append("rect")
.attr("fill", "#7bafd4")
// highlight each bar as you hover over it
.on("mouseover", function () {
d3.select(this)
.attr("fill", "#003c71");
})
// transition to remove highlight from bar
.on("mouseout", function() {
d3.select(this)
.transition()
.duration(250)
.attr("fill", "#7bafd4");
});
// set variable to store bar width + padding
var barWidth = 78;
// set attributes for the rectangles (bars)
var rectAttributes = bar.attr("width", 75)
// set bar height by value of citations
.attr("height", function (d) {
return linearScale(d.citations);
})
// index * 78 will move each bar (width, 75px) one bar width along and leave 3px padding
.attr("x", function (d, i) {
return i * barWidth;
})
// this is determined from the top left corner so to get the bar at the bottom, take the bar height from the canvas height
.attr("y", function (d) {
return height - linearScale(d.citations);
})
// bind the data to SVG Text elements
var text = barGroup.selectAll("text")
.data(topCited)
.enter()
.append("text");
// set attributes for the text on bars (citation values)
var barLabels = text.attr("x", function (d, i) {
return (barWidth * i) + 37.5; // sets to halfway between each bar horizontally
})
.attr("y", function (d) {
return height - (linearScale(d.citations)) - 3; // sets to top of each bar + 5 to sit just above bar
})
.text(function (d) {
return d.citations; // value to display, citations value (number)
})
.style("text-anchor", "middle")
.attr("font-family", "Raleway")
.attr("font-size", "26px")
.attr("fill", "#7bafd4");
// create a scale for the horizontal axis
var xScale = d3.scale.ordinal()
.domain(data.map(function (d) {
return d.author1;
}))
.rangeRoundBands([0, 780], 0);
// create a scale for the vertical axis
var yScale = d3.scale.linear()
.domain([0, maxY])
.range([height, 0]);
// define x-axis
var xAxis = d3.svg.axis()
.scale(xScale)
.orient("bottom")
.ticks(10);
// define y-axis
var yAxis = d3.svg.axis()
.scale(yScale)
.orient("left")
.ticks(10);
// if this calculation is done in "translate" below, it concatenates instead of adding values
var translateY = height + margin.top;
// create x-axis
svgContainer.append("g")
.attr("class", "axis")
.attr("transform", "translate(" + margin.left + "," + translateY + ")")
.call(xAxis)
// select author names
.selectAll("text")
.attr("font-family", "Lora")
.style("text-anchor", "end")
// spacing
.attr("dx", "-.8em")
.attr("dy", ".15em")
// rotate text as too long to display horizontally
.attr("transform", function (d) {
return "rotate(-45)";
});
// create y-axis
svgContainer.append("g")
.attr("class", "axis")
.attr("transform", "translate(" + margin.left + "," + margin.top + ")")
.call(yAxis)
// append a title to the y-axis
.append("text")
.attr("transform", "rotate(-90)")
.attr("y", -70)
.attr("x", -200)
.style("text-anchor", "end")
.attr("fill", "#000")
.attr("font-family", "Lora")
.attr("font-size", "24px")
.text("Citations");
// create link when user clicks on a single bar of data
d3.selectAll("rect")
.on("click", function (d) {
// variable stores url for google and adds author name relevant to bar that was clicked
var url = "https://www.google.co.uk/#q=" + d.author1;
// add an href html element with the url attached
$(location).attr("href", url);
window.location = url;
});
})
});
</script>
<div class="row">
<div class="col-lg-5">
<div class="alert alert-danger">
<h3>Temporary Graph is Temporary</h3>
</div>
</div>
<div class="col-lg-7"></div>
</div> <!-- row -->
<table class="table table-striped table-hover">
<tbody id="searchData"></tbody>
</table>
</section> <!-- container -->
</div> <!-- sg-content -->
<!-- FOOTER -->
<div class="sg-clear"> </div>
<div class="sg-footer">
<p><a href="http://www.ncl.ac.uk/res/about/office/research/">Research & Enterprise Services</a><br/>Newcastle University, Newcastle Upon Tyne,<br/>NE1 7RU, United Kingdom<br/><a href="mailto:[email protected]">Email Webmaster</a><br/><br/>© 2014 Newcastle University</p>
</div>
<!-- bootstrap js -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<!-- check browser version, if outdates, prompt for update -->
<script src="//browser-update.org/update.js"></script>
**** ADDITIONAL ****
Full code for index.php as requested:
<!DOCTYPE HTML>
<head>
</head>
<body>
<!-- main content -->
<section class="container">
<div class="row">
<!-- search params -->
<form action="wos.php" method="post" role="form" class="form-horizontal" id="form">
<fieldset>
<div class="form-group">
<div class="col-lg-6 well bs-component">
<div class="journal_fields_wrap">
<!-- keyword(s) for journal name(s) -->
<label>Journal Title</label>
<a class="btn btn-success" id="journal_list" target="_blank" href="http://ip-science.thomsonreuters.com/cgi-bin/jrnlst/jlresults.cgi?PC=D">Journal List</a>
<button class="add_journal_field_button btn btn-info" type="button">Add more fields</button>
<div>
<input class="form-control" type="text" name="journal1" data-toggle="tooltip"
title="this is a tooltip">
</div>
</div>
<div class="title_fields_wrap">
<!-- keyword(s) for paper title(s) -->
<label>Keyword</label>
<button class="add_title_field_button btn btn-info" type="button">Add more fields</button>
<div>
<input class="form-control" type="text" name="title1" data-toggle="tooltip"
title="">
</div>
</div>
<!-- timespan -->
<label>TIMESPAN</label></br>
<label>From: <input class="form-control" type="date" name="timeStart" placeholder="YYYY-MM-DD"></label>
<label>To: <input class="form-control" type="date" name="timeEnd" placeholder="YYYY-MM-DD"></label><br/><br/>
<!-- execute search -->
<button type="submit" class="btn btn-primary btn-lg">Submit</button>
</div> <!-- col-lg-6 -->
<div class="col-lg-6 well bs-component">
<div class="jumbotron">
<h1>How to..</h1>
<p>Please enter only one journal title or keyword per box.</p>
<p>If you would like further information on x, y and z, then please,
<a class="btn btn-warning btn-lg" target="_blank" href="#">Click here</a></p>
</div>
</div>
</div> <!-- form-group -->
</fieldset>
</form>
</div> <!-- row -->
<!-- TEMPORARY PLACEMENT FOR LOADING BAR -->
<div class="row">
<div class="col-lg-6">
<h3 style="color:red">Temporary progress bar is Temporary</h3>
<div class="progress progress-striped active">
<div class="progress-bar" style="width: 40%"></div>
</div>
</div>
<div class="col-lg-6"></div>
</div>
</section> <!-- main content; container -->
</div> <!-- sg-content -->
<!-- FOOTER -->
<div class="sg-clear"> </div>
<div class="sg-footer">
<p>Research & Enterprise Services<br/>Newcastle University, Newcastle Upon Tyne,<br/>NE1 7RU, United Kingdom<br/><a href="mailto:[email protected]">Email Webmaster</a><br/><br/>© 2014 Newcastle University</p>
</div>
<!-- SCRIPTS -->
<!-- jquery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- local script -->
<script src="script.js"/></script>
<!-- bootstrap js -->
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<!-- angularJS -->
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<!-- check browser version, if outdates, prompt for update -->
<script src="//browser-update.org/update.js"></script>
</body>
wos.phpis coming up with a 302 Found, so that all seems fine, I think..wos.php. If I surf to it in browser, the redirect automatically sends me todata.php. If I take out the redirect, it displays the various bits of data I have printed out to the screen withprint_r. I use this to check that the data looks correct whilst being processed by PHP.index.phpwhere user submits data to a form, this data is then processed withwos.phpand the resulting data sent todata.phpto display in a bar graph