Question

我尝试在此处使用此代码：fiddle

但它一直向我发送一个javascript错误“Uncaught TypeError：无法读取未定义的属性'x'。

我大多认为是因为元素在执行init函数之前没有时间加载。

这是我的观点：

$countPreferred = Answer::where(
  'question_id', '=', $request->question_id)->select(
       DB::raw('DISTINCT(user_id)') 
  )->where('pref', '=', 1)->get()->count();

这是我的约束力：

 <div id="mapDiv" data-bind="map:myMap"></div>

那是我的viewmodel：

ko.bindingHandlers.map = {
    init: function (element, valueAccessor, allBindingsAccessor) {
        var mapObj = ko.utils.unwrapObservable(valueAccessor());
        var latLng = new google.maps.LatLng(
            ko.utils.unwrapObservable(mapObj.lat),
            ko.utils.unwrapObservable(mapObj.lng));
        var mapOptions = { center: latLng,
                            zoom: 15};

        mapObj.googleMap = new google.maps.Map(element, mapOptions);

        mapObj.marker = new google.maps.Marker({
            map: mapObj.googleMap,
            position: latLng,
            title: "You Are Here",
        });

        $("#" + element.id).data("mapObj",mapObj);
    }

};

}）;

Answer 1

我用你的代码制作了a fiddle，一旦我将地图div设置为具有高度和宽度，它就会毫无问题地运行。

<div id="mapDiv" style="width:300px; height:300px" data-bind="map:myMap"></div>

我从来没有看到对x的任何引用，所以我不能说我已经解决了您的问题，但如果您认为自己在Google地图准备就绪之前已经开始运行，请参阅this solution为空闲事件添加一个监听器。

过早加载谷歌地图绑定

1 个答案: