உங்கள் வலைப்பக்கத்தில் Google Map ஐ எப்படி சேர்க்கலாம்

05 ல் 05

உங்கள் தளத்திற்கு Google Maps API விசை கிடைக்கும்

Google டெவெலப்பர்ஸ் கன்சோலின் கிளவுட் பார்வை. J Kyrnin இன் ஸ்கிரீன் ஷாட்

உங்கள் வலைத்தளத்திற்கு Google வரைபடத்தை சேர்க்க சிறந்த வழி Google Maps API ஐ பயன்படுத்த வேண்டும். வரைபடங்களைப் பயன்படுத்த நீங்கள் ஒரு API விசை கிடைக்கும் என்று Google பரிந்துரைக்கிறது.

நீங்கள் Google Maps API v3 ஐப் பயன்படுத்த ஒரு API விசை தேவையில்லை, ஆனால் அது உங்கள் பயன்பாட்டை கண்காணிக்கவும் கூடுதல் அணுகலுக்காக செலுத்தவும் உதவுவதால் மிகவும் பயனுள்ளதாக இருக்கிறது. Google Maps API v3 ஆனது, ஒரு நாளைக்கு ஒரு கோரிக்கைக்கு ஒரு கோரிக்கைக்கு அதிகபட்சமாக 25,000 கோரிக்கைகளுக்கு ஒரு கோரிக்கை உள்ளது. உங்கள் பக்கங்கள் அந்த வரம்பை மீறியிருந்தால், மேலும் பெறுவதற்காக பில்லிங் ஐ நீங்கள் இயக்க வேண்டும்.

Google Maps API விசை எவ்வாறு பெறுவது

  1. உங்கள் Google கணக்கைப் பயன்படுத்தி Google இல் உள்நுழைக.
  2. டெவலப்பர்கள் கன்சோலுக்கு செல்க
  3. பட்டியலை உருட்டு Google Maps API v3 ஐ கண்டுபிடி, அதன் மீது "OFF" பொத்தானை அழுத்தவும்.
  4. விதிமுறைகளைப் படித்து ஒப்புக்கொள்கிறேன்.
  5. API கன்சோலுக்கு சென்று இடதுபுற மெனுவிலிருந்து "API Access" என்பதைத் தேர்ந்தெடுக்கவும்
  6. "எளிய ஏபிஐ அணுகல்" பிரிவில், "புதிய சேவையக விசை ..." பொத்தானை சொடுக்கவும்.
  7. உங்கள் இணைய சேவையகத்தின் IP முகவரியை உள்ளிடவும். இது உங்கள் வரைபட கோரிக்கைகள் எங்கிருந்து வரும் IP ஆகும். உங்கள் ஐபி முகவரியை நீங்கள் தெரியாவிட்டால், அதை நீங்கள் பார்க்கலாம்.
  8. "API விசை:" வரியில் உள்ள உரை (அந்த தலைப்பு உட்பட) நகலெடுக்கவும். இது உங்கள் வரைபடங்களுக்கு உங்கள் API விசை.

02 இன் 05

ஒருங்கிணைப்புக்கு உங்கள் முகவரி மாற்றவும்

அட்சரேகை மற்றும் தீர்க்கரேகைக்கு குறிப்பிடப்பட்ட எண்களைப் பயன்படுத்தவும். J Kyrnin இன் ஸ்கிரீன் ஷாட்

உங்கள் வலைப்பக்கங்களில் Google Maps ஐப் பயன்படுத்த, நீங்கள் இருப்பிடத்திற்கான அட்சரேகை மற்றும் தீர்க்கரேகை வேண்டும். ஜி.பி.எஸ்ஸிலிருந்து இதைப் பெறலாம் அல்லது ஜியோக்கோட்டர் போன்ற ஒரு ஆன்லைன் கருவியைப் பயன்படுத்தலாம்.

  1. தேடல் பெட்டியில் உங்கள் முகவரியில் Geocoder.us சென்று, தட்டச்சு செய்யவும்.
  2. அட்சரேகைக்கு முதல் எண்ணை (முன் ஒரு கடிதம் இல்லாமல்) நகலெடுத்து அதை ஒரு உரை கோப்பில் ஒட்டவும். நீங்கள் பட்டம் (º) காட்டி தேவையில்லை.
  3. தீர்க்கரேகை முதல் எண்ணை நகலெடுக்கவும் (மீண்டும் ஒரு கடிதம் இல்லாமல்) மற்றும் உங்கள் உரை கோப்பில் ஒட்டவும்.

