我正在使用Google Maps API,我有一个疑问:我怎样才能看到一条街道只是一个城市?如果在特定城市找不到那条路,那么什么都不会发生......
我基本上有三个输入: a选择状态,另一个选择状态的城市,以及输入文本到街道
我的代码:
<div class="form-group">
<fieldset>
<label>Estado</label>
<select class="form-control" id="estado" name="estado">
<option id="padraoEstado">Selecione um estado</option>
<?php
$sql = "SELECT * FROM tb_estados";
$query = $conn->query($sql);
while($post = $query->fetch_assoc()){
?>
<option value="<?php echo $post['ID_state']; ?>"><?php echo $post['uf']; ?> </option>
<?php
}
?>
</select>
<script type="text/javascript">
$(document).ready(function(){
$("#estado").change(function(){
$("#endereçoEmpresa").val("");
$("#padraoEstado").remove();
var valorEstado = $('#estado option:selected').val();
$.ajax({
url: "carregarCidades.php",
type: "POST",
dataType: "html",
data:{
valorEstado: valorEstado
},
success: function(data){
$("#cidade").removeAttr("disabled");
$("#cidade").append().html(data);
var valorCidade = $('#cidade option:selected').text();
$("#mapCompany").show();
marker = null;
initialize();
codeAddress();
},
error: function(data){
alert(data)
}
});
});
});
</script>
<label>Cidade</label>
<select disabled class="form-control" id="cidade" name="cidade">
</select>
</fieldset>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#cidade").change(function(){
$("#endereçoEmpresa").val("");
codeAddress();
});
$("#endereçoEmpresa").change(function(){
codeAddress();
});
});
</script>
<div class="form-group">
<label >Endereço da Empresa</label>
<input type="text" id="endereçoEmpresa" name="endereçoEmpresa" class="form-control" />
</div>
<script type="text/javascript">
var geocoder;
var map;
var marker;
function initialize() {
função para iniciar o mapa
}
function codeAddress(){
var valorCidade = $('#cidade option:selected').text();
var valorEstado = $('#estado option:selected').text();
var valorEndereco = $("#endereçoEmpresa").val();
var address = valorEndereco + ", " + valorCidade + " - " + valorEstado;
geocoder.geocode( { 'address': address + ', Brasil', 'region': 'BR'}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
if(!marker){
marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
}else{
marker.setPosition(results[0].geometry.location);
}
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng()
$("#lat").val(latitude);
$("#lng").val(longitude);
}else{
alert("A API de mapas do Google não conseguiu achar esta localização por algum motivo: " + status);
}
});
}
</script>