0

我正在尝试在 Google 表格中呈现地图并设置自定义标记。我遵循了有关此主题的 App Script Docs:Visualization: Map。地图正在使用正确位置的图标进行渲染,但图标是默认设置。

我检查了我的 img URL(通过将它们设置为默认值)并且它们有效(以下 url 是假的)。我认为问题在于将 options.icons.keys 与 dataTable 第 3 列中的数据匹配。

这是从中提取的原始数据<?= jsonPoints ?>

[[29.59260664700021,-95.77028110299972,"Red"],
[29.591301814000055,-95.76907472100011,"Green"],
[29.591178932000005,-95.76802742100018,"Red"],
[29.587551849000003,-95.77229599100004,"Blue"]]

这是创建地图的函数:

function drawMap() {
  points = <?= jsonPoints ?>;

  var data = new google.visualization.DataTable();
  data.addColumn('number', 'Latitude');
  data.addColumn('number', 'Longitude');
  data.addColumn('string', 'Point Type');
  data.addRows(JSON.parse(points))

  var url = 'https://image.ibb.co/';
  var options = {
    showTooltip: true,
    showInfoWindow: true,
    useMapTypeControl: true,
    icons: {
      Red: {
        normal:   url + '/red.png',
        selected: url + '/red.png'
      },
      Blue: {
        normal:   url + '/Blue.png',
        selected: url + '/Blue.png'
      },
      Green: {
        normal:   url + '/Green.png',
        selected: url + '/Green.png'
      }
    }
  };
  var map = new google.visualization.Map(document.getElementById('chart'));
  map.draw(data, options);
}; 

我曾尝试在 options.icons.keys 上加上引号,例如"Green",但这不起作用。

有什么想法吗?

谢谢!

4

1 回答 1

0

弄清楚了。添加了基本上具有相同数据的第四列。一列转到工具提示,另一列用作标记:

  data.addColumn('number', 'Latitude');
  data.addColumn('number', 'Longitude');
  data.addColumn('string', 'Tooltip_Data');
  data.addColumn('string', 'Marker');

现在图标被渲染了!

于 2018-04-13T16:12:58.280 回答