[pmwiki-users] Trying to include this javascript code with custom markup

[ABClf]

Hello,

I am playing with AI to be given a code which :
1. collect years from my chronology div produced with pagelist ;
(i.e. extract 1918 from :  <span style="font-size: 83%;"><span
class="y1918" style="background-color:
#F5F5F5;"><code>1918</code></span></span>)
2. draw a timeline from these collected years.

After several tests, it looks like I can get something pretty
interesting for my needs with d3 graph library. Seems to be decently
working :
https://jsfiddle.net/4cox9yj5/

Yet I'm not sure how to port it to my PmWiki site.
I believe the custom markup is the way to go : ideally, write
(:chronology:) where I have a bunch of years and let the magic begin.

Well, well, I have tried using a custom markup (:chronologie:), like that :

Markup('chronologie', 'directives',
  '/\\(:chronologie:\\)/',
  Keep("
copy paste here the code given by AI
I just changed every " to \"
") );

Sadly, no magic yet, I am given this error message :

Warning: Use of undefined constant margin - assumed 'margin' (this
will throw an Error in a future version of PHP)
in/home/www/dev6/local/config.phpon line355

Warning: Use of undefined constant left - assumed 'left' (this will
throw an Error in a future version of PHP)
in/home/www/dev6/local/config.phpon line355

Warning: Use of undefined constant margin - assumed 'margin' (this
will throw an Error in a future version of PHP)
in/home/www/dev6/local/config.phpon line355

Warning: Use of undefined constant top - assumed 'top' (this will
throw an Error in a future version of PHP)
in/home/www/dev6/local/config.phpon line355

Warning: Cannot modify header information - headers already sent by
(output started at /home/www/dev6/local/config.php:355)
in/home/www/dev6/pmwiki.phpon line475

Warning: Cannot modify header information - headers already sent by
(output started at /home/www/dev6/local/config.php:355)
in/home/www/dev6/pmwiki.phpon line1923

line 355 is :
             .attr(\"transform\", `translate(${margin.left},${margin.top})`);

Going back to another AI to get a slightly different working code
(https://jsfiddle.net/1tLpxkuq/), I still have the same kind of error
line when including the code with custom markup (culprit line this
time is :
      .attr(\"transform\", `translate(0,${height - margin.bottom})`)

Going back to AI, asking how to fix the issue, it tells me I have
either to alter

             .attr(\"transform\", `translate(${margin.left},${margin.top})`);
in
             .attr("transform", "translate(" . $margin['left'] . "," .
$margin['top'] . ")");

either to load the javascript from an external javascript file (rather
than including it in my php file config) ;
thus my question becomes : how to include an external javascript from
custom markup rule and, more generally, what is the way to go to get
the magic begin ?

Thank you,
Gilles.