我可能不明白它是如何工作的,但是如果我输入@Model.name ,它将找到一个地址(只是为了您的测试目的而编一个地址),以下javascript应该可以找到我,找到目的地并找到我的路线。

但事实并非如此。 为什么不呢? 没有控制台错误。

    function success(position) {
    var s = document.querySelector('#status');

    if (s.className == 'success') {
        // not sure why we're hitting this twice in FF, I think it's to do with a cached result coming back    
        return;
    }

    s.innerHTML = "found you!";
    s.className = 'success';

    var mapcanvas = document.createElement('div');
    mapcanvas.id = 'mapcanvas';
    mapcanvas.style.height = '400px';
    mapcanvas.style.width = '560px';

    document.querySelector('article').appendChild(mapcanvas);

    var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
    var directionsService = new google.maps.DirectionsService();
    var directionsDisplay = new google.maps.DirectionsRenderer();

    var myOptions = {
        zoom: 15,
        center: latlng,
        mapTypeControl: false,
        navigationControlOptions: { style: google.maps.NavigationControlStyle.SMALL },
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("mapcanvas"), myOptions);

    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: "You are here! (at least within a " + position.coords.accuracy + " meter radius)"
    });

    var request = {
        origin: latlng,
        destination: '@Model.id',
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    };

    directionsService.route(request, function (response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
        }
    });
}

function error(msg) {
    var s = document.querySelector('#status');
    s.innerHTML = typeof msg == 'string' ? msg : "failed";
    s.className = 'fail';

    // console.log(arguments);
}

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(success, error);
} else {
    error('not supported');
}

===============>>#1 票数:0 已采纳

您必须为directionsDisplay定义map -option

  ask by TheWebs translate from so

未解决问题?本站智能推荐:

1回复

Google路线指示-中点标记

我如何在渲染路线的中间添加可点击的标记,然后将显示带有自定义数据的信息窗口,因为信息窗口无法直接添加到路线渲染器中? 我读到我们可以使用step,但是我不确定如何实现这一点。
1回复

获取用户指示的位置

我正在使用谷歌地图API。 我成功地用html显示谷歌地图。 现在,我想让用户选择位置并获取纬度/经度数据。 这是我想要的步骤。 用户将右键/左键单击地图上的某个点。 地图上会出现一个标记。 用户可以移动标记进行微调。 经度/纬度数据将显示在文本框
1回复

使用VueJS在Google Map上清除路线指示

我的应用程序中包含以下代码: 它可以工作,但是当我第二次调用它来绘制另一条路线时,第一条路线不会从地图上删除。 我读到我需要调用directionsDisplay.setDirections(null)来清除方向,并且它可以工作,例如,如果我添加setTimeout(function(
3回复

调用javascript对象值会给我“未定义”

我正在使用Google Map应用程序,我希望从数据库中加载一些标记并将其显示在地图上。 因此,我创建了一个数组并定义了这样的对象。 然后,我将从ajax请求中检索到的一些数据添加到“ shop_data”对象数组中。 该数组定义为“ all_shops”。 然后,当我调用“
1回复

将纬度和经度传递给我的地图脚本

我使用纬度和经度在Google地图中显示用户地址。 我通过使用Java脚本获得了lat&long,并且还拥有map脚本。 但是我不知道如何将它们结合起来,我只需要将lat和long传递给显示地图脚本“ function initialize()”。 这是我的代码:
2回复

谷歌地图不断给我同样的错误

我正在尝试将google map tp插入我的html代码,但它会不断显示以下错误:“ myMap不是函数”,这是我的代码: function myMap() { var mapOptions = { center: new google.maps.LatLng(51.5, -0
1回复

来自Google Maps API的指示中与时间相关的信息

有没有办法在Google Maps API的指示中获取与时间相关的信息? 不仅仅是整个旅行的时间量,而是指示每个“步骤”的时间量? 或者到达路线上指定点所需的时间? 谢谢。
1回复

手动触发鼠标事件不会给我latLng

我从地图上绝对定位的dom元素触发了地图上的鼠标事件(此元素跟随我的鼠标)。 我希望mouseup元素在地图上触发,就好像直接在地图上执行mouseup一样。 最重要的是,我需要释放鼠标按钮的位置的latLng坐标。 这是我的代码的相关部分(关于鼠标后面的元素)。 如果直接单击地图
1回复

google maps api:显示箭头以指示在地图上不存在标记

我有一个使用javascript Google Maps API来显示一些点(标记)的html应用程序。 有些点可能在当前用户地图中不可见(由于缩放,位置等)。 我一直在寻找表示这些点的方法,例如,地图边界附近的箭头指示方向。 是否有任何功能/库可能会有所帮助? 万一没有。 我
1回复

如果对相同的来源和目的地进行不同的调用,Google Distance API会给我带来不同的结果

我试图用两种不同的方法从谷歌api中找到两个点p1和p2之间的距离... 这是代码... 我得到的输出如下... 103.847 //对于第一个日志78.35 //对于第二个日志 有人可以解释一下为什么存在这种区别吗....我在哪里错了....