value from php EOT causing javascript map error

Question

trying to render mapSvg via value from php.

however having an issue when mapSvg trying to read value from php variable...

if I bring in php value into chosen_source, then and do this

jQuery('#map-'+chosen_source).mapSvg(

then this above line will trigger the mapsvg getComputedStyle error.

if I directly hardcode jQuery('#map-newyork').mapSvg( then no error

if I declare var chosen_source = 'newyork';
then no error.

mapsvg.min.js:1 Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
    at new MapSVG.ResizeSensor (mapsvg.min.js:1:746)
    at Object.setResponsive (mapsvg.min.js:3:2667)
    at Object.setSize (mapsvg.min.js:3:2119)
    at Object.<anonymous> (mapsvg.min.js:4:25190)
    at c (jquery-3.6.0.min.js:2:28327)
    at Object.fireWith [as resolveWith] (jquery-3.6.0.min.js:2:29072)
    at l (jquery-3.6.0.min.js:2:79901)

<?php

$state = "newyork";

$printout = <<<EOT

    var view_width = jQuery("#content").width();
    var chosen_source = `{$state}`;
    var w = 1000;
    var h = 500;
    var vB = [map_source.get(chosen_source).get('vb_L')];

jQuery('#map-'+chosen_source).mapSvg(
    {width: w,
    height: h,
    source: "/map/"+ map_source.get(chosen_source).get('source') 
});
EOT;

echo $printout;
?>

anyone have solution on this?