Gaukite savo svetainės "Google" žemėlapių API raktą
Geriausias būdas pridėti "Google" žemėlapį į jūsų svetainę yra "Google Maps API" naudojimas. "Google" rekomenduoja gauti API raktą, kad galėtumėte naudoti žemėlapius.
Jums nereikia gauti API raktą, kad galėtumėte naudoti "Google Maps API v3", tačiau tai labai naudinga, nes galite stebėti savo naudojimą ir mokėti už papildomą prieigą. "Google" žemėlapių API v3 yra 1 užklausos kiekvienam vartotojui kvota, kurią maksimaliai galima gauti 25 000 užklausų per dieną. Jei jūsų puslapiai viršija tas ribas, jums reikės įgalinti atsiskaitymą, kad gautumėte daugiau.
Kaip gauti "Google" žemėlapių API raktą
- Prisijunkite prie "Google" naudodami "Google" paskyrą.
- Eikite į "Developers Console"
- Peržiūrėkite sąrašą ir raskite "Google Maps API v3", tada spustelėkite mygtuką "IŠJUNGTA", kad jį įjungtumėte.
- Perskaitykite ir sutinkate su sąlygomis.
- Eikite į API konsolę ir kairiajame meniu pasirinkite "API prieiga"
- Skiltyje "Paprasta API prieiga" spustelėkite mygtuką "Sukurti naują serverio raktą …".
- Įveskite savo interneto serverio IP adresą. Tai yra IP, kuriame bus pateikti jūsų "Maps" užklausos. Jei nežinote savo IP adreso, galite ieškoti jo.
- Nukopijuokite tekstą eilutėje "API raktas:" (be šio pavadinimo). Tai jūsų žemėlapių API raktas.
Konvertuokite savo adresą į koordinates
Kad galėtumėte naudoti "Google" žemėlapius savo tinklalapiuose, turite nurodyti platumą ir ilgumą. Galite juos gauti iš GPS arba galite papasakoti jums tokį internetinį įrankį kaip "Geocoder.us".
- Eikite į "Geocoder.us" ir įveskite savo adresą paieškos laukelyje.
- Nukopijuokite pirmąjį platumos numerį (be priekinės raidės) ir įklijuokite jį į teksto failą. Jums nereikia laipsnio (º) indikatoriaus.
- Nukopijuokite pirmąjį ilgumą (dar kartą be priekinės raidės) ir įklijuokite jį į savo tekstinį failą.
Jūsų platuma ir ilguma atrodys šiek tiek:
40.756076-73.990838
"Geocoder.us" veikia tik JAV adresus, jei jums reikia gauti koordinates kitoje šalyje, turėtumėte ieškoti panašaus įrankio savo regione.
03 iš 05Žemėlapio pridėjimas jūsų tinklalapyje
Pirma, pridėkite žemėlapio scenarijų į
jūsų dokumento
Atidarykite savo tinklalapį ir pridėkite prie GALVA savo dokumento.
Pakeiskite paryškintą dalį į platumos ir ilgumos numerius, kuriuos įrašėte antroje žingsnyje.
Antra, pridėkite žemėlapio elementą į savo puslapį
Kai visi scenarijaus elementai bus įtraukti į GALVA savo dokumento, turite nustatyti savo žemėlapio vietą puslapyje. Tai darote pridėdami DIV elementas su id = "map-canvas" atributas. Aš rekomenduoju jums taip pat stiliaus šio div su pločio ir aukščio, kuris tinka jūsų puslapyje:
Galiausiai įkėlimas ir bandymas
Paskutinis dalykas, kurį reikia padaryti, yra įkelti savo puslapį ir patikrinti, ar žemėlapyje rodomas jūsų žemėlapis. Čia yra "Google" žemėlapio pavyzdys puslapyje. Atkreipkite dėmesį, kad, atsižvelgiant į būdą, kaip veikia system.info "CMS", turėsite spustelėti nuorodą, kad žemėlapyje būtų rodomas. Tai nebus jūsų puslapyje.
Jei jūsų žemėlapis nerodomas, pabandykite inicijuoti jį su KŪNAS atributas:
onload = "inicijuoti ()" >
Kiti dalykai, kuriuos reikia patikrinti, ar jūsų žemėlapis nėra įkeltas, yra šie:
- Ieškokite klaidų jūsų "JavaScript", įskaitant atvejį. "JavaScript" yra registruotas.
- Įsitikinkite, kad turite
priartintiircentrasparinkčių rinkinys. - Įsitikinkite, kad esate
DIVelementas yra puslapyje, kuriame yra teisingas ID. - Įsitikinkite, kad esate
DIVelementas turi aukštį.
Pridėkite žymeklį prie savo žemėlapio
Bet koks geras yra jūsų vietovės žemėlapis, jei nėra ženklo, kuriame žmonės sako, kur jie turėtų eiti?
Norėdami pridėti standartinį "Google" žemėlapių raudoną žymeklį, pridėkite žemiau esantį scenarijų var map = … linija:
var myLatlng = naujas google.maps.LatLng ( platuma, ilguma );var marker = naujas google.maps.Marker ({pozicija: myLatlng,žemėlapis: žemėlapispavadinimas: " Anksčiau-shop.info būstinė '});
Pažymėtą tekstą pakeiskite į platumą ir ilgumą bei pavadinimą, kurį norėtumėte parodyti, kai žmonės rodomi virš žymeklio.
Galite įtraukti į svetainę kiek įmanoma daugiau žymeklių, tiesiog pridėti naujus kintamuosius su naujais koordinatėmis ir pavadinimais, tačiau jei žemėlapis yra per mažas, kad būtų rodomi visi žymekliai, jie nebus rodomi, nebent skaitytojas išmoksta.
var latlng 2 = naujas google.maps.LatLng ( 37.3316591,-122.0301778 );var myMarker 2 = naujas google.maps.Marker ({pozicija: latlng 2 ,žemėlapis: žemėlapispavadinimas: " "Apple Computer" '});
Čia yra "Google" žemėlapio su žymekliu pavyzdys. Atkreipkite dėmesį, kad dėl to, kaip "cheatgamers.lt" veikia, jums reikia spustelėti nuorodą, kad žemėlapyje būtų rodomas. Tai nebus jūsų puslapyje.
05 iš 05Įtraukite antrą (ar daugiau) žemėlapį į savo puslapį
Jei pažvelgėte į mano pavyzdį "Google" žemėlapių puslapyje, pastebėsite, kad puslapyje yra daugiau nei vienas žemėlapis. Tai labai lengva padaryti. Štai kaip.
- Gaukite visų žemėlapių, kuriuos norite rodyti, platumą ir ilgumą, kaip mes sužinojome šio vadovo 2 veiksme.
- Įtraukite pirmąjį žemėlapį, kaip sužinojome šio vadovo 3 žingsnyje. Jei norite, kad žemėlapyje būtų žymeklis, pridėkite žymeklį, kaip nurodyta 4 veiksme.
- Antrojo žemėlapio atveju jums reikės pridėti 3 naujas eilutes į scenarijų inicijuoti ():
var latlng2 = naujas google.maps.LatLng ( antrosios koordinatės );var myOptions2 = {padidinti: 18, center: latlng2, mapTypeId: google.maps.MapTypeId.ROADMAP};var map2 = naujas google.maps.Map (document.getElementById ("map_canvas_2"), myOptions2); - Jei norite, kad ant naujojo žemėlapio būtų žymeklis, pridėkite antrą žymeklį ant antraeilių koordinačių ir antrojo žemėlapio:
var myMarker2 = naujas google.maps.Marker ({pozicija: latlng2 , žemėlapis: map2 , pavadinimas: " Jūsų žymeklio antraštė ' }); - Tada pridėkite antrą vietą, kurioje norite antrą žemėlapį. Ir įsitikinkite, kad tai duos
id = "map_canvas_2"ID - Kai jūsų puslapis įkeltas, bus rodomi du žemėlapiai
Čia yra puslapio, kuriame yra du "Google" žemėlapiai, kodas:
