Ugrás a fő tartalomra

Fénykép és térkép funkciók összevonása

Nagyítás, kicsinyítés, kis képen mozgás követés, háttérre helyezés pozícióba állítás funkciók megvalósítása pl. gmap api segítségével.


Hogyan is néz ki ez forráskód szinten:


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<style type="text/css">
html, body { 
width:100%;
height:100%;
padding: 0;
margin: 0;
background: white;
 } 
#map {
width: 100%; 
height: 98%; 
padding: 0;
margin: 0;
}
</style>
<!-- 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
-->
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script>
function init() {
var newark = new google.maps.LatLng (47.4273,19.20882);
var imageBounds = new google.maps.LatLngBounds(
new google.maps.LatLng (47.42386,19.20129), // bal - also sarok (képnek)
new google.maps.LatLng (47.42967,19.2194)); // jobb - felső (képnek)
var myOptions = {
zoom: 15,
center: newark,
 disableDoubleClickZoom: true,
 panControl: false,
 zoomControl: true,
 overviewMapControl: true, // kis ablak 
 overviewMapControlOptions:{opened:true}, // kis ablak jelenlen meg alapból 
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map=new google.maps.Map(document.getElementById("map"),myOptions);
var oldmap = new google.maps.GroundOverlay(
//"mentes.jpg",
"http://mierdekel.hu/h1z1map/tiles/map/3/3/2.png",
imageBounds);
oldmap.setMap(map);
}
</script>
</head>
 <body onload="init()">
 <div id="map"></div>
</body>
</html>



Hol jár az adott tömegközlekedési járat, hogyan csatlakozik a másokhoz? Hogyan jutok haza, milyen átszállásokkal? Vagy ha nincs kérdés akkor csak gyönyörködjünk a felgyorsított Budapesti tömegközlekedés hangya járatainak kavalkádjában.



Mindez a menetrend a megállok GPS pozíciója alapján képzett adatbázisból.








Adat forgalmi minták (kérés, válasz):






http://backend1.tracker.geops.de/trajectories?swy=2127755.6258510347&swx=6016855.100798625&ney=2153554.013636622&nex=6022223.91129198&orx=2127765.6258510347&ory=6022233.91129198&btime=19:46:44.0&etime=19:48:24.0&date=20150917&z=13&rid=1&cb=jQuery111202493103346787393_1442519205937&_=1442519205939



=>


jQuery111202493103346787393_1442519205937(
{"rid":"1","a":[{"i":1582976,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B342813195","n":"46","p":[[{"x":744.04,"y":174.78,"a":1442519204,"d":0},{"x":754.71,"y":178.92},{"x":754.71,"y":179.18,"a":1442519220,"d":0,"dot":0,"put":0},{"x":766.43,"y":180.91},{"x":774.55,"y":182.74,"a":1442519304,"d":0}]]},
{"i":1590277,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B342876832","n":"162","p":[[{"x":106.44,"y":23.03,"a":1442519204,"d":0},{"x":101.26,"y":30.72,"a":1442519220,"d":0,"dot":0,"put":0},{"x":99.48,"y":43.12},{"x":94.98,"y":52.28,"a":1442519280,"d":0,"dot":0,"put":0},{"x":88.54,"y":54.63,"a":1442519304,"d":0}]]},
{"i":1590845,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B342878215","n":"162","p":[[{"x":764.76,"y":59.60,"a":1442519204,"d":0},{"x":756.49,"y":56.73,"a":1442519220,"d":0,"dot":0,"put":0},{"x":731.01,"y":49.19},{"x":727.24,"y":47.62,"a":1442519280,"d":0,"dot":0,"put":0},{"x":715.31,"y":44.80,"a":1442519304,"d":0}]]},
{"i":1596539,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B34296665","n":"276","p":[[{"x":757.96,"y":0.52,"a":1442519217,"d":0},{"x":757.38,"y":2.56,"a":1442519220,"d":0,"dot":0,"put":0},{"x":766.49,"y":8.06},{"x":787.52,"y":12.66},{"x":788.68,"y":13.19,"a":1442519280,"d":0,"dot":0,"put":0},{"x":798.57,"y":14.65,"a":1442519304,"d":0}]]},
{"i":1612138,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B343097140","n":"95","p":[[{"x":370.40,"y":233.60,"a":1442519204,"d":0},{"x":372.86,"y":214.45},{"x":373.33,"y":213.98,"a":1442519220,"d":0,"dot":0,"put":0},{"x":374.64,"y":201.05},{"x":376.52,"y":188.50},{"x":377.04,"y":188.18,"a":1442519280,"d":0,"dot":0,"put":0},{"x":375.42,"y":165.16},{"x":375.42,"y":164.48,"a":1442519304,"d":0}]]},
{"i":1612145,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B343097142","n":"95","p":[[{"x":48.72,"y":0.52,"a":1442519271,"d":0},{"x":54.11,"y":11.57,"a":1442519304,"d":0}]]},
{"i":1637124,"t":3,"c":"009FE3","d":"FFFFFF","gid":"B343382788","n":"148","p":[[{"x":199.80,"y":228.37,"a":1442519280,"d":0,"t":1,"dot":0,"put":0},{"x":201.94,"y":240.35,"a":1442519304,"d":0}]]},


http://backend1.tracker.geops.de/trajectory?swy=2127765.6258510347&swx=6016845.100798625&ney=2153544.013636622&nex=6022233.91129198&orx=2127765.6258510347&ory=6022233.91129198&id=1250806&z=13&cb=jQuery111202493103346787393_1442519205937&_=1442519205941

=>

jQuery111202493103346787393_1442519205937({
"i":1250806,
"t":3,
"c":"009FE3",
"d":"FFFFFF",
"gid":"B33538496",
"n":"202E",
"p":[[{
"x":203.30,
"y":222.04,
"a":78360,
"d":78360,
"ad":0,
"dd":0,
"n":"Kőbánya-Kispest M",
"t":1,
"dot":0,
"put":0,
"sid":"038690"
},{
"x":197.18,
"y":220.52
},{
"x":190.59,
"y":218.48
},{
"x":190.54,
"y":221.20
},{
"x":201.47,"y":224.55},{"x":204.19,"y":225.39},{"x":206.92,"y":226.28},{"x":209.69,"y":224.55},{"x":213.40,"y":225.65},{"x":215.29,"y":227.74},{"x":212.20,"y":232.30},{"x":209.06,"y":233.24},{"x":210.06,"y":227.90},{"x":213.14,"y":222.09},{"x":226.64,"y":199.17},{"x":228.48,"y":196.08},{"x":230.57,"y":192.52},{"x":233.03,"y":191.37},{"x":250.25,"y":200.22},{"x":258.04,"y":204.56},{"x":270.86,"y":211.78},{"x":277.25,"y":207.49},{"x":282.06,"y":204.09},{"x":294.20,"y":195.61},{"x":297.13,"y":193.83},{"x":297.13,"y":193.83,"a":78540,"d":78540,"ad":0,"dd":0,"n":"Bányató utca","dot":0,"put":0,"sid":"040612"},{"x":302.63,"y":189.70},{"x":316.02,"y":180.70},{"x":327.33,"y":172.90},{"x":337.22,"y":165.99},{"x":341.88,"y":162.38},{"x":351.14,"y":156.21},{"x":369.72,"y":140.77},{"x":373.17,"y":138.21},{"x":373.54,"y":132.34},{"x":374.01,"y":132.03,"a":78660,"d":78660,"ad":0,"dd":0,"n":"Új köztemető","dot":0,"put":0,"sid":"008156"},{"x":372.07,"y":100.16},{"x":371.29,"y":82.89},{"x":369.93,"y":62.74},{"x":373.27,"y":47.93},{"x":381.39,"y":14.02},{"x":384.94,"y":14.70},{"x":391.28,"y":15.65},{"x":396.04,"y":15.70},{"x":410.38,"y":17.48},{"x":437.07,"y":21.04},{"x":440.57,"y":22.08},{"x":446.90,"y":23.08},{"x":450.67,"y":23.81},{"x":454.81,"y":24.18},{"x":459.04,"y":24.18},{"x":461.66,"y":23.97},{"x":465.53,"y":23.18},{"x":469.72,"y":22.14},{"x":473.75,"y":21.51},{"x":480.55,"y":21.35},{"x":486.62,"y":21.66},{"x":490.76,"y":21.61},{"x":493.90,"y":21.61},{"x":502.32,"y":21.72},{"x":509.81,"y":22.14},{"x":514.10,"y":22.35},{"x":517.86,"y":22.50},{"x":522.99,"y":22.76},{"x":522.99,"y":23.23,"a":79020,"d":79020,"ad":0,"dd":0,"n":"Rézvirág utca","dot":0,"put":0,"sid":"F01847"},{"x":525.77,"y":22.87},{"x":534.98,"y":23.65},{"x":544.71,"y":24.07},{"x":553.40,"y":24.70},{"x":561.61,"y":25.33},{"x":570.14,"y":25.80},{"x":597.09,"y":27.42},{"x":601.49,"y":27.68},{"x":601.49,"y":28.10,"a":79140,"d":79140,"ad":0,"dd":0,"n":"501. utca","dot":0,"put":0,"sid":"F01722"},{"x":615.88,"y":28.47},{"x":623.15,"y":28.89},{"x":628.86,"y":29.83},{"x":635.71,"y":30.93},{"x":640.42,"y":32.03},{"x":646.49,"y":33.33},{"x":651.10,"y":34.28},{"x":651.05,"y":34.75,"a":79200,"d":79200,"ad":0,"dd":0,"n":"509. utca","dot":0,"put":0,"sid":"F03549"},{"x":655.81,"y":35.27},{"x":666.95,"y":37.63},{"x":673.91,"y":37.84},{"x":676.69,"y":37.84},{"x":676.69,"y":38.36,"a":79260,"d":79260,"ad":0,"dd":0,"n":"513. utca","dot":0,"put":0,"sid":"009543"},{"x":679.57,"y":37.94},{"x":684.28,"y":38.46},{"x":687.99,"y":39.04},{"x":694.48,"y":39.98},{"x":697.88,"y":40.50},{"x":697.78,"y":40.97,"n":"Borsó utca","dot":0,"put":0,"sid":"F03547"},{"x":701.02,"y":40.97},{"x":708.30,"y":42.86},{"x":713.79,"y":44.38},{"x":721.27,"y":46.47},{"x":724.10,"y":47.25},{"x":723.99,"y":47.78,"a":79320,"d":79320,"ad":0,"dd":0,"n":"Kis utca","dot":0,"put":0,"sid":"F03545"},{"x":731.01,"y":49.19},{"x":748.07,"y":54.74},{"x":754.56,"y":56.62},{"x":754.40,"y":57.15,"a":79380,"d":79380,"ad":0,"dd":0,"n":"Bakancsos utca","dot":0,"put":0,"sid":"F03542"},{"x":764.76,"y":59.60},{"x":774.34,"y":62.27},{"x":782.19,"y":64.37},{"x":797.05,"y":69.39},{"x":796.89,"y":69.86,"a":79500,"d":79500,"ad":0,"dd":0,"n":"Szent kereszt tér","dot":0,"put":0,"sid":"F03593"},{"x":809.03,"y":73.42},{"x":814.27,"y":75.46},{"x":824.36,"y":78.97},{"x":824.00,"y":79.70,"a":79560,"d":79560,"ad":0,"dd":0,"n":"Rákoskeresztúr, városközpont","dot":0,"put":0,"sid":"011723"},{"x":828.87,"y":80.48},{"x":837.19,"y":82.73},{"x":844.20,"y":85.40},{"x":849.01,"y":87.03},{"x":853.20,"y":89.38},{"x":857.44,"y":92.42},{"x":864.50,"y":96.39},{"x":867.38,"y":97.86},{"x":870.68,"y":99.74},{"x":870.47,"y":100.11,"a":79620,"d":79620,"ad":0,"dd":0,"n":"Mezőtárkány utca","dot":0,"put":0,"sid":"F03515"},{"x":877.17,"y":103.30},{"x":882.82,"y":106.49},{"x":885.75,"y":108.27},{"x":891.19,"y":112.35},{"x":896.84,"y":116.49},{"x":899.56,"y":118.27},{"x":909.72,"y":122.56},{"x":909.56,"y":122.92,"a":79680,"d":79680,"ad":0,"dd":0,"n":"Oroszvár utca","dot":0,"put":0,"sid":"F03513"},{"x":912.28,"y":123.55},{"x":927.35,"y":129.83},{"x":930.60,"y":131.25},{"x":930.33,"y":131.61,"a":79740,"d":79740,"ad":0,"dd":0,"n":"Sági utca","dot":0,"put":0,"sid":"F03438"},{"x":933.53,"y":132.61},{"x":941.01,"y":135.64},{"x":943.78,"y":136.84},{"x":948.55,"y":138.89},{"x":954.72,"y":141.50},{"x":960.74,"y":144.38},{"x":962.36,"y":145.01,"n":"Tápióbicske utca","dot":0,"put":0,"sid":"F03511"},{"x":966.08,"y":146.05},{"x":973.82,"y":147.78},{"x":984.44,"y":149.51},{"x":986.85,"y":150.29,"a":79800,"d":79800,"ad":0,"dd":0,"n":"Kisvárda utca","dot":0,"put":0,"sid":"043193"},{"x":996.22,"y":150.40},{"x":1003.81,"y":150.87},{"x":1003.75,"y":151.34,"n":"Szabadság sugárút","dot":0,"put":0,"sid":"F03509"},{"x":1009.35,"y":151.60},{"x":1016.52,"y":154.74},{"x":1032.17,"y":161.96},{"x":1039.39,"y":165.36},{"x":1042.53,"y":166.83},{"x":1048.08,"y":169.55},{"x":1049.18,"y":170.34,"a":79920,"d":79920,"ad":0,"dd":0,"n":"Kucorgó tér","t":2,"dot":0,"put":0,"sid":"F03498"}]]})






http://backend1.tracker.geops.de/trajstations?id=1250806&time=19:49:2.3590&date=20150917&cb=jQuery111202493103346787393_1442519205942&_=1442519205943



=>


jQuery111202493103346787393_1442519205942({
"id":1250806,
"t":3,
"wa":1,
"ba":2,
"c":"009FE3",
"tc":"FFFFFF",
"hs":"Kucorgó tér",
"sn":"202E",
"ln":"",
"tt":{"t":15,
"n":[{"m":10,"d":22,"y":115}],
"p":[]},
"sts":[{"p":[19.14893775,47.46307507],
"at":"783600000",
"dt":"783600000",
"ap":"1442519160",
"dp":"1442519160",
"ad":"0",
"dd":"0",
"sid":"038690",
"dot":0,
"put":0,
"n":"Kőbánya-Kispest M","wa":1},
{"p":[19.16504455,47.46634842],"at":"785400000","dt":"785400000","ap":"1442519340","dp":"1442519340","ad":"0","dd":"0","sid":"040612","dot":0,"put":0,"n":"Bányató utca","wa":2},{"p":[19.1782408,47.47351993],"at":"786600000","dt":"786600000","ap":"1442519460","dp":"1442519460","ad":"0","dd":"0","sid":"008156","dot":0,"put":0,"n":"Új köztemető","wa":2},{"p":[19.20381583,47.48614208],"at":"790200000","dt":"790200000","ap":"1442519820","dp":"1442519820","ad":"0","dd":"0","sid":"F01847","dot":0,"put":0,"n":"Rézvirág utca","wa":2},{"p":[19.21729056,47.48557752],"at":"791400000","dt":"791400000","ap":"1442519940","dp":"1442519940","ad":"0","dd":"0","sid":"F01722","dot":0,"put":0,"n":"501. utca","wa":2},{"p":[19.22579761,47.48480655],"at":"792000000","dt":"792000000","ap":"1442520000","dp":"1442520000","ad":"0","dd":"0","sid":"F03549","dot":0,"put":0,"n":"509. utca","wa":2},{"p":[19.23019935,47.48438767],"at":"792600000","dt":"792600000","ap":"1442520060","dp":"1442520060","ad":"0","dd":"0","sid":"009543","dot":0,"put":0,"n":"513. utca","wa":2},{"p":[19.23381957,47.48408413],"at":"792600000","dt":"792600000","ap":"1442520060","dp":"1442520060","ad":"0","dd":"0","sid":"F03547","dot":0,"put":0,"n":"Borsó utca","wa":2},{"p":[19.23832012,47.48329492],"at":"793200000","dt":"793200000","ap":"1442520120","dp":"1442520120","ad":"0","dd":"0","sid":"F03545","dot":0,"put":0,"n":"Kis utca","wa":2},{"p":[19.24353934,47.48220823],"at":"793800000","dt":"793800000","ap":"1442520180","dp":"1442520180","ad":"0","dd":"0","sid":"F03542","dot":0,"put":0,"n":"Bakancsos utca","wa":2},{"p":[19.25083366,47.48073296],"at":"795000000","dt":"795000000","ap":"1442520300","dp":"1442520300","ad":"0","dd":"0","sid":"F03593","dot":0,"put":0,"n":"Szent kereszt tér","wa":2},{"p":[19.25548693,47.47959157],"at":"795600000","dt":"795600000","ap":"1442520360","dp":"1442520360","ad":"0","dd":"0","sid":"011723","dot":0,"put":0,"n":"Rákoskeresztúr, városközpont","wa":2},{"p":[19.26346397,47.47722371],"at":"796200000","dt":"796200000","ap":"1442520420","dp":"1442520420","ad":"0","dd":"0","sid":"F03515","dot":0,"put":0,"n":"Mezőtárkány utca","wa":2},{"p":[19.27017438,47.47457644],"at":"796800000","dt":"796800000","ap":"1442520480","dp":"1442520480","ad":"0","dd":"0","sid":"F03513","dot":0,"put":0,"n":"Oroszvár utca","wa":2},{"p":[19.2737407,47.4735685],"at":"797400000","dt":"797400000","ap":"1442520540","dp":"1442520540","ad":"0","dd":"0","sid":"F03438","dot":0,"put":0,"n":"Sági utca","wa":2},{"p":[19.27923839,47.47201405],"at":"797400000","dt":"797400000","ap":"1442520540","dp":"1442520540","ad":"0","dd":"0","sid":"F03511","dot":0,"put":0,"n":"Tápióbicske utca","wa":2},{"p":[19.2834425,47.47140076],"at":"798000000","dt":"798000000","ap":"1442520600","dp":"1442520600","ad":"0","dd":"0","sid":"043193","dot":0,"put":0,"n":"Kisvárda utca","wa":2},{"p":[19.28634406,47.47127932],"at":"798000000","dt":"798000000","ap":"1442520600","dp":"1442520600","ad":"0","dd":"0","sid":"F03509","dot":0,"put":0,"n":"Szabadság sugárút","wa":2},{"p":[19.29414144,47.46907504],"at":"799200000","dt":"799200000","ap":"1442520720","dp":"1442520720","ad":"0","dd":"0","sid":"F03498","dot":0,"put":0,"n":"Kucorgó tér","wa":2}],"a":{"n":"BKK","u":"http://www.bkk.hu","l":"hu","p":"+36 1 3 255 255","f":""},"f":{"n":"BKK Zrt.","u":"http://www.bkk.hu","l":"hu","s":"20150827","e":"","v":"L509-20150827"}})





A

Megjegyzések

Megjegyzés küldése