0

JSON オブジェクトを使用して、Django サーバーへの特定の要求に応答しています。

return HttpResponse(json.dumps(geojson), mimetype="application/json")

しかし、HTML/javascript で取得する方法がわかりません。私は多くの同様の質問とチュートリアルを経験しましたが、それらはすべて、JSON の例を使用して文字列変数を定義し始めています。しかし、サーバーが応答している JSON を取得する方法を見つけることができませんでした。

ヘルプやチュートリアルのリンクはありますか?

編集: jQuery.ajax を提案どおりに使用しようとしましたが、関数は実行されません:

map-config.js の内容:

var jsondata;
var lon = 5;
var lat = 40;
var zoom = 5;
var map, layer;

function init(){
    map = new OpenLayers.Map( 'map' );
    layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
            "http://vmap0.tiles.osgeo.org/wms/vmap0",
            {layers: 'basic'} );
    map.addLayer(layer);
    map.setCenter(new OpenLayers.LonLat(lon, lat), zoom);

    var geojson_format = new OpenLayers.Format.GeoJSON();
    var vector_layer = new OpenLayers.Layer.Vector(); 
    map.addLayer(vector_layer);
    vector_layer.addFeatures(geojson_format.read(jsondata)); // Feeding with the json directly
}

$.ajax({
  url: "localhost:8000/form/",
  type: "POST",
  dataType: "json"
}).done(function (data) {
  $("#dialog").dialog('Hello POST!');
  console.log(data);
  jsondata = data; // Saving JSON at a variable so it can be used with the map
});

フォーム用の別のjsファイルもあり、正しく機能します。HTML ファイルは次のとおりです。

<html>
<head>  
    <script src="{{STATIC_URL}}js/jquery-1.9.1.js"></script>
    <script src="{{STATIC_URL}}js/jquery-ui-1.10.3.custom.js"></script>
    <script src="{{STATIC_URL}}js/OpenLayers.js"></script>
    <script src="{{STATIC_URL}}js/form.js"></script>
    <script src="{{STATIC_URL}}js/map-config.js"></script>
    <link rel="stylesheet" href="{{STATIC_URL}}css/jquery-ui-1.10.3.custom.css">
    <link rel="stylesheet" href="{{STATIC_URL}}css/style.css" type="text/css">
</head>

<body onload="init()">
    <div id="form" class="form-style">
        <p>Start Date: <input type="text" id="id_startDate"></p>
        <p>
            <label for="amount">Interval:</label>
            <input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
        </p>
        <p> <div id="id_interval"></div> </p>

        <p>
          <button id="id_okButton">OK</button>
        </p>
        </p>
    </div>

    <div id="map" class="smallmap">
</body>

そのため、サーバーから送信された json で POST リクエストを受信すると、jQuery.ajax メソッドが実行され、マップにデータが表示されます (正確には、その上にポリゴンを描画します)。FireBug で述べられているように、その POST は問題ありません (スナップショットは json オブジェクト全体を表示していません。これは大きいです):

FireBug での JSON 応答スナップショット

4

2 に答える 2