C# 显示谷歌地图方向详细信息时滚动div问题

C# 显示谷歌地图方向详细信息时滚动div问题,c#,javascript,asp.net,google-maps,C#,Javascript,Asp.net,Google Maps,我有一个谷歌地图,上面有一个标记,它是起始地址,还有一个文本输入,它接受目标地址。单击GetDirections按钮时,我在一个div中获取方向信息。代码如下: asp.net: 输入地址以获取方向: javascript代码: var lat = '<%=m_lat %>', long = '<%=m_long %>'; var myCenter = new google.maps.LatLng(lat, long); var directionsDisplay =

我有一个谷歌地图,上面有一个标记,它是起始地址,还有一个文本输入,它接受目标地址。单击GetDirections按钮时,我在一个div中获取方向信息。代码如下: asp.net:


输入地址以获取方向:
javascript代码:

var lat = '<%=m_lat %>', long = '<%=m_long %>';
var myCenter = new google.maps.LatLng(lat, long);
var directionsDisplay = new google.maps.DirectionsRenderer();
var directionsService = new google.maps.DirectionsService();

function initialize() { 
var mapProp = {
                    zoom: 7,
                    panControl: true,
                    zoomControl: true,
                    zoomControlOptions: {
                        style: google.maps.ZoomControlStyle.LARGE
                    },
                    mapTypeControl: true,
                    scaleControl: true,
                    streetViewControl: true,
                    overviewMapControl: true,
                    rotateControl: true,
                    center: myCenter,
                    mapTypeId: google.maps.MapTypeId.HYBRID
                };
            var map = new google.maps.Map(document.getElementById("map-container"), mapProp);

            var geocoder = new google.maps.Geocoder();
            geocoder.geocode({ 'latLng': myCenter }, function (results, status) {
                if (results != null) {
                    result = results[0];
                    if (result != null) {
                        var strFullAddress = '<%=m_Address %>';
                        document.getElementById('hdnUserAddress').value = strFullAddress;
                    }
                }
                var marker = new google.maps.Marker({
                    position: myCenter,
                    title: "latlng: " + myCenter + " You are in" + document.getElementById('hdnUserAddress').value
                });

                marker.setMap(map);
                infowindow = new google.maps.InfoWindow({ content: "<b>Address</b><br/>" + document.getElementById('hdnUserAddress').value });
                google.maps.event.addListener(marker, 'click', function () {
                    infowindow.open(map, marker);
                });
            });



directionsDisplay.setPanel(document.getElementById('directions-panel'));
            directionsDisplay.setMap(map);
}

function reducemap() {
            document.getElementById("map-container").style.width = "320px";
            document.getElementById("directions-panel").style.width = "280px";
            document.getElementById("directions-panel").style.visibility = 'visible';
        }
    function calcRoute() {
        var start = '<%=m_Address %>';
        var end = document.getElementById('end').value;
        var request = {
            origin: start,
            destination: end,
            travelMode: google.maps.TravelMode.DRIVING
        };
        directionsService.route(request, function (response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(response);
            }
        });
    }

    google.maps.event.addDomListener(window, 'load', initialize);
var lat='',long='';
var myCenter=new google.maps.LatLng(lat,long);
var directionsDisplay=new google.maps.DirectionsRenderer();
var directionsService=new google.maps.directionsService();
函数初始化(){
var mapProp={
缩放:7,
泛控制:对,
动物控制:对,
ZoomControl选项:{
样式:google.maps.ZoomControlStyle.LARGE
},
mapTypeControl:true,
scaleControl:对,
街景控制:对,
overviewMapControl:true,
旋转控制:对,
中心:迈森特,
mapTypeId:google.maps.mapTypeId.HYBRID
};
var map=new google.maps.map(document.getElementById(“地图容器”),mapProp);
var geocoder=new google.maps.geocoder();
geocoder.geocode({'latLng':myCenter},函数(结果,状态){
如果(结果!=null){
结果=结果[0];
如果(结果!=null){
var strFullAddress='';
document.getElementById('hdnUserAddress')。value=strFullAddress;
}
}
var marker=new google.maps.marker({
职位:迈森特,
标题:“latlng:“+myCenter+”您在“+document.getElementById('hdnUserAddress').value”中
});
marker.setMap(map);
infowindow=new google.maps.infowindow({content:“Address
“+document.getElementById('hdnUserAddress').value}); google.maps.event.addListener(标记,'click',函数(){ 信息窗口。打开(地图、标记); }); }); directions display.setPanel(document.getElementById('directions-panel'); 方向显示.setMap(地图); } 函数reducemap(){ document.getElementById(“映射容器”).style.width=“320px”; document.getElementById(“方向面板”).style.width=“280px”; document.getElementById(“方向面板”).style.visibility='visible'; } 函数calcRoute(){ var start=''; var end=document.getElementById('end').value; var请求={ 来源:start, 目的地:完, travelMode:google.maps.travelMode.DRIVING }; 路由(请求、功能(响应、状态){ if(status==google.maps.directionstatus.OK){ 方向显示。设置方向(响应); } }); } google.maps.event.addDomListener(窗口“加载”,初始化);

问题是:当显示方向时,google map会在方向面板div中用左右箭头显示方向,当我尝试滚动div时,箭头不会固定,它们也会不断移动。我希望在滚动时箭头无论在哪里都会固定。有人能帮我解决这个问题吗?

在加载google map的google api脚本后,我在页面的样式标签中添加了以下内容,我的浏览器问题得到了解决:

/* Override Google Maps Icon style */
            .adp-substep .adp-stepicon .adp-maneuver {
                position: static;
            }

            /* Override Google Maps Icon Container style */
            .adp-substep .adp-stepicon{
                position: static; }
/* Override Google Maps Icon style */
            .adp-substep .adp-stepicon .adp-maneuver {
                position: static;
            }

            /* Override Google Maps Icon Container style */
            .adp-substep .adp-stepicon{
                position: static; }