D3.js: "Uncaught SyntaxError: Unexpected token ILLEGAL"?

Javascriptd3.js

Javascript Problem Overview


I've just downloaded D3.js from d3js.org (link to zip file), unzipped it, and referenced it in the following HTML page:

<html>
<head>
<title>D3 Sandbox</title>
<style>
</head>
<body>
<script src="/d3.v3.js"></script>
</body>
</html>

But when I load this page, my console (in Chrome) is giving me this error:

Uncaught SyntaxError: Unexpected token ILLEGAL: line 2

It doesn't like the pi and e symbols at the start of the file. Errrr... what can I do about this? I am serving the file with python's SimpleHTTPServer.

Update: yes I know I can just link to a CDN version, but I would prefer to serve the file locally.

Javascript Solutions


Solution 1 - Javascript

Try specifying the UTF-8 charset on the HTML host document :

<meta http-equiv="content-type" content="text/html; charset=UTF8">

D3 contains UTF-8 symbols (like π) invalids in non-UTF8 documents.

Solution 2 - Javascript

That sounds like a problem with encoding. I recommend The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets (No Excuses!). Despite the somewhat condescending title, it contains some very useful information. Specifically, it sounds like your server is serving the d3.v3.js file with the wrong encoding.

Solution 3 - Javascript

Add 'charset="utf-8"'

<script src="/d3.v3.js" charset="utf-8"></script>

Solution 4 - Javascript

I tried setting the charset in the doc and in the script tag itself, but Chrome doesn't seem to care. Not sure if i'm doing something wrong.

I did find success by running it through uglify with the --ascii-only option first.

UPDATE: Turns out my View->Encoding setting in Chrome was not on Auto-Detect, but some Western encoding. Not sure why, but changing that resolved the problem. Ridiculous that that setting would trump a charset property right on the script tag. Considering that users might be in the same situation and not be able to figure it out, i'll still be using uglify to ensure success.

Solution 5 - Javascript

Check if you have a plus sign between all of your string concatenations, if you do not this error will be generated.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionRichardView Question on Stackoverflow
Solution 1 - JavascriptLaurent JégouView Answer on Stackoverflow
Solution 2 - JavascriptT.J. CrowderView Answer on Stackoverflow
Solution 3 - JavascripthewsonismView Answer on Stackoverflow
Solution 4 - JavascriptNathan BubnaView Answer on Stackoverflow
Solution 5 - JavascriptuserFogView Answer on Stackoverflow