Dynamic loop variable in JavaScript with PHP elements -

i'm using jquery plugin called imagemapster create map mysql / php content , values.

there 120+ defined areas on map , i'd use loop write code each pop tooltip. although can create loop in javascript , replace plain text i'm not having luck including javascript variables (i) inside php elements.

the code i'm trying replace below. i'd every instance of number (1,2 , 3) generated loop. possible mix javascript , php this?

<script> $(document).ready(function () {  $('#shape1').mapster({ showtooltip: true, tooltipcontainer: '<div class="map_popup"></div>',     fill : true,    areas:  [           {                            key: "1",             tooltip: "controller 1<p>                      production <?php echo $sumofsup_ac_today_1; ?> kwh<br>                      energy <?php echo $sumofac_p_1; ?> kw<br>",                      },            {                            key: "2",             tooltip: "controller 2<p>                      production <?php echo $sumofac_today_2; ?> kwh<br>                      energy <?php echo $sumofac_p_2; ?> kw<br>",                      },            {                            key: "3",             tooltip: "controller 3<p>                      production <?php echo $sumofsup_ac_today_3; ?> kwh<br>                      energy <?php echo $sumofac_p_3; ?> kw<br>",                      }             etc etc... 

yes possible, cannot have newlines in javascript.

in modern browsers can use backtick instead of quotes

tooltip: `controller 1<p>           production <?php echo $sumofsup_ac_today_1; ?> kwh<br>           energy <?php echo $sumofac_p_1; ?> kw<br>` 

but compatible, use \n or nothing instead:

tooltip: "controller 1<p>\nproduction <?php echo $sumofsup_ac_today_1; ?> kwh<br>\nenergy <?php echo $sumofac_p_1; ?> kw<br>" 

you can generate strings in php:

how handle newlines in javascript? (from php)