I am building my first real project and using D3.js library for visualization. I was trying to deploy a Bar Chart in D3.js but I am having some problem in my JSON response in d3.json() function. Here is my code:
d3.json("<?= base_url(). "/testingGraph";?>").then( function(data) {
console.log(data);
})
The response looks good, with status of 200. Here is a look into it:
Response:
Preview:
But the console Tab is giving following errors:
VM1686:2 Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 456
Promise.then (async)
(anonymous)
Here is my Controller sending the data:
public function testingGraph()
{
$db = \Config\Database::connect();
$dataTableQuery = $db->query("SELECT agent_name, COUNT(id) as transfer FROM `transfers` GROUP BY agent_name ORDER BY transfer DESC LIMIT 10");
$result = $dataTableQuery->getResultArray();
echo json_encode($result, JSON_NUMERIC_CHECK);
}
By the looks of it, I feel I have done everything right, but I can not seem to find the solution to the issue. My response is JSON from PHP, and the preview and status looks good to me, what am I doing wrong?