如何将此数据库记录字符串格式化为该JavaScript对象数组？

Question

In a MySQL Database table column, I have a value like this returned to my PHP script...

position=1&x=0.203125&y=0.23125&position=2&x=0.8427083333333333&y=0.415625&position=3&x=0.5510416666666667&y=0.4375&

Broken down it looks like this...

position=1&
x=0.203125&
y=0.23125&

position=2&
x=0.8427083333333333&
y=0.415625&

position=3&
x=0.5510416666666667&
y=0.4375&

So this particular record has 3 sets of a position , x , and y

Now in my PHP script while I am in a while loop getting each row from the database, I need to take this column and break the string into seperate variables so that it can create this JavaScript from the above example database value I need to build this JavaScript value with my PHP...

<script>
$('#photo1 .avoid').addAnnotations(annotation, [
    {x: 0.203125, y: 0.23125, position: 1},
    {x: 0.8427083333333333, y: 0.415625, position: 2},
    {x: 0.5510416666666667, y: 0.4375, position: 3}
  ]);  
</script>

So each record/row in my database will have a column that has values like this and I need to build that little JavaScript snippets in my Loop for each row.

I would appreciate any help in how I can extract and get the data in that column to build this JavaScript?

If an absolute must, I can also alter how that data is stored in that database column if it needs to be separated differently or something to make it easier. I appreciate any help with this thank you.

Simple PHP loop example...

<?php

foreach ($rmaRecord as $rma){

    $img1 = "
        <script>
        $(document).ready(function() {
            $('#photo1 .avoid').addAnnotations(annotation, [
               {x: 0.3875, y: 0.3246, position: 4},
               {x: 0.8427083333333333, y: 0.415625, position: 2},
               {x: 0.5510416666666667, y: 0.4375, position: 3}
            ]);  
        });
        </script>";

}

Answer 1

As per my comment, if you could save the data as json, that would be easiest, but presuming you cannot, try the following:

$data = 'position=1&x=0.203125&y=0.23125&position=2&x=0.8427083333333333&y=0.415625&position=3&x=0.5510416666666667&y=0.4375&';
$json = array();
$pairs = array_filter(explode('&', $data));

for($i=0; $i < count($pairs); $i+=3){
    $position = explode('=', $pairs[$i]);
    $position = $position[1];

    $x = explode('=', $pairs[$i+1]);
    $x = $x[1];

    $y = explode('=', $pairs[$i+2]);
    $y = $y[1];
    $json[]=array('x' => $x, 'y' => $y, 'position' => $position);
};

echo json_encode($json);
//echo '<pre>' . json_encode($json, JSON_PRETTY_PRINT) . '</pre>';

Answer 2

You are right that you need to split that string to an array and I think there are a number of ways to get that done. If your using a template style you can intersperse html with php. PHP is not my main strong point but as a quick and dirty solutions you can work with something like the folowing.

    <script>
        $(document).ready(function() {
            $('#photo1 .avoid').addAnnotations(annotation, [
    <?php

        $a = "position=1&x=0.203125&y=0.23125&position=2&x=0.8427083333333333&y=0.415625&position=3&x=0.5510416666666667&y=0.4375&";
        $a = preg_replace("/&$/","",$a);
        $array = array_chunk(preg_split("/&/",$a),3);
        $js_obj = "";
        foreach ($array as $key) {
            $js_obj .= "{" . $key[0] .",". $key[1] .",". $key[2] . "},";
        }

      echo preg_replace("/,$/","",$js_obj);
      // Outputs {position=1,x=0.203125,y=0.23125},{position=2,x=0.8427083333333333,y=0.415625},{position=3,x=0.5510416666666667,y=0.4375}

    ?>
            ]);  
        });
    </script>

Depending on your PHP version you could also try:

<script>
        $(document).ready(function() {
            $('#photo1 .avoid').addAnnotations(annotation, [
    <?php

        $a = "position=1&x=0.203125&y=0.23125&position=2&x=0.8427083333333333&y=0.415625&position=3&x=0.5510416666666667&y=0.4375&";
        $a = preg_replace("/&$/","",$a);
        $array = array_chunk(preg_split("/&/",$a),3);
        echo json_encode($array, JSON_PRETTY_PRINT);
        ?>
        ]);  
    });
</script>