உங்கள் அட்சரேகை மற்றும் தீர்க்கரேகை இது போன்ற ஏதாவது இருக்கும்:

40.756076
-73,990838

வேறு நாடுகளில் உள்ள ஒருங்கிணைப்புகளைப் பெறுவதற்கு, Geocoder.us மட்டுமே அமெரிக்க முகவரிகளுக்கு மட்டுமே வேலை செய்கிறது, உங்கள் பிராந்தியத்தில் இதே கருவியைத் தேட வேண்டும்.

03 ல் 05

வரைபடம் உங்கள் வலை பக்கம் சேர்த்தல்

Google வரைபடம். ஜே Kyrnin மூலம் ஸ்கிரீன் ஷாட் - வரைபட படத்தை மரியாதை கூகிள்

முதலில், வரைபடம் ஸ்கிரிப்ட் சேர்க்கவும்

உங்கள் ஆவணத்தின்

உங்கள் வலைப்பக்கத்தை திறந்து, உங்கள் ஆவணத்தின் HEAD க்கு பின்வரும் முகவரியைச் சேர்க்கவும்.

உயர்த்திப் பிடித்த பகுதியை நீங்கள் படிப்படியாக எழுதிக் கொண்டிருக்கும் அட்சரேகை மற்றும் தீர்க்கரேகை எண்களுக்கு மாற்றவும்.

இரண்டாவதாக, வரைபட அங்கத்தை உங்கள் பக்கத்திற்கு சேர்க்கவும்

உங்கள் ஆவணத்தின் HEAD க்கு அனைத்து ஸ்கிரிப்ட் உறுப்புகள் சேர்க்கப்பட்டவுடன், நீங்கள் பக்கத்தில் உங்கள் வரைபடத்தை வைக்க வேண்டும். நீங்கள் ஒரு DIV ஐ சேர்த்து ID = "map-canvas" பண்புக்கூறுடன் இணைப்பதன் மூலம் இதை செய்யலாம். நான் உங்கள் பக்கத்தில் பொருந்தும் என்று அகலம் மற்றும் உயரம் நீங்கள் இந்த பாணி பாணி பரிந்துரை:

இறுதியாக, பதிவேற்றம் மற்றும் சோதனை

செய்ய வேண்டிய கடைசி விஷயம், உங்கள் பக்கத்தை பதிவேற்றும், உங்கள் வரைபடத்தை காட்சிப்படுத்துகிறது. பக்கத்தில் ஒரு கூகிள் மேப் ஒரு உதாரணம் இங்கே. குறிப்பு, ஏனெனில் ingatlannet.tk CMS வேலை, நீங்கள் வரைபடம் தோன்றும் பெற இணைப்பை கிளிக் செய்ய வேண்டும். இது உங்கள் பக்கத்தில் வழக்கு இருக்காது.

உங்கள் வரைபடம் காட்டப்படவில்லை எனில், அதை BODY பண்புடன் தொடங்கவும்:

onload = "துவக்க ()" >

உங்கள் வரைபடம் ஏற்றப்படவில்லை என்றால் சரிபார்க்க மற்ற விஷயங்கள் பின்வருமாறு:

04 இல் 05

உங்கள் வரைபடத்தில் ஒரு மார்க்கரைச் சேர்க்கவும்

மார்க்கருடன் Google வரைபடம். ஜே Kyrnin மூலம் ஸ்கிரீன் ஷாட் - வரைபட படத்தை மரியாதை கூகிள்

ஆனால் எங்கு செல்ல வேண்டும் என்று எந்த ஒரு குறிப்பான் சொல்லவில்லை என்றால் உங்கள் இருப்பிடத்தின் வரைபடம் என்ன?

ஒரு நிலையான Google வரைபடத்தை சிவப்பு மார்க்கரைச் சேர்க்க, பின்வரும் வரைபடத்தை கீழே உள்ள உங்கள் வரைபடத்திற்கு கீழே சேர்க்கவும் ... வரி:

