egeloen / IvoryGoogleMapBundle

Google Map API v3 integration for your Symfony2 project.
https://github.com/egeloen/ivory-google-map
MIT License
217 stars 152 forks source link

Map does not load when on the same page as Autocomplete field #97

Closed ArturProd closed 10 years ago

ArturProd commented 10 years ago

Hello,

I am trying to use the autocomplete and google map on the same page and can't get it to work. I'm probably doing something wrong, but what?

The autocomplete field works good but the map does not display. If I manually call load_ivory_google_map from chrome javascript console, then the map loads well and works as expected.

When I look at the generated code, it seems that "load_ivory_google_map" is never called, because when loading the google api in "load_ivory_google_map_api", the callback is defined as "load_ivory_google_place" which never call in turn load_ivory_google_map ...

In my twig page:

            {{ google_map_css(map) }}
            {{ google_map_container(map) }}
            {{ google_map_js(map) }} 

           {{ form_widget(eventform.country) }}

in my formtype:

   $builder->add('country', 'places_autocomplete', array(
                    'mapped' => false,
                    // Javascript prefix variable
                    'prefix' => 'googleplace_country',
                    // Autocomplete types
                    'types'  => array(
                        AutocompleteType::CITIES,
                        // ...
                    ),

                    // TRUE if the autocomplete is loaded asynchonously else FALSE
                    'async' => true,

                    // Autocomplete language
                    'language' => 'en',
                ))

The way I build my map:

        $map = $this->get('ivory_google_map.map');
        $map->setLanguage($this->get('request')->getLocale());

my config file:

ivory_google_map:
    api: 
        libraries: [ "places" ]
    map:
        # You own map class
        #class: "My\Fucking\Map"

        # Your own map helper class
        #helper_class: "My\Fucking\MapHelper"

        # Prefix used for the generation of the map javascript variable
        prefix_javascript_variable: "map_"

        # HTML container ID used for the map container
        #html_container: "map_canvas"

        # If this flag is enabled, the map will load asynchronous
        async: true

        # If this flag is enabled, the map will autozoom on the overlays added
        auto_zoom: false

        # Center coordinate of the map
        # If the autozoom flag is enabled, the center is not used
        center:
            longitude: 0
            latitude: 0
            no_wrap: false

        # Zoom of the map
        # If the autozoom flag is enabled, the zoom is not used
        zoom: 3

        # Bound of the map
        # If the auto zoom flag is not enabled, the bound is not used
        # If the bound extends overlays, coordinates of the overlays extended are used instead of these coordinates
        # By default, there is no bound
#        bound:
#            south_west:
#                latitude: -2.1
#                longitude: -3.9
#                no_wrap: true
#            north_east:
#                latitude: 2.6
#                longitude: 1.4
#                no_wrap: true

        # Default map type
        # Available map type : hybrid, roadmap, satellite, terrain
        type: "roadmap"

        # Map width
        width: "200px"

        # Map height
        height: "200px"

        # Custom map options
        # By default, there is no map options
        map_options:
            disableDefaultUI: false
            disableDoubleClickZoom: false

        # Custom stylesheet options
        # By default, there is no stylesheet options except width & height
        stylesheet_options:
            border: "1px solid #000"
            background-color: "#fff"

        # google map Api language, default en
        language: en
egeloen commented 10 years ago

Closing as duplicate of #96