2015-10-20 69 views
1

從Openlayers-2.11移動到ol3時,我遇到了一個奇怪的問題。從mysql數據庫中動態提取的geojson文件有時會被渲染,有時不會渲染。提取通過PHP腳本完成。請以see this link爲例子。 我已經通過幾個在線JSON驗證器運行該文件,但他們都提出了「有效的JSON」作爲結果。由於geojson文件是動態的,我的第一個想法是可能有一些非法字符隱藏在文件中,但我無法找到任何。 ol3的實施非常簡單,渲染Geojson非常不穩定

var image = new ol.style.Circle({ 
    radius: 5, 
    fill: null, 
    stroke: new ol.style.Stroke({color: 'red', width: 1}) 
}); 

var styles = { 
'Point': [new ol.style.Style({image: image})] 
}; 

var styleFunction = function(feature, resolution) { 
    return styles[feature.getGeometry().getType()]; 
}; 

var vectorLayer = new ol.layer.Vector({ 
    source: new ol.source.GeoJSON({ 
       url: '../../../../yg/utils/retriveData.php', 
       projection: 'EPSG:3857' 
      }), 
    style: styleFunction 
}); 

我已經通過相同的代碼沒有麻煩運行其他靜態json文件。這個問題似乎只有這個動態文件。

請問在這種情況下什麼可能是最好的調試策略的準則。

PHP腳本看起來像這樣;

<?php 
$conn = new mysqli("localhost", "xxxxxxxx", "1234", "xxxxx"); 

$sql = 'SET names utf8'; 

$rs = $conn->query($sql); 

if (!$rs) { 
    echo 'An SQL error occured.\n'; 
    exit; 
} 

$sql = 'SELECT * FROM extract_data'; 

# Try query or error 
$rs = $conn->query($sql); 
if (!$rs) { 
    echo 'An SQL error occured.\n'; 
exit; 
} 

# Build GeoJSON feature collection array 
$geojson = array(
    'type'  => 'FeatureCollection', 
    'features' => array() 
); 

# Loop through rows to build feature arrays 
while ($row = $rs->fetch_array(MYSQLI_ASSOC)) { 
    $properties = $row; 
    # Remove x and y fields from properties (optional) 
    unset($properties['lat']); 
    unset($properties['lon']); 
    $feature = array(
    'type' => 'Feature', 
    'geometry' => array(
     'type' => 'Point', 
     'coordinates' => array(
      $row['lon'], 
      $row['lat'] 
     ) 
    ), 
    'properties' => $properties 
); 
# Add feature arrays to feature collection array 
array_push($geojson['features'], $feature); 
} 

header('Content-type: application/json'); 

echo json_encode($geojson, JSON_NUMERIC_CHECK); 

$conn = NULL; 
?> 
+0

可能是一個同步的問題。你有沒有注意到如果你的json更大,更多的時候它不會被渲染? –

+0

請顯示php –

+0

請將您的php限制爲10個功能,以便於調試。 –

回答

0

可能無法與您的問題,但我發現不對勁了在你的代碼

你是不是正確調用styleFunction,你是不是通過其featureresolution參數。

你可以嘗試進行調試:

var styleFunction = function(feature, resolution) { 
    return styles['Point']; //for debugging 
}; 

var vectorLayer = new ol.layer.Vector({ 
    source: new ol.source.GeoJSON({ 
       url: '../../../../yg/utils/retriveData.php', 
       projection: 'EPSG:3857' 
      }), 
    style: styleFunction() 
}); 

其他的事情,從OL3 Documentation,你應該這樣創建GeoJSON的您的向量層:

var vectorLayer = new ol.layer.Vector({ 
    source: new ol.source.Vector({ 
       url: '../../../../yg/utils/retriveData.php', 
       format: new ol.format.GeoJSON(), 
       projection: 'EPSG:3857' 
      }), 
    style: styleFunction() 
});