I encountered an error message in my console while attempting to create a data visualization using d3. The specific error is as follows:
Error: <g> attribute transform: Expected number, "translate(NaN,NaN)".
To build this visualization, I drew inspiration from a Plunker and made some adjustments to suit my data. Here is the link to the Plunker I referenced:
http://plnkr.co/edit/FiUrNHNMAXd7EBpr5uY5?p=preview&preview
Any assistance with resolving this issue would be greatly appreciated. I have not made any changes to my index.html file:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.9/d3.js"></script>
</head>
<body>
<script src="script.js"></script>
</body>
</html>
My script.js file contains the following code:
// JavaScript code here
In my CSV file, the structure is like this (with 'group' replaced by 'city_index' and 'radius' replaced by 'Happy'):
index | name | city_index | Happy -----> Header Row
0 | Joe | 3 | 60 -----> Data Row
I am currently stuck at this point and cannot figure out why the visualization is not working despite having similar data structures as in the example I referenced. I have tried removing the parser and adjusting the "transform, translate" properties without success.
Your help in troubleshooting this issue would be highly appreciated.