Using d3js with Nikola

[Nicolas Guarin]

Hello,

I am trying to add this script to a blog post

    http://bl.ocks.org/nicoguaro/b34fe29feb232413375b

I place the .tsv file in files and then, use the relative path to it. But the file is not copied to the output, and does not work. If I manually
place the file in the expected path it works.

Also, it appears in the wrong place... I think that this could be fixed replacing

   

    d3.select("body").append("svg")

by


   d3.select("div").append("svg")

[Chris Warrick]

> --
> You received this message because you are subscribed to the Google Groups
> "nikola-discuss" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to nikola-discus...@googlegroups.com.
> For more options, visit https://groups.google.com/d/optout.

* Where do you place the .tsv file?
* What is FILE_FOLDERS set to?
* What paths do you use?
* How do you use it in your code?
* The JS snippet assumes the document contains nothing else; you need
to adjust it to get into the post contents. How to that depends on
d3’s inner workings.

--
Chris Warrick <https://chriswarrick.com/>
PGP: 5EAAEA16

[Nicolás Guarín-Zapata]

> * Where do you place the .tsv file?

I place it in files.

> * What is FILE_FOLDERS set to?

This is the line that set it up

FILES_FOLDERS = {'files': ''}

> * What paths do you use?

I was using the relative path

../files/materials.tsv

Another option is to use an URL from a file stored remotely, e.g.


https://gist.githubusercontent.com/nicoguaro/b34fe29feb232413375b/raw/d6c9ab62639de30f1ebdeca5225b3d23b1ba0df7/materials_E_density.tsv

> * How do you use it in your code?

I read the material data from this file to generate a visualization
like this one

http://bl.ocks.org/nicoguaro/raw/b34fe29feb232413375b/

> * The JS snippet assumes the document contains nothing else; you need
> to adjust it to get into the post contents. How to that depends on
> d3’s inner workings.

Yes, I noticed that ... I just realized that I can insert the content
inside the post using the tag article. Then, I can
add content with something like

var svg = d3.select("article").append("svg");

[Chris Warrick]

On 28 June 2017 at 02:03, Nicolás Guarín-Zapata <nicog...@gmail.com> wrote:
>> * Where do you place the .tsv file?
>
> I place it in files.
>
>
>> * What is FILE_FOLDERS set to?
>
> This is the line that set it up
>
> FILES_FOLDERS = {'files': ''}
>
>
>> * What paths do you use?
>
> I was using the relative path
>
> ../files/materials.tsv

You can’t refer to it like that. Since you set files to the site root,
you must use /materials.tsv as your path. (Note that since you’re
doing it in JS code, you need to adjust the path if your site is not
in the server root.)