如何使我的标记叠加可点击

时间:2013-08-26 15:15:39

标签: javascript wordpress google-maps-api-3 jquery-gmap3

我正在尝试基于优雅主题“Explorable”WP主题构建一个网站,该主题又基于gmap3 jQuery插件。它使WP Posts显示为地图的标记。这些标记具有叠加层,用于指示帖子名称和类别,但不可点击。我试图将它们链接到实际的帖子页面。然而有些事情是错误的。

以下是我添加部分的代码。当我取消注释我添加的部分时,地图根本没有加载。请告诉我,我做错了什么。

function et_add_marker(marker_order, marker_lat, marker_lng, marker_description) {
    var marker_id = 'et_marker_' + marker_order;

    $et_main_map.gmap3({
        marker: {
            id: marker_id,
            latLng: [marker_lat, marker_lng],
            options: {
                icon: "<?php echo get_template_directory_uri(); ?>/images/blue-marker.png"
            },
            events: {
                click: function (marker) {
                    if (et_active_marker) {
                        et_active_marker.setAnimation(null);
                        et_active_marker.setIcon('<?php echo get_template_directory_uri(); ?>/images/blue-marker.png');
                    }
                    et_active_marker = marker;

                    <!--marker.setAnimation( google.maps.Animation.BOUNCE);-->
                    marker.setIcon('<?php echo get_template_directory_uri(); ?>/images/red-marker.png');

                    $(this).gmap3("get").panTo(marker.position);

                    $.fn.et_simple_slider.external_move_to(marker_order);
                },
                mouseover: function (marker) {
                    $('#' + marker_id).css({
                        'display': 'block',
                        'opacity': 0
                    }).stop(true, true).animate({
                        bottom: '15px',
                        opacity: 1
                    }, 500);
                },
                mouseout: function (marker) {
                    $('#' + marker_id).stop(true, true).animate({
                        bottom: '50px',
                        opacity: 0
                    }, 500, function () {
                        $(this).css({
                            'display': 'none'
                        });
                    });
                }
            }
        },
        overlay: {
            latLng: [marker_lat, marker_lng],
            options: {
                content: marker_description,
                offset: {
                    y: -42,
                    x: -122
                }
            }
            /* This is my code, that doesn't work */
            events: {
                click: function (marker) {
                    window.location.href = "<?php 'the_permalink' ?>";
                }
            } /*End of my code*/
        }
    });
}

1 个答案:

答案 0 :(得分:0)

选项和事件之间缺少逗号。 Thanx to Dr.Molle。