对这些地理服务器地址进行地理编码，以与小叶路由机一起使用

问题描述

晚上好，我希望您一切都好，这里我有一个项目来实现一个应用程序，以使用存储在geoserver中的地址数据生成路线，仅在这里，我已经在geoserver中给了它们，并且我已经开始使用传单，但仅在这里，我能够加载openstreetmap基本地图和geoserver地址层，并且我放置了小叶路由机及其运行，但是看不到我的geoserver数据否，需要帮助https://i.stack.imgur.com/mHG5j.jpg 然后如右图所示，我有一个很好的机器路由单页，它可以很好地运行，并使用提名的地址解析器确定路由，而小红点是要存储在地址服务器中的地址，只有路由机看不到它，所以我无法进行地址搜索在传单路由机上的这些红色桥梁上

html

<!DOCTYPE html>
 <html lang="fr">
<head>
    <Meta charset="UTF-8">
    <Meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Document</title>

    <!-- CSS only -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">

    <!-- Fichiers CSS -->
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcdubeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ==" crossorigin=""/>
    <!-- Ces deux balises link sont à insérer entre les deux balises existantes -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.css" />
    <link rel="stylesheet" href="https://unpkg.com/leaflet-routing-machine@latest/dist/leaflet-routing-machine.css" />
            
    <link rel="stylesheet" href="css/Stile.css">

</head>
<body>

    <div id="bandeau">
        <div id="titre">Adresse Douala</div> 
    </div>
        <div id="cadre">
        <div id="map"></div>
        </div>
    

    <!-- Fichiers JS -->
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js" integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew==" crossorigin=""></script>
    <!-- Ces deux balises script sont à insérer entre les deux balises existantes -->
    <script src="https://unpkg.com/leaflet-control-geocoder/dist/Control.Geocoder.js"></script>
    <script src="https://unpkg.com/leaflet-routing-machine@latest/dist/leaflet-routing-machine.js"></script>

    <script src="js/Stile.js"></script>
</body>

javascrit

// On s'assure que la page est chargée
 window.onload = function(){
// On initialise la carte sur les coordonnée du cameroun
// Initialiser la carte

var map = L.map('map',{
    center: [4.05,9.7],zoom: 7 });
    L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(map);        

var National = L.tileLayer.wms('http://localhost:8080/geoserver/yaounde/wms',{layers: 'adresse_dla',format: 'image/png',transparent: true
    }).addTo(map);
//ajouter l'echelle
L.control.scale().addTo(map);

// Cette méthode est à insérer juste après avoir initialisé la carte
routingControl = L.Routing.control({
   // position: 'bottomleft',// Nous personnalisons le tracé
lineOptions: {
    styles: [{color: '#ff8f00',opacity: 1,weight: 7}]
},// Nous personnalisons la langue et le moyen de transport
router: new L.Routing.osrmv1({
    language: 'fr',profile: 'car',// car,bike,foot
}),geocoder: L.Control.Geocoder.nominatim()
}).addTo(map)

map.locate({setView: false,watch: true,maxZoom: 6});
   map.once('locationfound',function(ev){
routingControl.setWaypoints(ev.latlng);
//    marker = L.marker(ev.latlng);

});`

}

css

    #bandeau {
width:100%;
height:50px;
background-color:#222222;}

#titre {color: #FFFFFF; 
font-size: 20px;
font-weight: bold;
position: absolute;
left: 100px;
Top: 3%;
font-family: Georgia,"Times New Roman",Times,serif;}

#cadre{
    width: 100%;
    height: 710px;
    
    background-color: #252830;
}

#map{
    width: 100%;
    height: 100%;
}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascript openstreetmap qgis