0

以下に私のサンプルコードを示します。私はindex.phpjqueryタブを定義します。タブの1つでマップ(openlayers)を開き、このマップにマーカーを配置する必要があります。各マーカーの緯度と経度は、MySQLDBから取得されます。put_marker問題は、DBからデータを読み取る関数をどこでどのように実行するかがわからないことです。私はそれが基本的な質問であるべきだと知っています。

index.php

    <script type="text/javascript">
              $(document).ready(function() {
                    $("#tabs").tabs({
                    ajaxOptions: {
                        success: function( html ) {
                            $("#content").html(html);
                            page_init();
                        }
                    }
                });
              });
</script>
    <div id="tabs">
        <ul>
            <li><a href="administration.php"><span>Administration</span></a></li>
            <li><a href="map.php"><span>Map</span></a></li>
        </ul>
    </div>

map.php

    <?php
        include_once 'include/DatabaseConnector.php';
        $query4="SELECT r.resLatitude, r.resLongitude FROM resources r;";
        $result4=DatabaseConnector::ExecuteQueryArray($query4);

        foreach ($result4 as $row):
// HERE I HAVE A PROBLEM
            //putMarker($row['resLatitude'],$row['resLongitude']);      
        endforeach;
    ?>
        <script src="http://www.openlayers.org/api/OpenLayers.js"></script>
        <script type="text/javascript">
            var map, layer;

            function page_init(){
                map = new OpenLayers.Map("basicMap");
                var mapnik         = new OpenLayers.Layer.OSM();
                var fromProjection = new OpenLayers.Projection("EPSG:4326");   // Transform from WGS 1984
                var toProjection   = new OpenLayers.Projection("EPSG:900913"); // to Spherical Mercator Projection
                var position       = new OpenLayers.LonLat(2.07833,41.2969).transform( fromProjection, toProjection);
                var zoom           = 15; 
                map.addLayer(mapnik);
                map.setCenter(position, zoom );
            }

            function putMarker(latMarca, lonMarca)
            {
                var lonLat = new OpenLayers.LonLat(lonMarca ,latMarca ).transform(new OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());
                var zoom=16;
                var markers = new OpenLayers.Layer.Markers( "Markers" );
                map.addLayer(markers);
                markers.addMarker(new OpenLayers.Marker(lonLat));
                map.setCenter (lonLat, zoom);
            }
        </script>
        <div id="basicMap" style="width: 100%; height: 100%;">

        </div>
4

1 に答える 1

1

さて、あなたはサーバー側のPHPでマーカーを取得しています。そして、それらをクライアント側のJavascriptに渡します。2つの異なる場所。

実際、最も単純なケースでは、JSON操作でも必要ありません。map.phpで、次のことができます。

    ..
    echo '<script type="text/javascript">';
    echo '$(document).ready(function() {';
    foreach ($result4 as $row){
        echo 'putMarker('.$row['resLatitude'].','.$row['resLongitude'].');';      
    }
    echo '});';
    echo '</script>';
    ...

これらのコードは、クライアント側では純粋なJSとして解釈されますが、値はPHPから取得されます。

ちなみに、同じようにコードを書くのは良いアプローチではありません。コードと外観が互いに分離されているMVCフレームワークに注目してください。

于 2012-05-22T12:22:21.570 に答える