Saya telah mengerjakan peta dua hari ini, sedikit kode JS, dan berbagai jebakan. Pertama kali saya bersentuhan dengan JS, ada semua jenis kesulitan. Mari kita ringkas penelitian dalam beberapa hari terakhir, dan minta trik.
Gunakan penutupan dalam pendengar acara
Saat mengeksekusi pendengar acara, seringkali diinginkan untuk melampirkan data pribadi dan persisten ke objek. JavaScript tidak mendukung data instance "pribadi", tetapi mendukung penutupan yang memungkinkan fungsi internal untuk mengakses variabel eksternal. Dalam acara pendengar, penutupan sangat ideal untuk mengakses variabel yang biasanya tidak melekat pada objek yang terjadi.
Contoh berikut menggunakan penutupan fungsi dalam pendengar acara untuk menetapkan pesan terenkripsi ke satu set tag. Mengklik pada setiap tag akan melihat sebagian dari pesan terenkripsi yang tidak termasuk dalam tag itu sendiri.
Salinan kode adalah sebagai berikut:
peta var;
fungsi initialize () {
var mylatlng = google.maps.latlng baru (-25.36382,131.044922);
var mapoptions = {
Zoom: 4,
Tengah: mylatlng,
maptypeId: google.maps.maptypeid.roadmap
}
peta = google.maps.map baru (document.getElementById ("map_canvas"), mapoptions);
// Tambahkan 5 penanda ke peta di lokasi acak.
var Southwest = google.maps.latlng baru (-31.203405,125.244141);
var Northeast = google.maps.latlng baru (-25.363882,131.044922);
var bounds = google.maps.latlngbounds baru (Southwest, Northeast);
peta.fitbounds (batas);
var lngspan = Northeast.lng () - Southwest.lng ();
var latspan = Northeast.lat () - Southwest.lat ();
untuk (var i = 0; i <5; i ++) {
var location = baru google.maps.latlng (southwest.lat () + latspan * math.random (),
Southwest.lng () + lngspan * math.random ());
var marker = google.maps.marker baru ({
Posisi: Lokasi,
Peta: Peta
});
var j = i + 1;
marker.settitle (j.tostring ());
lampiranSecRetMessage (Marker, I);
}
}
// Lima penanda menunjukkan pesan rahasia saat diklik
// Tapi pesan itu tidak ada dalam data instance marker.
fungsi lampiranSecRetMessage (marker, angka) {
var pesan = ["ini", "adalah", "", "rahasia", "pesan"];
var infowindow = google.maps.infowindow baru (
{Content: Message [Nomor],
Ukuran: google.maps.size baru (50,50)
});
google.maps.event.addlistener (marker, 'klik', function () {
infowindow.open (peta, penanda);
});
}
Kode ini disalin dari pejabat Google
Selanjutnya, saya ingin membaca informasi lintang dan bujur dan alamat dari database, tandai di peta google dan klik untuk menandainya agar muncul.
Untuk mengimplementasikan anotasi multi-poin, kode di atas dapat direferensikan
Salinan kode adalah sebagai berikut:
<type skrip = "Teks/JavaScript">
peta var;
window.onload = function load () {
var number = '< %= angka %>'; // Dapatkan nilai jumlah pubilc di latar belakang CS
var address = array baru ()
var weidu = array baru ();
var jingdu = array baru ();
var chepai = array baru ();
< % untuk (int i = 0; i <number; i ++) { %>
weidu.push ('<%= lan [i]%>'); // Dapatkan nilai garis lintang dan bujur dari latar belakang CS
jingdu.push ('<%= lon [i]%>');
address.push ('<%= addr [i]%>');
chepai.push ('< %= carnum [i] %>');
// var wei;
// wei = chepai ['<%= i%>'];
// waspada (wei);
< %} %>
var latlng = google.maps.latlng baru (weidu [0], jingdu [0]);
// var mylatlng = google.maps.latlng baru (25.273566, 110.290195);
var myoptions = {
Zoom: 8,
tengah: latlng,
maptypeId: google.maps.maptypeid.roadmap
};
peta = google.maps.map baru (document.geteLementById ("map_canvas"), myoptions); //// inisialisasi instance peta
untuk (var j = 0; j <angka; j ++) // Saya telah terjebak di sini untuk waktu yang lama, karena tipe JS hanya var; Saya telah membingungkan JS dan CS dan menggunakannya sampai " % %>. Faktanya, JS sederhana tidak membutuhkannya, itu hampir sama dengan C
{
var lat = weidu [j];
var lng = jingdu [j];
var address = alamat [j];
var chepaihao = chepai [j];
// peringatan (j);
// waspada (lat);
// var Image = 'Image/WebCam.png';
// atur titik bendera
var mylatlng = google.maps.latlng baru (weidu [j], jingdu [j]);
var h = chepaihao;
var tit = h.tostring ();
var marker = google.maps.marker baru ({
Posisi: mylatlng,
Peta: peta,
// Ikon: "http://google-maps-icons.googlecode.com/files/yellow08.png",
// Ikon: Image, // Melalui Ikon, Anda dapat mengatur ikon yang ingin Anda tampilkan. Jika Anda tidak mengaturnya, Anda akan menampilkan ikon default Google Map.
Judul: Judul // Judul berarti nilai yang akan ditampilkan pada penanda dengan meletakkan mouse pada penanda.
});
lampiranSecRetMessage (Marker, J, Addre, Lat, LNG);
}
}
fungsi lampiranSecRetMessage (penanda, angka, addre1, lat1, lng1) {
// var pesan = ["ini", "adalah", "", "rahasia", "pesan"];
var infowindow = google.maps.infowindow baru (
{Content: "<span style = 'font-size: 15px'> <b> alamat: </b>" + addre1 + "<br>" + "latitude and longitude:" + lat1 + "," + lng1 + "</span>",
Ukuran: google.maps.size baru (50, 50)
});
// infowindow.setContent ("alamat:" +addre1 +"bujur:" +lat1 +"lat:" +lng1);
// Klik untuk muncul jendela informasi
google.maps.event.addlistener (marker, 'klik', function () {
infowindow.open (peta, penanda);
});
}
</script>
Kode Backend CS:
Salinan kode adalah sebagai berikut:
menggunakan sistem;
menggunakan system.collections.generic;
menggunakan System.linq;
menggunakan System.web;
menggunakan system.web.ui;
menggunakan system.web.ui.webControls;
menggunakan system.web.ui.htmlControls;
menggunakan system.data.sqlclient;
Default kelas parsial publik2: System.web.ui.page
{
Publik ganda [] la = ganda baru [25];
Publik ganda [] ln = ganda baru [25];
Public int [] id = int int [25];
string publik [] addr = string baru [25];
nomor int publik;
Lindung void page_load (pengirim objek, EventArgs e)
{
String mycnnconnectionstring1 = system.configuration.configurationManager.connectionstrings ["testConect"]. ConnectionString; // Buat string koneksi
Sqlconnection mycnn1 = sqlconnection baru (mycnnconnectionstring1);
mycnn1.open ();
SqlCommand cmd1 = sqlCommand baru ("pilih l_id, l_lantitude, l_longitude, l_address dari LateSposition", mycnn1);
SqldataReader DR1 = cmd1.executereader ();
int k2 = 0;
int k3 = 0;
int k4 = 0;
int k1 = 0;
// string buf1 = "";
Double buf2 = 0;
Double BuF3 = 0;
int buf4 = 0;
string buf1 = "0";
While (dr1.read ())
{
// Lat
buf2 = (ganda) dr1 ["l_lantitude"];
la [k2] = buf2;
K2 ++;
// lng
buf3 = (ganda) dr1 ["l_longitude"]; /// Basis data perlu menggunakan Double untuk membaca data tipe float
ln [k3] = buf3;
K3 ++;
//pengenal
buf4 = (int) dr1 ["l_id"];
id [k4] = buf4;
K4 ++;
buf1 = dr1 ["l_address"]. ToString ();
addr [k1] = buf1;
K1 ++;
}
angka = k4;
dr1.close ();
mycnn1.close ();
}
}