0

edit1= 清除示例代码 edit2= 好尴尬,现在我将发布实际代码

我正在尝试制作自定义的内部街景。我试图通过用变量替换下面函数的参数来将自定义内部镜头转换为相对于任意起始位置,但会破坏街景。我不熟悉javascript。

description:"TEST TEST TEST TSET",latLng:new google.maps.LatLng(54.156654,69.696969)

运行良好。

var demolat = 34.995348; // declared at beginning of function
var demolon = 135.7395;
var wlat = demolat;
var wlon = demolon;

.. lots of code .. // lots of code goes here

description:"TEST TEST TEST TSET",latLng:new google.maps.LatLng(wlat,wlon)

不起作用。

完整代码

替换上述行时,脚本将无法正常工作。

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html;
 charset=utf-8"/>
    <script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=geometry" type="text/javascript"></script>
    <script type="text/javascript" code="maps_code">

        var initPosPanoID,initPosPanoData,streetView,map_canvas;
        function initialize(){

        var neeclat = 35.564157;
        var neeclon = 139.714947;

        //var demolat = 34.995138;
        //var demolon = 135.739689;

        var demolat = 34.995348;
        var demolon = 135.7395;

        var wlat = demolat;
        var wlon = demolon;

        swbound = new google.maps.LatLng(wlat-0.0003,wlon-0.0003);
        nebound = new google.maps.LatLng(wlat+0.0003,wlon+0.0003);

        var initPos=new google.maps.LatLng(wlat,wlon);
        var mapOptions={zoom:14,center:initPos,mapTypeId:google.maps.MapTypeId.ROADMAP};
        var mapDiv=document.getElementById("map_canvas");
        map_canvas=new google.maps.Map(mapDiv,mapOptions);


        var bounds=new google.maps.LatLngBounds(swbound,nebound);

        var overlay=new google.maps.GroundOverlay("./5Bc3IIj.jpg",bounds);
        overlay.setMap(map_canvas);
        var streetViewOptions={pov:{zoom:1,heading:161,pitch:-2.6}};
        var streetViewDiv=document.getElementById('streetview_canvas');
        streetViewDiv.style.fontSize="15px";
        streetView=new google.maps.StreetViewPanorama(streetViewDiv,streetViewOptions);
        streetView.controls[google.maps.ControlPosition.RIGHT_BOTTOM].push(mapDiv);
        google.maps.event.trigger(map_canvas,"resize");
        map_canvas.setStreetView(streetView);
        streetView.registerPanoProvider(getCustomPanorama);
        var streetViewInitPos=new google.maps.LatLng(wlat,wlon);
        // var streetViewInitPos=new google.maps.LatLng(34.995348,135.7395);
        var streetviewService=new google.maps.StreetViewService();
        var radius=50;
        streetviewService.getPanoramaByLocation(streetViewInitPos,radius,function(result,status){
                if(status==google.maps.StreetViewStatus.OK){
                    initPosPanoID=result.location.pano;
                    initPosPanoData=result;
                    streetView.setPosition(result.location.latLng);
                    map_canvas.panTo(result.location.latLng);
                }
            }
        );
        google.maps.event.addListener(streetView,"links_changed",createCustomLink);
        var map_marker=new google.maps.Marker({map:map_canvas});
        google.maps.event.addListener(streetView,"position_changed",function(){
            var position=this.getPosition();
            var map_bounds=map_canvas.getBounds();
            map_canvas.panTo(position);
            });
        }
    function getCustomPanoramaTileUrl(panoID,zoom,tileX,tileY){
        return"./"+panoID+'/'+tileX+'-'+tileY+'_s1.jpg';
    }
    function getCustomPanorama(panoID){
        var streetViewPanoramaData={
            links:[],copyright:'',tiles:{
                tileSize:new google.maps.Size(2048,1024),worldSize:new google.maps.Size(2048,1024),centerHeading:0,getTileUrl:getCustomPanoramaTileUrl
            }
        };
        switch(panoID){
        case initPosPanoID:
            return initPosPanoData;
        case"Position_S":

            //var tmp = new google.maps.LatLng(wlat,wlon);
            streetViewPanoramaData["location"]={

                description:"TEST TEST TEST TSET",latLng:new google.maps.LatLng(3,3)
            };
            streetViewPanoramaData["copyright"]=""
            break;


        case"Position_SW":
            streetViewPanoramaData["location"]={
                description:"TEST TEST TEST TSET",latLng:new google.maps.LatLng(3,3)
            };
            streetViewPanoramaData["copyright"]=""
            break;


        }
        if("location"in streetViewPanoramaData){
            streetViewPanoramaData.location.pano=panoID;
            return streetViewPanoramaData;
        }
    }
    function createCustomLink(){
        var links=streetView.getLinks();
        var panoID=streetView.getPano();
        var currentPos=streetView.getPosition();
        switch(panoID){
            case initPosPanoID:
                links.push({description:"テストエリアへ",pano:"Position_S"});
                break;
            case"Position_S":
                links.push({description:"外へ",pano:initPosPanoID});
                links.push({description:"SWへ",pano:"Position_SW"});
                break;
            case"Position_SW":
                links.push({description:"Sへ",pano:"Position_S"});
                break;

        }
        if(links.length){    //compute directional pointer label.
            var linkPano;
            for(var i=0;i<links.length;i++){
                linkPano=getCustomPanorama(links[i].pano);
                if(linkPano!==undefined){
                    links[i].heading=google.maps.geometry.spherical.computeHeading(currentPos,linkPano.location.latLng);
                }
            }
            return links;
        }
    }
    google.maps.event.addDomListener(window,'load',initialize);


</script>
  <style type="text/css">html,body{width:100%;
height:100%;
margin:0;
position:absolute}#frame,#streetview_canvas{width:100%;
height:100%;
position:relative}#map_canvas{width:250px;
height:250px;
border:2px solid gray;
background-color:#fff}</style>
  </head>
  <body>
    <div id="streetview_canvas"></div>
    <div id="map_canvas"></div>
  </body>
</html>
4

0 回答 0