PROGRESO | WEBESTEEM | ART&DESIGN MAGAZINE 
Forum webesteem Strona Główna webesteem:forum

   Regulamin | Szukaj | Użytkownicy | Grupy | Statystyki | Ostatnie tematy | RSS | Rejestracja | Profil | Skrzynka | Zaloguj

Google Maps - wyznaczanie trasy

 
Napisz nowy temat   Odpowiedz do tematu    Forum webesteem Strona Główna | html i javascript
Zobacz poprzedni temat :: Zobacz następny temat  
Autor Wiadomość
neomagic




Od: 2011.07.27
Posty: 1

PostWysłany: 2011.07.27 15:53    Temat postu: Google Maps - wyznaczanie trasy

Witam wszystkich, mam problem ze skryptem, nie wiem dlaczego mapka laduje sie jakos dziwnie, tzn. wyswietla sie tylko pasek w gornym lewym rogu popupa a powinna na calym divie o id = "google-map". Problem powstal w momencie gdy pokazuje mape dojazdu po uprzednim wybraniu kliknieciem adresu z listy.

Przyklad bardzo podobny gdzie to dziala jest tu: http://gmapsapi.com/przyklad/120/02.html
Moj kod dostepny jest tu: http://neomagic.hekko.pl/googlemap/

Bardzo prosze o pomoc
Z gory dzieki.


Kod:
<!DOCTYPE html>
<html lang="pl">
    <head>
        <title>Google Maps</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
        <script src="http://maps.google.com/maps/api/js?sensor=false&amp;language=pl" type="text/javascript"></script>
        <style type="text/css">
            html, body { height: 100%; margin: 0; padding: 0; }
            #containerMap { display: none; position: fixed; top: 100px; left: 50%; width: 1000px; height: 500px; margin-left: -500px; background: #fff; z-index: 20; }
            #shadow { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba( 0, 0, 0, 0.5 ); z-index: 10; }
            #tip { position: absolute; top: 0; right: 0; float: right; width: 320px; height: 500px; overflow: hidden; overflow-y: scroll; }
            #google-map { width: 670px; height: 500px; background: gray; }
            #closeMap { position: absolute; top: -30px; right: 10px; width: 20px; height: 20px; color: #fff; font-weight: bold; text-align: center; cursor: pointer; background: #ff0000; }
        </style>

        <script type="text/javascript">
        //<![CDATA[
            var Neomagic = Neomagic || {};
            Neomagic.GoogleMap = {
                road: null,
                road_render: null,
                $shadow: null,
                $containerMap: null,
                startPoint: '',
                endPoint: '',
                init: function() {
                    var me = Neomagic.GoogleMap;
                    me.road = new google.maps.DirectionsService();
                    me.road_render = new google.maps.DirectionsRenderer();
                    me.$shadow = jQuery( '#shadow' );
                    me.$containerMap = jQuery( '#containerMap' );
                    jQuery( 'a.address' ).bind( 'click', me.showMap );
                    jQuery( '#closeMap' ).bind( 'click', me.closeMap );
                    var mapOptions = {
                        zoom: 15,
                        mapTypeId: google.maps.MapTypeId.ROADMAP,
                        disableDefaultUI: false
                    };
                    var map = new google.maps.Map( document.getElementById( 'google-map' ), mapOptions );
                    me.road_render.setMap( map );
                    me.road_render.setPanel( document.getElementById( 'tip' ) );
                },
                findTips: function() {
                    var me = Neomagic.GoogleMap;
                    var data_road = {
                        origin: me.startPoint,
                        destination: me.endPoint,
                        travelMode: google.maps.DirectionsTravelMode.DRIVING
                    };
                    me.road.route( data_road, me.factoryTips );
                    return false;
                },
                factoryTips: function( result, status ) {
                    var me = Neomagic.GoogleMap;
                    if( status != google.maps.DirectionsStatus.OK || !result.routes[0] ) {
                        alert( 'Wystąpił błąd z mapą!' );
                        return;
                    }
                    me.road_render.setDirections( result );
                },
                showMap: function() {
                    var me = Neomagic.GoogleMap;
                    me.startPoint = 'Warszawa, ul. Nowoursynowska 29';
                    me.endPoint = jQuery( this ).html();
                    me.findTips();
                    me.$shadow.show();
                    me.$containerMap.show();
                    return false;
                },
                closeMap: function() {
                    var me = Neomagic.GoogleMap;
                    me.$shadow.hide();
                    me.$containerMap.hide();
                    me.startPoint = '';
                    me.endPoint = '';
                    return false;
                }
            }
            $( Neomagic.GoogleMap.init );
        //]]>
        </script>
    </head>
    <body>
        <!-- http://gmapsapi.com/poradnik/120_znajdowanie_wskazowek_dojazdu.html?tag=* -->
        <ul>
            <li><a class="address" style="cursor: pointer;">Łódź, ul. Kościuszki 28</a></li>
            <li><a class="address" style="cursor: pointer;">Łódź, ul. Piotrkowska 162</a></li>

        </ul>
        <div id="containerMap">
            <div id="google-map"></div>
            <div id="tip"></div>
            <a id="closeMap">X</a>
        </div>
        <div id="shadow"></div>
    </body>

</html>

[/code]



neomagic
http://motdemot.pl/
^
Odpowiedz z cytatem
Wyświetl posty z ostatnich:   
Napisz nowy temat   Odpowiedz do tematu    Forum webesteem Strona Główna | html i javascript Wszystkie czasy w strefie CET (Europa)
Strona 1 z 1

 
Skocz do:  
Nie możesz pisać nowych tematów
Nie możesz odpowiadać w tematach
Nie możesz zmieniać swoich postów
Nie możesz usuwać swoich postów
Nie możesz głosować w ankietach

FAQ


serwery wirtualne, tanie domeny

Powered by phpBB © 2001, 2005 phpBB Group

82758003

Page generation time: 0.034s (PHP: 84% - SQL: 16%) - SQL queries: 14 - GZIP enabled - Debug off