表格更新后，Fusion Table api地图不显示样式 [英] Fusion table api map not showing styles after table update

问题描述

我对Fusion Tables API比较陌生，我正尝试使用Fusion Tables和Google Maps Api创建一个简单的Web应用程序。该应用程序将每天使用大约三次，并且每次将新的一组数据添加到表格中，用新的数据替换旧的数据。

到目前为止，应用程序按预期工作，除了对融合表进行更改时。当我通过Fusion Table页面手动添加或删除表中的多行然后返回到我的应用程序时，我注意到样式停止正常工作，并且在很多情况下完全不出现;然而，大约一个小时后，所有事情都开始正常工作了。

我用来创建样式的代码是这样的，

  layer = new google.maps.FusionTablesLayer（{
 query：{
 select：geometry，
 from：'11CIZUlNjBPiOM1Y4pDUP_Mn9TxkqF0etfpWhi5c'
}，
 styles：[
 {
 polygonOptions：{
 fillColor：'＃FF0000'，
 fillOpacity：0.05 
} 
}，
 {
 where ：Location LIKE'PERDUE'，
 polygonOptions：{
 // fillColor：'＃0000FF'
 fillOpacity：0.2 
} 
}，
 {
其中：GeoBlock ='AC1C'，
 polygonOptions：{
 // fillColor：'＃0000FF'
 fillOpacity：0.8 
} 
 }，
 {
其中：Location ='BENGOUGH'，
 polygonOptions：{
 // fillColor：'＃0000FF'
 fillOpacity：0.99 
} 
}] 
}）; 
 
 layer.setMap（map）; 
  

我研究了一下，看看有没有其他人有类似的问题，我遇到过类似于我遇到的问题，它可能是浏览器的缓存问题，但我已经同时使用多台机器测试了这种情况，并且得到了相同的结果，我还在代码中添加了no-cache标签，以防止浏览器缓存样式。我不确定这是一个Api问题还是其他问题。我会很感激任何关于如何解决这个问题的建议。

谢谢，

解决方案

这是一个API问题，为显示图层而创建的贴图也会被google缓存。

你可以做些什么：修改查询，这样它仍然获取相同的结果，但查询的字符串表示形式不同。这应该会加快tile-update（并防止客户端缓存）。

考虑到你的代码，可以这样做：

  var和='位置不包含'+ new Date（）。getTime（）+'''; 
 
 layer = new google.maps.FusionTablesLayer（{
 query：{
 select：geometry，
 from：'11CIZUlNjBPiOM1Y4pDUP_Mn9TxkqF0etfpWhi5c'，
 where ：and 
}，
 styles：[
 {
 polygonOptions：{
 fillColor：'＃FF0000'，
 fillOpacity：0.05 
} 
}，
 {
 where：Location LIKE'PERDUE'and+ and，
 polygonOptions：{
 // fillColor：'＃0000FF'
 fillOpacity：0.2 
} 
}，
 {
其中：GeoBlock ='AC1C'和+ and 
 polygonOptions：{
 // fillColor：'＃0000FF'
 fillOpacity：0.8 
} 
}，
 {
 where：Location ='BENGOUGH'and+ and，
 polygonOptions：{
 // fillColor：'＃0000FF'
 fillOpacity：0.99 
} 
}] 
}）; 
  

而不是使用 new Date（）。getTime（）我会建议使用（如果可用）例如上次修改的时间戳，以便在没有更新完成时仍然可以使用缓存切片。

I'm relatively new to the Fusion Tables Api and I am trying to create a simple web app using Fusion Tables and Google Maps Api. The application will be used about three times a day and each time a new set of data will be added to the table, replacing the old entries with new ones.

So far, the application is working as expected, except for when changes are made to the fusion table. When I add or delete multiple rows from the table manually through the Fusion Table page and then return to my app, I notice that the styles stop working properly, and in many cases do not appear at all; however, after about an hour everything starts working normally again.

The code I use for creating the styles is this,

layer = new google.maps.FusionTablesLayer({
    query: {
      select: "geometry",
      from: '11CIZUlNjBPiOM1Y4pDUP_Mn9TxkqF0etfpWhi5c'
    },
    styles:[
    {
        polygonOptions:{
                fillColor: '#FF0000',         
                fillOpacity: 0.05 
                }
    },
    {
        where: "Location LIKE 'PERDUE'",
        polygonOptions: {
        //fillColor: '#0000FF'
        fillOpacity:0.2
        } 
    },
    {
        where: "GeoBlock = 'AC1C'",
        polygonOptions: {
        //fillColor: '#0000FF'
        fillOpacity:0.8
        }
    },
    {
        where: "Location = 'BENGOUGH'",
        polygonOptions: {
        //fillColor: '#0000FF'
        fillOpacity:0.99
        }  
    }]
  });

  layer.setMap(map);

I've researched a bit to see if anyone else is having similar issues, and the closest thing that I've come across that is similar to the problem I am having is that it may be a cache issue with the browser, but I've tested this scenario with multiple machines at the same time and have been getting the same result and I've also added the no-cache tag to my code to prevent the browser from caching the styles. I'm not sure if this is an Api issue or something else. I will appreciate any suggestions on how to approach this problem.

Thanks,

解决方案

It's an API-issue, the tiles created to display the layers will also be cached by google.

What you can do: modify the queries, so that it still fetches the same results, but the String-representation for the query is different. This should speed-up the tile-update(and prevent from client-side caching).

Taking your code it could be done like this:

var and=' Location does not contain "'+new Date().getTime()+'"';

 layer = new google.maps.FusionTablesLayer({
    query: {
      select: "geometry",
      from: '11CIZUlNjBPiOM1Y4pDUP_Mn9TxkqF0etfpWhi5c',
      where: and
    },
    styles:[
    {
        polygonOptions:{
                fillColor: '#FF0000',         
                fillOpacity: 0.05 
                }
    },
    {
        where: "Location LIKE 'PERDUE' and "+and,
        polygonOptions: {
        //fillColor: '#0000FF'
        fillOpacity:0.2
        } 
    },
    {
        where: "GeoBlock = 'AC1C' and "+and,
        polygonOptions: {
        //fillColor: '#0000FF'
        fillOpacity:0.8
        }
    },
    {
        where: "Location = 'BENGOUGH' and "+and,
        polygonOptions: {
        //fillColor: '#0000FF'
        fillOpacity:0.99
        }  
    }]
  });

Instead of using new Date().getTime() I would suggest to use(when available) e.g. the timestamp of the last modification so that the cached tiles still may be used when no update has been done.

这篇关于表格更新后，Fusion Table api地图不显示样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！