Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/429.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 为什么我的谷歌地图V3标记集中在屏幕上,而不是放在它们的地理位置上?_Javascript_Google Maps - Fatal编程技术网

Javascript 为什么我的谷歌地图V3标记集中在屏幕上,而不是放在它们的地理位置上?

Javascript 为什么我的谷歌地图V3标记集中在屏幕上,而不是放在它们的地理位置上?,javascript,google-maps,Javascript,Google Maps,对于我的网站ASP.net vb,我正在制作一个交互式Google地图页面,其中标记从XML文件中加载。当我编写代码并测试localhost时,一切正常。现在我把所有东西都上传到了服务器上,我所有的标记都放错了地方,我似乎无法解决这个问题。也许有人也有同样的问题或者知道我做错了什么 我的地图可以在这里查看: 我的代码: $(document).ready(function () { // Set map height to match viewport v

对于我的网站ASP.net vb,我正在制作一个交互式Google地图页面,其中标记从XML文件中加载。当我编写代码并测试localhost时,一切正常。现在我把所有东西都上传到了服务器上,我所有的标记都放错了地方,我似乎无法解决这个问题。也许有人也有同样的问题或者知道我做错了什么

我的地图可以在这里查看:

我的代码:

    $(document).ready(function () {
        // Set map height to match viewport
        var viewportHeight = window.innerHeight ? window.innerHeight : $(window).height();
        viewportHeight = viewportHeight - 60;
        $("#maps").css({ 'height': viewportHeight }, 0);
        $(window).resize(function () {
            var viewportHeight = window.innerHeight ? window.innerHeight : $(window).height();
            viewportHeight = viewportHeight - 60;
            $("#maps").css({ 'height': viewportHeight }, 0);
        });
        $("body").css("overflow", "hidden");

        // Filter tabs
        $("#filter > div").hide();
        $("#filter > div:first").show();
        $("#filter > ul li a").click(function () {
            if ($(this).parent().hasClass("active")) {
                return false;
            } else {
                var index = $(this).parent().index() + 5;
                $("#filter > ul li").removeClass("active");
                $(this).parent().addClass("active");
                $("#filter > div").slideUp(250);
                $("#filter > div:nth-child(" + index + ")").slideDown(250);
                if ($("#filter > div:nth-child(" + index + ")").attr("id") == "search") {
                    $("#search .input").focus();
                }
                return false;
            }
        });

        // Drag info and filter
        $("#filter").draggable({ containment: "#maps", scroll: false, handle: ".move" });
        $("#stadium-info").draggable({ containment: "#maps", scroll: false, handle: ".move" });

        // Hide info
        $('#stadium-info').hide();

        // Info closed
        $('.close').click(function () {
            var val = $(this).attr('rel');
            markers[val].setMap(map);
            unlock();
            $('#stadium-info').fadeOut(500);
            $('#filter').delay(1000).fadeIn(500);
            return false;
        });

        $('.next, .prev').live('click', function (e) {
            e.preventDefault();
            var id = $(this).attr('rel');
            google.maps.event.trigger(markers[id], 'click');
        });
    });


    // Calculate best zoom for displaysize
    var startZoom = null;
    var viewportWidth = window.innerWidth ? window.innerWidth : $(window).width();
    if (viewportWidth >= 1920) {
        startZoom = 3;
    } else {
        startZoom = 2;
    }

    // Map options
    var markers = [];
    var emptyZoom = 17;
    var startPosition = new google.maps.LatLng(10.0, 28.652344);
    var mapOptions = {
        zoom: startZoom,
        center: startPosition,
        mapTypeId: google.maps.MapTypeId.SATELLITE,
        mapTypeControl: false,
        streetViewControl: false,
        minZoom: startZoom,
        zoomControlOptions: {
            position: google.maps.ControlPosition.RIGHT_TOP
        },
        panControlOptions: {
            position: google.maps.ControlPosition.RIGHT_TOP
        }
    };
    var map = new google.maps.Map(document.getElementById("google-maps"), mapOptions);

    // Lock map
    function lock() {
        map.setOptions({
            disableDoubleClickZoom: true,
            draggable: false,
            zoomControl: false,
            panControl: false,
            scrollwheel: false
        });
    }

    // Unlock map
    function unlock() {
        map.setOptions({
            disableDoubleClickZoom: false,
            draggable: true,
            zoomControl: true,
            panControl: true,
            scrollwheel: true
        });
    }

    // Vars lat lng zoom for infobox
    var oldLat = null;
    var oldLng = null;
    var oldZoom = null;

    // Create markers
    $.ajax({
        type: "GET",
        url: "xml/Maps.xml",
        dataType: "xml",
        success: function (xml) {
            $(xml).find('stadium').each(function () {
                var lat = $(this).attr('latitude');
                var lng = $(this).attr('longitude');
                var zoom = $(this).attr('zoom');
                var name = $(this).attr('name');
                var id = $(this).attr('id');
                var countryId = $(this).parent().attr('id');

                if (lat > 0 || lat < 0) {
                    if (zoom == 0) {
                        zoom = emptyZoom;
                    }
                    var point = new google.maps.LatLng(lat, lng)
                    var marker = new google.maps.Marker({
                        position: point,
                        map: map,
                        icon: 'img/bg/icon-stadium.png',
                        title: name
                    });
                    marker.metadata = { id: id, name: name, countryId: countryId };
                    markers[id] = marker;
                    // Marker click function
                    google.maps.event.addListener(marker, 'click', function () {
                        // Save current lat lng zoom to cookie

                        //alert(map.getZoom());


                        // Zoom in on marker and hide marker                    
                        offset = new google.maps.LatLng(lat, parseFloat(lng) + parseFloat(0.0015));
                        map.panTo(offset);
                        map.setZoom(parseInt(zoom));
                        lock();
                        marker.setMap(null);

                        // Hide filter
                        $('#filter').fadeOut(500);

                        // Determine info position
                        var right;
                        if (viewportWidth > 1280) {
                            right = viewportWidth - 960;
                            right = right / 2 - 10;
                        } else {
                            right = 30;
                        }

                        // Get marker id
                        var id = marker.metadata.id;

                        $.ajax({
                            type: "GET",
                            url: "xml/Maps.xml",
                            dataType: "xml",
                            success: function (xml) {
                                var flag = $(xml).find("stadium[id=" + id + "]").parent().attr('flag');
                                var club = $(xml).find("stadium[id=" + id + "]").attr('club');
                                var capacity = $(xml).find("stadium[id=" + id + "]").attr('capacity');
                                var constructed = $(xml).find("stadium[id=" + id + "]").attr('constructed');
                                var inuse = $(xml).find("stadium[id=" + id + "]").attr('inuse');
                                var countryid = $(xml).find("stadium[id=" + id + "]").parent().attr('id');
                                var countryname = $(xml).find("stadium[id=" + id + "]").parent().attr('name');
                                var nextstadiumname = $(xml).find("stadium[id=" + id + "]").next().attr('name');
                                var nextstadiumclub = $(xml).find("stadium[id=" + id + "]").next().attr('club');
                                var nextstadiumid = $(xml).find("stadium[id=" + id + "]").next().attr('id');
                                var prevstadiumname = $(xml).find("stadium[id=" + id + "]").prev().attr('name');
                                var prevstadiumclub = $(xml).find("stadium[id=" + id + "]").prev().attr('club');
                                var prevstadiumid = $(xml).find("stadium[id=" + id + "]").prev().attr('id');
                                var rating = parseFloat($(xml).find("stadium[id=" + id + "]").attr('rating'));

                                $('#stadium-info a.close').attr("rel", id);
                                $('#stadium-info h6:first').html(name).prepend('<img src="uploads/flags/' + flag + '.png" alt="' + countryname + '" /> ');
                                $('#stadium-info').css('right', right).delay(1000).fadeIn(500);
                                if (nextstadiumname == undefined) {
                                    nextstadiumname = $(xml).find("country[id=" + countryid + "]").children().first().attr('name');
                                    nextstadiumclub = $(xml).find("country[id=" + countryid + "]").children().first().attr('club');
                                    nextstadiumid = $(xml).find("country[id=" + countryid + "]").children().first().attr('id');
                                }
                                $('.next').html(nextstadiumname);
                                $('.next').attr('title', nextstadiumname + ', ' + nextstadiumclub);
                                $('.next').attr('rel', nextstadiumid);
                                if (prevstadiumname == undefined) {
                                    prevstadiumname = $(xml).find("country[id=" + countryid + "]").children().last().attr('name');
                                    prevstadiumclub = $(xml).find("country[id=" + countryid + "]").children().last().attr('club');
                                    prevstadiumid = $(xml).find("country[id=" + countryid + "]").children().last().attr('id');
                                }
                                $('.prev').html(prevstadiumname);
                                $('.prev').attr('title', prevstadiumname + ', ' + prevstadiumclub);
                                $('.prev').attr('rel', prevstadiumid);
                                $('#info-capacity').html(capacity);
                                $('#info-club').html(club.replace(/_/g, "<br />"));
                                $('#info-constructed').html(constructed);
                                $('#info-inuse').html(inuse);
                                var oRating = $find("ctl00_ContentPlaceHolder2_GoogleMaps1_rating");
                                oRating.set_value(rating);
                            }
                        });
                    });
                }
            });
        }
    });

    //Filters

    // Reset filters and show all markers
    function ResetFilters() {
        $("#search .input").val("Zoek op trefwoord");
        ResetMarkers();
    }
    // Reset all markers to map
    function ResetMarkers() {
        for (i in markers) {
            markers[i].setMap(map);
        }
    }

    // Filter by country
    $("#filter_country").live("change", function () {
        var val = $(this).val();
        $.ajax({
            type: "GET",
            url: "xml/Maps.xml",
            dataType: "xml",
            success: function (xml) {
                var lat = $(xml).find("country[id=" + val + "]").attr("latitude");
                var lng = $(xml).find("country[id=" + val + "]").attr("longitude");
                var zoom = $(xml).find("country[id=" + val + "]").attr("zoom");
                if (lat > "0" && lng > "0") {
                    var countryPosition = new google.maps.LatLng(lat, lng);
                    map.panTo(countryPosition);
                    map.setZoom(parseInt(zoom));
                }
            }
        });


        if (val > 0) {
            for (i in markers) {
                if (markers[i].metadata.countryId == val) {
                    markers[i].setMap(map);
                } else {
                    markers[i].setMap(null);
                }
            }
        } else {
            ResetMarkers();
        }
    });

    // Filter by stadium
    $("#filter_stadium").live("change", function () {
        var val = $(this).val();
        //var marker = new google.maps.Marker(markers[val]);
        google.maps.event.trigger(markers[val], 'click');
    });

    // Filter by keywords
    $("#search .input").keyup(function () {
        var val = $(this).val().toLowerCase();
        if (val != "suche nach schlüsselwort" && val != "search by keyword" && val != "zoek op trefwoord") {
            for (i in markers) {
                if (markers[i].metadata.name.toLowerCase().indexOf(val) >= 0) {
                    markers[i].setMap(map);
                } else {
                    markers[i].setMap(null);
                }
            }
        } else {
            ResetMarkers();
        }
    });
    $('#search .input').focus(function () {
        map.setCenter(startPosition);
        map.setZoom(startZoom);
    });


    $("#filter ul li a").click(function () {
        ResetFilters();
        return false;
    });

这是你的数据-在0、0有很多位置,它们都在这个点的几度之内。

< P>这是你的数据-0,0有许多位置,它们都在这个点的几度之内。

它们都显示在海洋中央吗?如果是这样,LNG/LAT可能不设置或0/0.-它们都显示在海洋的中间吗?如果是这样的话,lng/lat可能没有设置或0/0。你的权利,我真愚蠢,没有看到这一点。我现在知道问题出在哪里了,在我创建maps.xml的函数中。此函数用于删除部分纬度和经度。事实上,然后使用6.xx的值,它们都接近0.0你的权利,我真愚蠢,没有看到这一点。我现在知道问题出在哪里了,在我创建maps.xml的函数中。此函数用于删除部分纬度和经度。实际上,然后使用6.xx的值,它们都接近于0.0