Problem with Unicode arrow →

Community Help
1

Hello,
I am using Observable Plot in Nodejs and rendering it in a browser with http. I am reproducing the first example from this page. Everything works fine, but the arrows are replaced by →.

Here is my full code:

import http from 'http';
import * as Plot from "@observablehq/plot";
import {JSDOM} from "jsdom";

const jsdom = new JSDOM(`
<!DOCTYPE html><body>
<div class='container'><figure id='graphic'>
</figure></div></body>`);

const sales = [
  {units: 10, fruit: "fig"},
  {units: 20, fruit: "date"},
  {units: 40, fruit: "plum"},
  {units: 30, fruit: "plum"}
];

jsdom.window.document.getElementById('graphic')
                     .appendChild(Plot.dot(sales, {x: "units", y: "fruit"})
                     .plot({document: jsdom.window.document}));

http.createServer(function (req, res) {
  let html = jsdom.serialize();
  res.end(html);
}).listen(8080);

And here is what shows up:
image

How to get these arrows to appear correctly?
Thank you

2

Problem solved, I needed to add <meta charset="utf-8"> in my jsdom definition:

const jsdom = new JSDOM(`
<!DOCTYPE html>
<head><meta charset="UTF-8"></head>
<body>
<div class='container'><figure id='graphic'>
</figure></div>
</body>`);
1 Like