Question

我正在博客博客上尝试融合表示例，但地图没有显示。它几乎是示例代码的剪切和粘贴，除了我使用自己的地图API代码和我自己的融合表ID。我启用了融合表API并从我的浏览器进行了查询，以确认我可以从融合表中读取所有数据。

基本上我从这里复制并粘贴代码并且它不起作用所以我认为博主有一些东西

https://developers.google.com/maps/documentation/javascript/examples/layer-fusiontables-heatmap

首先，我尝试使用该代码并稍微更改查询以及我的API密钥和融合表ID，当这不起作用时，我只是将该代码逐字复制并粘贴到＆＃34; Page＆＃34;在博客中，它不起作用。

有任何帮助吗？

这是我的代码减去我的表ID和我的API密钥

val numPlayers = 3

val moves = List(
  PlayerState("A", List(PlayerPosition(0, 1))), // no collision in this window
  PlayerState("B", List(PlayerPosition(1, 1))),
  PlayerState("C", List(PlayerPosition(2, 2))),

  PlayerState("A", List(PlayerPosition(0, 2))), // no collision in this window
  PlayerState("B", List(PlayerPosition(1, 2))),
  PlayerState("C", List(PlayerPosition(2, 1))),

  PlayerState("A", List(PlayerPosition(1, 2))), // collision exists in this window
  PlayerState("B", List(PlayerPosition(1, 2))),
  PlayerState("C", List(PlayerPosition(1, 2))),

  PlayerState("A", List(PlayerPosition(1, 2))), // collision exists in this window
  PlayerState("B", List(PlayerPosition(2, 2))),
  PlayerState("C", List(PlayerPosition(1, 2)))
)

implicit val materializer = ActorMaterializer()

"game flow logic" must {
  "returns handles collision" in {

    val flow =
      Flow[PlayerState]
        .sliding(numPlayers, numPlayers)
        .map(_.map(_.positions).toSet.size < numPlayers)

    val gameLogicGraph =
      Source(moves)
        .via(flow)
        .toMat(Sink.seq[Boolean])(Keep.right)

    Await.result(gameLogicGraph.run(), 10 seconds) must be(
      List(false, false, true, true)
    )
  }
}

这是一个简单的API程序，我放在博客的不同页面，它工作正常。非常基本但没有融合表。

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Fusion Tables heatmaps</title>
<style>
  /* Always set the map height explicitly to define the size of the div
   * element that contains the map. */
  #map {
    height: 100%;
  }
  /* Optional: Makes the sample page fill the window. */
  html, body {
    height: 100%;
    margin: 0;
    padding: 0;
  }
</style>
</head>
<body>
<div id="map"></div>
<script>
  function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: 47.22155, lng: -76.72791},
      zoom: 3
    });

    var layer = new google.maps.FusionTablesLayer({
      query: {
        select: 'geometry',
        from: 'FOO'
      },
    });

    layer.setMap(map);
  }
</script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=FOO&callback=initMap">
</script>
</body>
</html>

Answer 1

好的，我一直在做更多调查，现在删除我以前的答案。这绝对是博客中有趣的事情 - 博主正在以某种方式干扰。我在没有融合表的简单工作示例和具有融合表的简单工作示例之间进行了一些代码比较。我确定我的第一个问题是这个模板：

#map {
    height: 100%;
}

这导致无法显示。如果我将其更改为

#map {
    height: 720px;
}

然后我用Fusion表数据点显示我的地图，但现在的问题是没有显示基础层。我谷歌那个问题，找不到多少。

以下是我可以比较的两个页面。这是我的博客作者之一：

http://www.prospector16.com/p/fusion-table-test.html

现在这里是完全相同的代码，但我进入了我的DNS域名并指出了＃34; aws＆＃34;托管在我的亚马逊AWS实例上，我在那里放了完全相同的代码，它运行正常：

http://aws.prospector16.com/algonquin-campsites.html

事实上，工作版本甚至可以正常工作，而不会改变＆＃34;身高：100％＆＃34;至＆＃34;身高：720px＆＃34;。它的工作正常，高度为100％

所以这显然是博客方面的事情。有人可以帮忙吗？

Blogger上的Google Fusion Tables示例

1 个答案: