这个问题是我尝试使用google maps api加载本地GeoJSON文件的结果：
var turMap;
/* Konstruer kart */
function initMap() {
turMap = new google.maps.Map(document.getElementById('hike-map'),
{
zoom: 13,
center:
{
lat: 60.3913, lng: 5.3221
}
}
);
}
var vidden = {
"_comment":"https://www.ut.no/tur/2.3909/",
"type":"FeatureCollection",
"features":[
{
"type":"Feature",
"properties":{
"name":"Enkel søndagstur over Knatten til Skomakerdiket"
},
"geometry":{
"type":"LineString",
"coordinates":[
[
5.35519746050418,
60.3872017305813
],
[
5.35670091445063,
60.3867486150925
],
[
5.35761580400357,
60.3868517763203
],
[
5.35857549505049,
60.3867100104639
],
[
5.35943664537779,
60.3869122352666
],
[
5.35955799271027,
60.387082223776
],
[
5.35939343468918,
60.3871908425067
],
[
5.35890148679304,
60.387223934485
],
[
5.35899927187223,
60.3873190872322
],
[
5.35911997128258,
60.3872992066534
],
[
5.35924603511103,
60.3872793260626
],
[
5.35980661681649,
60.3872793260626
],
[
5.36016319242197,
60.3872608916251
],
[
5.36032061632833,
60.3873104320628
],
[
5.36050429531247,
60.387371604483
],
[
5.360628336676,
60.3873918220575
],
[
5.36093248882549,
60.3874414457312
],
[
5.3609065184147,
60.3876065967871
],
[
5.36088823294143,
60.3877239403942
],
[
5.36100196340622,
60.3878771435906
],
[
5.36100645796983,
60.3879368221347
],
[
5.36084925913753,
60.3878745218996
],
[
5.36067957899846,
60.3877734031434
],
[
5.36037473303274,
60.3876893309108
],
[
5.36020567140545,
60.3876951972014
],
[
5.36004689829025,
60.3877384787589
],
[
5.35990531555009,
60.3877900807977
],
[
5.35970469291076,
60.3878632007089
],
[
5.35958667566894,
60.3879274270728
],
[
5.35964244912456,
60.3880010719457
],
[
5.35986897808736,
60.3880414542983
],
[
5.35991775456087,
60.3880828140702
],
[
5.35990595412759,
60.3881508870824
],
[
5.35971677248081,
60.3881944171215
],
[
5.35962959101481,
60.3882481594067
],
[
5.35966450957461,
60.388295101418
],
[
5.35980929902567,
60.3883965964427
],
[
5.35979588798004,
60.3884204523315
],
[
5.35952766706835,
60.3882786420678
],
[
5.35947670509512,
60.3882932207212
],
[
5.35961012962417,
60.388430009883
],
[
5.35959085670546,
60.3884376456311
],
[
5.35931577254806,
60.3883223780093
],
[
5.35924871732012,
60.3883382819733
],
[
5.35931040812989,
60.3884853932743
],
[
5.3592513995293,
60.3884973211886
],
[
5.35916264968698,
60.3884540045809
],
[
5.35907437372753,
60.3883647885633
],
[
5.35904486942728,
60.3883475592823
],
[
5.35900195408141,
60.3883767165218
],
[
5.35910119581869,
60.3885092490985
],
[
5.3591386257183,
60.3885583726119
],
[
5.35908196209129,
60.3885704329673
],
[
5.35894620842929,
60.3885035559584
],
[
5.35886228492334,
60.3884152834181
],
[
5.35882224607055,
60.3883793671786
],
[
5.35872928470851,
60.3884264153946
],
[
5.35863894796079,
60.3885366948555
],
[
5.35861591813045,
60.3886279625097
],
[
5.3586237625958,
60.3887213000994
],
[
5.35857548283175,
60.3887345532409
],
[
5.35843869016676,
60.3886629862119
],
[
5.35830033801165,
60.3885456156489
],
[
5.35826931363943,
60.388535679259
],
[
5.35820265576441,
60.3886219013646
],
[
5.35805781647216,
60.3888246744614
],
[
5.35795228367148,
60.3888479950817
],
[
5.35773448004984,
60.3888611259589
],
[
5.35752942127604,
60.3888578072007
],
[
5.35741052207952,
60.3888939131126
],
[
5.35730529734881,
60.3889417982106
],
[
5.35721023839111,
60.3890950366269
],
[
5.35704124541559,
60.3891737630509
],
[
5.35669834230404,
60.3893049142513
],
[
5.35631295050714,
60.3894382286246
],
[
5.35596590981161,
60.3894729951359
],
[
5.3557390862174,
60.3895337840945
],
[
5.35548077502735,
60.3896513523287
],
[
5.35524848329541,
60.3897928968963
],
[
5.3551725128766,
60.389902771665
],
[
5.35516519442244,
60.3899140075906
],
[
5.35511811527969,
60.3900094802549
],
[
5.35496024228162,
60.3900803107588
],
[
5.35479154910827,
60.3901065741121
],
[
5.35459480127241,
60.3901132301849
],
[
5.35446534733726,
60.3901144123134
],
[
5.35425980836219,
60.3902228467399
],
[
5.354050596051,
60.3903156143406
],
[
5.35381724385782,
60.3903726000216
],
[
5.35384138373989,
60.3903964544633
],
[
5.35409619360596,
60.3904110321685
],
[
5.35414312554375,
60.3904247905324
],
[
5.3541256979063,
60.3904507895143
],
[
5.35357079991434,
60.3905693765085
],
[
5.35359231501038,
60.3906186898829
],
[
5.35364290026514,
60.390684031632
],
[
5.35358657387373,
60.390715837246
],
[
5.352424685684,
60.3908859803492
],
[
5.35215090291057,
60.3909821513972
],
[
5.35212004640185,
60.3911201865863
],
[
5.35206720953547,
60.3912376319067
],
[
5.35228302024277,
60.3913201380061
],
[
5.35238762639833,
60.3913824227539
],
[
5.35232496718828,
60.391830155205
],
[
5.35161857779009,
60.3926489268973
],
[
5.35130898502228,
60.3933025943679
],
[
5.35102544260075,
60.3935817190184
],
[
5.3506775271604,
60.3938290387343
],
[
5.35101145465887,
60.3939989109631
],
[
5.3513235667801,
60.3942035483257
],
[
5.35185461219244,
60.3943132785146
],
[
5.35223012146887,
60.3942019710294
],
[
5.35263556134985,
60.3944387124446
],
[
5.35292140607504,
60.3945545001536
],
[
5.35323897353888,
60.3946678885561
],
[
5.35343692884329,
60.3947599508639
],
[
5.35359381362774,
60.3948589248291
],
[
5.35391454879441,
60.394891011252
],
[
5.35385014482839,
60.3950203097078
],
[
5.35380648381355,
60.3952625992684
],
[
5.35346278022312,
60.395396205806
],
[
5.35307769954992,
60.3956118377229
]
]
}}
]}
turMap.data.addGeoJson(vidden);/***************
ELEMENT STYLING
***************/
body {
margin:0;
font-family: 'Roboto', sans-serif;
}
p, h1, h2{
margin: 50px;
text-align: center;
margin-right: 20%;
margin-left: 20%;
}
/***************
STYLING MAPS
***************/
#playground-map {
height: 500px;
position: relative;
content: center;
}
#toilett-map {
height: 500px;
position: relative;
content: center;
}
#railway-map {
height: 500px;
position: relative;
content: center;
}
#hike-map {
height: 500px;
position: relative;
content: center;
}
/***************
CLASS STYLING
***************/
.fixedText{
position: absolute;
top: 135px;
right: 10%;
left: 10%;
}
.localNavPrev{
margin-left: 5%;
}
.localNavNext{
float: right;
margin-right: 5%;
}
.infoWindow{
max-width: 5%;
}
.wallpaper{
max-width: 100%;
margin: auto;
display: block;
}
.topnav {
overflow: hidden;
background-color: #715f47;
}
.topnav a {
float: left;
display: block;
color: #f2f2f2;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.topnav a:hover {
color: white;
}
.active {
background-color: #487a8a;
color: white;
}
.active a:hover not(.active) {
background-color: #487a8a;
color: white;
}
.topnav .icon {
display: none;
}
/***************
MEDIA QUERIES
***************/
@media screen and (max-width: 600px) {
.topnav a:not(:first-child) {display: none;} /*Hides each <a> in the topnav class, except the first child.*/
.topnav a.icon {
float: left;
display: block;
}
.topnav.responsive {position: relative;}
.topnav.responsive.icon {
position: absolute;
right: 0;
top: 0;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
#toilett-map{
max-height: 400px;
}
#playground-map{
max-height: 400px;
}
#railway-map{
max-height: 400px;
}
}<!DOCTYPE html>
<html>
<head>
<!-- Meta Data -->
<title>
Oversikt Bergen
</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="Style/style.css">
<link rel="icon" type="image/png" href="favicon.ico">
<!-- Java Script -->
<script type="text/javascript" src="Javascript/hamburgerMenu.js"></script>
<script type="text/javascript" src="Javascript/tur.js"></script>
</head>
<body>
<!-- Navigasjon / Meny -->
<div class="topnav" id="myTopnav">
<a class="active" href="index.html">Oversikt Bergen</a>
<a href="practical.html">Praktisk</a>
<a href="recreational.html">Kultur</a>
<a href="#about">Kontakt</a>
<a href="javascript:void(0);" style="font-size:15px;" class="icon" onclick="myFunction()">☰</a>
</div>
<div class="center">
<h1>
<a>Turer I Bergen</a>
</h1>
<img class="localNavPrev" src="img/icons/previous.svg" alt="Naviger turkart tilbake">
<img class="localNavNext" src="img/icons/next.svg" alt="Naviger turkart frem">
<p>
Du har mange muligheter til å benytte deg av et variert friluftsliv i Bergen.
Bruk pilene til å navigere mellom forskjellige turer i Bergensområde.
</p>
<div id="hike-map"></div>
<!-- Google Map API -->
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAY3Sz7Ey7QKva2pJcr9vyPGemTH7mvLF4&callback=initMap&language=no®ion=NO">
</script>
</body>
</html>
我的代码需要一些帮助。由于某种原因，“数据”的属性是未定义的。我正在努力寻找原因。我之前看到人们有类似的错误代码，通常是因为数据没有被正确解析。但是，我无法找到代码中的任何语法错误。
如果我只导入GeoJSON文件，谷歌拖放数据层一切都很完美。这就是为什么我觉得它有点令人沮丧。有人有任何类似的问题吗？如果这是一个菜鸟问题，我很抱歉，我正在努力学习：））
答案 0 :(得分：1)
移动：
QGraphicView在 turMap.data.addGeoJson(vidden);
函数内（定义变量initMap）
turMap函数在API加载后（以及在当前代码中调用initMap之后）异步运行
turMap.data.addGeoJson