Hello, I have issue with google maps api. I need to fix the error in the website where the google map should be there beside the criteria search but it did not appear. I don't what wrong whether the code or the api. You can see the error at the website:https://pmspk.moe.gov.my/directory/ . Below is the code:
<!DOCTYPE html>
<!--[if lt IE 9]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.0.min.js"></script>
<script src="https://maps.google.com/maps/api/js?key=AIzaSyBJdW-MjFSmTRwAMv8l2_fQT-LxRiepR6s&libraries=geometry&?1343675510"></script>
<script type="text/javascript" src="js/maplace.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.9.1/themes/smoothness/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.9.1/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {
var maplace = new Maplace({
map_div: '#gmap-mixed',
controls_div: '#searchSekolah',
controls_type: 'dropdown',
controls_on_map: true
});
function showGroupNew(i,j) {
$.getJSON('data/ajax.php', { view:i, type: j }, function(data) {
if(data.title == 'No entries found'){
alert('no entries found');
maplace.Load({
locations: [
{
lat: '3.463926',
lon: '107.528700',
zoom: 6,
}],
show_markers: false,
view_all: false,
map_options: {
zoom: 1
}
});
} else {
maplace.Load({
locations: data.points,
view_all_text: data.title,
show_markers: true,
type: data.type,
force_generate_controls: true,
map_options: {
zoom: 6
}
});
}
});
}
function showOne(index) {
$.getJSON('data/search.php', { namasekolah:index }, function(data) {
maplace.Load({
locations: data.points,
view_all_text: data.title,
type: data.type,
force_generate_controls: true,
map_options: {
zoom: 12
}
});
});
}
showGroupNew('2', 'WP PUTRAJAYA');
var availableTags = <?echo json_encode($data)?>;
$( "#searchSekolah" ).submit(function( event ) {
showGroupNew($( "#controls" ).val(), $( "#negeri" ).val());
event.preventDefault();
});
$( "#searchSekolah2" ).submit(function( event ) {
showOne($( "#institutionName" ).val());
event.preventDefault();
});
$( "#institutionName" ).autocomplete({
source: availableTags
});
});
</script>
<style>
.gmap-mixed{width: 100%; height: 490px;}
.gmap_controls{visibility: hidden;}
table{border:0; width: 100%; margin: 0; padding: 0}
body{padding: 0; margin: 0}
.searcharea{padding:10px;}
.ui-autocomplete-loading {
background: white url('images/ui-anim_basic_16x16.gif') right center no-repeat;
}
</style>
<?
if($_GET["lang"]==""){
$jenisInstitusi = "Jenis Institusi";
$preschool = "Pra Sekolah";
$primaryschool = "Sekolah Rendah";
$secondaryschool = "Sekolah Menengah";
$negeri = "Negeri";
$search = "Cari";
$or = "Atau";
$institutionname = "Nama Institusi";
} else {
$jenisInstitusi = "Institution Type";
$preschool = "Preschool";
$primaryschool = "Primary School";
$secondaryschool = "Secondary School";
$negeri = "State";
$search = "Search";
$or = "Or";
$institutionname = "Institution Name";
}
?>
</head>
<body>
<table cellspacing="0" cellpadding="0">
<tr><td width="25%" valign="top" class="searcharea">
<form id="searchSekolah">
<? echo $jenisInstitusi?>:<br />
<select id="controls">
<option value="1"><? echo $preschool?></option>
<option value="2"><? echo $primaryschool?></option>
<option value="3"><? echo $secondaryschool?></option>
</select>
<br /><br />
<? echo $negeri?>:<br />
<select id="negeri">
<option value="KELANTAN">Kelantan</option>
<option value="SABAH">Sabah</option>
<option value="WP KUALA LUMPUR">Wilayah Persekutuan (Kuala Lumpur)</option>
<option value="PERLIS">Perlis</option>
<option value="SARAWAK">Sarawak</option>
<option value="MELAKA">Melaka</option>
<option value="Terengganu">Terengganu</option>
<option value="SELANGOR">Selangor</option>
<option value="KEDAH">Kedah</option>
<option value="PAHANG">Pahang</option>
<option value="PERAK">Perak</option>
<option value="WP PUTRAJAYA">Wilayah Persekutuan (Putrajaya)</option>
<option value="PULAU PINANG">Pulau Pinang</option>
<option value="NEGERI SEMBILAN">Negeri Sembilan</option>
<option value="JOHOR">Johor</option>
<option value="PULAU PINANG">Pulau Pinang</option>
</select>
<br />
<input type="submit" value="<? echo $search?>" />
</form>
<br />
<? echo $or?>,
<br /><br />
<form id="searchSekolah2">
<? echo $institutionname?> :<br />
<input id="institutionName">
<input type="submit" value="<? echo $search?>" />
</form>
</td>
<td><div class="gmap-mixed" id="gmap-mixed"></div></td></tr>
</table>
</body>
</html>
What I have tried:
- I have update the google maps api version