Hello I would like to put a d3.js map on a static page on my ghost blog. I have built my own custom theme. Routing to static pages such as page-about, page-contact via About and Contact works great and was easy enough to set up following the documentation!
The problem I have d3.json() fetch module only takes a URL to retrieve the geo json data. I don’t know how I need to modify routes.yaml to make the geojson file available via the URL or if I should be doing this entirely differently. Right now I have:
The file located here:
/content/themes/biketheweb/data/custom.geo.json
my js code is
d3.json(
“/data/custom.geo.json”, function(json) {
//Bind data and create one path per GeoJSON feature
countriesGroup = svg.append(“g”).attr(“id”, “map”);
the error I get is:
GET http://localhost:2368/data/custom.geo.json/ 404 (Not Found)
my routes.yaml file is
routes:
/:
controller: channel
data: page.home
template:
- home
collections:
/blog/:
permalink: /blog/{slug}/
template:
- index
taxonomies:
tag: /tag/{slug}/
author: /author/{slug}/
My dev ghost version is:
Ghost-CLI version: 1.9.9
Ghost version: 2.2.0 (at ~/blog/dev)
Production versions is:
Ghost-CLI version: 1.9.9
Ghost version: 2.11.1 (at /var/www/ghost)
My browser is Chrome and I am viewing the js error via the console in developer tools.
My production stack is a digital ocean droplet configured as with ubuntu 18.04 etc. following the Ghost instructions.
I’ve read through the documentation but nothing seemed to really address this issue. However I can’t imagine I am the only person who would like put d3.js visualizations on their blog using their own data.
Thank you!