Add js for Google Charts to Front Matter (solved, thanks!)

support
1

Hi,

I am new to Hugo and find it really really great, thanks!!!

And can you please help with the following: (I have really read and tried all day but cannot get it to work…)

How to define spam = " [‘school A’, 8, 0, 7, 0, 7, 0, 7] " in the Front Matter of a specific page and get this in the HTML output as [‘school A’, 8, 0, 7, 0, 7, 0, 7] ?

Whatever I try (spaces / backslashes, printf “S” $, {{< >}} …) I get errors or automatic " " in HTML but not just [‘school A’, 8, 0, 7, 0, 7, 0, 7].

FYI, [‘school A’, 8, 0, 7, 0, 7, 0, 7]. is a bit of data in javascript for Google Charts. The template will make a nice chart of each content.md if only I could get it to work :slightly_smiling:

Please advise, many thanks in advance!, kind regards, Wouter

2

@Wouter, can you give more of the surrounding code in the template you’re trying to make? I’m guessing this is being added to an embedded <script> tag?

3

Hi,

Thanks for the quick reply! Yes, it is within a script tag.

The schoolA.md just contains

     '+++
     date = "2016-03-12T20:16:09+01:00"
     name = "school A"
     school = ''['school A', 8, 0, 7, 0, 7, 0, 7]''
     +++'

And the single.html template uses e.g.
{{ .Params.name }}`
which works well.

The javascript is long, I just try to take out the variable data part line by line for now… (first try this, then maybe go for a map based on the data folder as I want to do this for 400 pages :slight_smile: )

`// Create the data table.
    var data = new google.visualization.arrayToDataTable([
      ['School', 'Speciaal-praktijk-kader', 'VMBO-kader', 'VMBO-T-voorheen MAVO', 'VMBO-T/HAVO', 'HAVO', 'HAVO/VWO', 
	  'VWO'],
	  {{ .Params.school }},
	  ['Gevers Deynootschool', 2, 0, 12, 0, 10, 0, 16],
      ['Het Kompas', 7, 1, 12, 0, 7, 5, 19],
      ['De Nuts', 14, 0, 14, 0, 6, 0, 11],
      ['De Vos', 0, 1, 5, 1, 6, 1, 15],
      ['De Regenboog', 7, 0, 5, 0, 6, 0, 10]
         ]);
      `

I hope that is clear?

Thanks! Wouter

PS FYI a handmade example at allecijfers.nl/voorbeeld

4

First remove the quotes:

 school = ['school A', 8, 0, 7, 0, 7, 0, 7]

Then you must make sure that you access inside script tags. Then you should get the correct format.

5

@Wouter Also be sure to look at safeJS in the docs:

6

It is solved, many thanks!

I just added | safeJS , i.e. use
{{ .Params.school | safeJS }} now and that removes the " ".

FYI I also removed the " " in the front matter, i.e.

`school = ['de Vink', 8, 0, 7, 0, 7, 0, 7]`

and tried that before but I believe that returns the error “Array contains values of type ‘String’ and ‘Integer’, but arrays must be homogeneous.” .

Very happy, thanks again!, Wouter