javascript — ошибка openlayers: Json не отображается
Извините за мой английский, но я использую перевод Google.
Я пытаюсь разработать веб-приложение с openlayers 3.
Принцип: с помощью php выбрать в базе данных gis слоев.
Моя проблема:
JSON не будет отображаться в интерфейсе, я думаю, что это, вероятно, проблема в JavaScript, но я не могу найти.
Мой скрипт php работает правильно и верните мне геойсон.
Спасибо за помощь мне,
До скорой встречи
<html>
<head>
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1.0">
<title>Smiddest</title>
<link type="text/css" rel="stylesheet" href="css/jquery-ui.css">
<link rel="stylesheet" href="http://openlayers.org/en/v3.17.1/css/ol.css" type="text/css">
<link rel="stylesheet" href="css/ol3-layerswitcher.css">
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="css/materialize.css" media="screen,projection">
<link type="text/css" rel="stylesheet" href="css/main.css">
</head>
<body>
<?php
if(isset($_SESSION['mem_id']) AND $userinfo['mem_id'] == $_SESSION['mem_id']) {
?>
<header>
<?php include 'header.php' ?>
</header>
<main>
<div class="row">
<div class="col s8 m8 l8">
<div id="map" class="map"></div>
</div>
<div class="col s4 m4 4">
<div class="col s6 m6 l6"></div>
<div class="col s6 m6 l6">
<?php
$date = date("d/m/Y");
Print('<div class="heure">' . "$date" . '</div>');
?>
</div>
</div>
</div>
</main>
<!-- Fin du isset -->
<?php
}
?>
<script src="js/ol.js" type="text/javascript"></script>
<script src="js/ol3-layerswitcher.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery-3.1.0.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
<script src="js/materialize.js"></script>
<script src="js/app.js"></script>
</body>
</html>
JavaScript:
$(".button-collapse").sideNav();
var map = new ol.Map({
target: 'map',
layers: [
new ol.layer.Group({
'title': 'Fond de cartes',
layers: [
new ol.layer.Vector({
title: 'Chemins',
source: new ol.source.Vector({
url: 'getData.php',
format: new ol.format.GeoJSON(),
projection: 'EPSG:3857',
}),
}),
new ol.layer.Tile({
title: 'MapBox Street',
type: 'base',
visible: true,
source: new ol.source.XYZ({
url: 'https://api.mapbox.com/styles/v1/mapbox/streets-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiamF1ZnJ5IiwiYSI6ImNpcmVsbjg1YjAwMGhpY200b2xudmQ3bmUifQ.vSOJfU9DMMEa7JDss5TDQA'
})
}),
new ol.layer.Tile({
title: 'Fond OSM',
type: 'base',
visible: true,
source: new ol.source.OSM()
}),
]
}),
],
view: new ol.View({
center: ol.proj.fromLonLat([-0.57, 45.22]),
zoom: 10
})
});
var layerSwitcher = new ol.control.LayerSwitcher({
tipLabel: 'Légende'
});
map.addControl(layerSwitcher);
php:
<?php
try{
$bdd = new PDO ("pgsql:host=localhost;port=8356;dbname=BDD_SMIDDEST;user=postgres") or die(print_r($bdd->errorInfo()));
$bdd->exec("SET NAMES utf8");
$bdd->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_WARNING);
}
catch(Exeption $e){
die("Erreur!".$e->getMessage());
}
$qry = $bdd->prepare("SELECT dgs_id, ST_ASGeoJSON(geom) AS geojson FROM departements_geofla_sage");
$qry->execute();
// Renvoit un chemin au format GeoJSON
$geojson = array("type" => "FeatureCollection",
"features" => array()
);
// Ajouter un tronçon au tableau GeoJSON
while($row=$qry->fetch())
{
$feature = array("type" => "Feature",
"geometry" => json_decode($row["geojson"], true),
"crs" => array(
"type" => "EPSG",
"properties" => array("code" => "3857")
),
"properties" => array(
"dgs_id" => $row["dgs_id"]
)
);
// Ajouter un tableau d"éléments au tableau de collection d"éléments
array_push($geojson["features"], $feature);
}
// Fermeture de la connexion
$bdd = null;
// Renvoyer le résultat
echo json_encode($geojson);
?>
Геойсон:
Решение
Задача ещё не решена.
Другие решения
Других решений пока нет …