var myLatlng = புதிய google.maps.LatLng ( அட்சரேகை, தீர்க்கரேகை );
var marker = புதிய google.maps.Marker ({
நிலை: myLatlng,
வரைபடம்: வரைபடம்,
தலைப்பு: " முன்னாள் kankertherapie.tk தலைமையகம் "
});

உயர்த்தப்பட்ட உரை உங்கள் அட்சரேகை மற்றும் தீர்க்கரேகை மற்றும் மார்க்கர் மீது மக்கள் பாயும் போது நீங்கள் தோன்ற விரும்பும் தலைப்புக்கு மாற்றவும்.

நீங்கள் விரும்பியபடி பக்கத்திற்கு பல குறிப்பான்களை சேர்க்கலாம், புதிய மாறிகள் மற்றும் தலைப்புகளுடன் புதிய மாறிகள் சேர்க்கலாம், ஆனால் வரைபடமானது அனைத்து குறிப்பான்களையும் காட்ட மிகச் சிறியதாக இருந்தால், வாசகர் பெரிதாக்கப்படாத வரை அவை காண்பிக்கப்படாது.

var latlng 2 = புதிய google.maps.LatLng ( 37.3316591, -122.0301778 );
var myMarker 2 = புதிய google.maps.Marker ({
நிலை: latlng 2 ,
வரைபடம்: வரைபடம்,
தலைப்பு: " ஆப்பிள் கம்ப்யூட்டர் "
});

ஒரு மார்க்கருடன் Google வரைபடத்தின் உதாரணம் இங்கே. குறிப்பு, ஏனெனில் ingatlannet.tk CMS வேலை, நீங்கள் வரைபடம் தோன்றும் ஒரு இணைப்பை கிளிக் செய்ய வேண்டும். இது உங்கள் பக்கத்தில் வழக்கு இருக்காது.

05 05

உங்கள் பக்கத்திற்கு இரண்டாவது (அல்லது அதற்கு மேற்பட்ட) வரைபடத்தைச் சேர்க்கவும்

என் உதாரணத்தை Google வரைபடப் பக்கத்தைப் பார்த்தால், பக்கத்தில் உள்ள மேலுள்ள ஒரு வரைபடத்தை நான் வைத்திருப்பேன். இது மிகவும் எளிதானது. இங்கே எப்படி இருக்கிறது.

  1. இந்த டுடோரியலின் படி 2 இல் நாம் கற்றுக் கொள்ள விரும்பும் அனைத்து வரைபடங்களின் அட்சரேகை மற்றும் தீர்க்கரேகைகளைப் பெறவும்.
  2. இந்த டுடோரியின் படி 3 இல் நாம் கற்றுக்கொண்ட முதல் வரைபடத்தை செருகவும். வரைபடத்தை மார்க்கர் வைத்திருந்தால், மார்க்கரை படி 4 இல் சேர்க்கவும்.
  3. இரண்டாவது வரைபடத்திற்கு, நீங்கள் துவக்க () ஸ்கிரிப்ட்டில் 3 புதிய வரிகளை சேர்க்க வேண்டும்:
    var latlng2 = புதிய google.maps.LatLng ( இரண்டாவது ஒருங்கிணைப்பு );
    var myOptions2 = {zoom: 18, சென்டர்: latlng2, mapTypeId: google.maps.MapTypeId.ROADMAP};
    var map2 = புதிய google.maps.Map (document.getElementById ("map_canvas_2"), myOptions2);
  4. புதிய வரைபடத்தில் ஒரு மார்க்கர் வேண்டுமென்றால், இரண்டாவது ஆயர் சுட்டிக்காட்டும் இரண்டாவது ஒருங்கிணைப்பு மற்றும் இரண்டாவது வரைபடம்:
    var myMarker2 = புதிய google.maps.Marker ({position: latlng2 , வரைபடம்: map2 , தலைப்பு: " உங்கள் குறிப்பான் தலைப்பு "});
  5. பின்னர் இரண்டாவது சேர்

    இரண்டாவது வரைபடத்தை நீங்கள் விரும்பலாம். அது ஒரு id = "map_canvas_2" ஐடியை கொடுக்க வேண்டும்.

  6. உங்கள் பக்கம் ஏற்றும்போது, ​​இரண்டு வரைபடங்கள் காண்பிக்கும்

இங்கு இரண்டு கூகுள் வரைபடங்கள் உள்ள பக்கத்தின் குறியீடு இது: