Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/joomla/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 我的融合表不会按照我希望的方式设计样式,即使我遵循了融合表示例代码。我做错了什么?_Javascript_Google Fusion Tables - Fatal编程技术网

Javascript 我的融合表不会按照我希望的方式设计样式,即使我遵循了融合表示例代码。我做错了什么?

Javascript 我的融合表不会按照我希望的方式设计样式,即使我遵循了融合表示例代码。我做错了什么?,javascript,google-fusion-tables,Javascript,Google Fusion Tables,我试图控制我的地图的颜色,但它似乎不起作用 我跟着,但没用。我的代码如下。尝试设置地图样式从第132行开始。这些评论对我来说只是一个有用的提示,因为我刚刚涉足JavaScript和Fusion Tables API <!DOCTYPE html> <html> <head> <style> #map-canvas { width:800px; height:600px; } </style> <sc

我试图控制我的地图的颜色,但它似乎不起作用

我跟着,但没用。我的代码如下。尝试设置地图样式从第132行开始。这些评论对我来说只是一个有用的提示,因为我刚刚涉足JavaScript和Fusion Tables API

    <!DOCTYPE html>
<html>
  <head>
  <style>
    #map-canvas { width:800px; height:600px; }
  </style>
  <script type="text/javascript"
    src="http://maps.google.com/maps/api/js?sensor=false">
  </script>
  <script type="text/javascript">
    var map;
    var layer;

     var cz = {
    center: new google.maps.LatLng(40, -95),
        zoom: 4 
     };

     var locationColumn = 'geometry';
     var tableRegion = 4437529;

     var mapStyle = [
        {
          featureType: 'all',
          elementType: 'all',
          stylers: [
            { saturation: 99 }
          ]
        },
        {
          featureType: 'road.highway',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'road.arterial',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'road.local',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'administrative.country',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'administrative.locality',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'administrative.neighborhood',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'administrative.land_parcel',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'poi',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        },
        {
          featureType: 'transit',
          elementType: 'all',
          stylers: [
            { visibility: 'off' }
          ]
        }
      ];

     var map_options = {
      center: cz["center"], //Accesses the 'center' property of the 'cz' object
      zoom: cz["zoom"], //Accesses the 'zoom' property of the 'cz' object
      mapTypeId: google.maps.MapTypeId.ROADMAP, //Type of map.
      zoomControlOptions: { //control options for the 'zoom' action of Google Maps
        style: google.maps.ZoomControlStyle.SMALL, //Makes the zoom function on the upper-left-side of Google Maps small -- instead of a scale-like thing, it's just a plus and minus
        position: google.maps.ControlPosition.LEFT_CENTER //Puts Zoom function center-left
      },
      streetViewControl: false, //Turns off Street View option
      panControl: false, //turns off the circular pan button in nupper-left
      mapTypeControl: false //Turns off 'MAP/SATELLITE' option in upper-right
    }; 

     var locationQuery = {
      select: locationColumn,
          from: tableRegion
     };


     function initialize() {
      //new Google Map with the 'map_options' 
      map = new google.maps.Map(document.getElementById('map-canvas'), map_options);

      //Styles the map so it removes roads, saturates things, etc. See 'mapStyle'
      var style = mapStyle;
      var styledMapType = new google.maps.StyledMapType(style, {
        map: map,
        name: 'Styled Map'
      });
      map.mapTypes.set('map-style', styledMapType);
      map.setMapTypeId('map-style'); 

      //Makes the Fusion Tables layer, querying the polygon location info
      layer = new google.maps.FusionTablesLayer({
        query: locationQuery,

    //Here's where I try setting the colors and conditions for my map. Doesn't work.
    styles: [{
      polygonOptions: {
        fillColor: "#FFFFFF",
        fillOpacity: 0.5
      }
    },{
      where: "price > 200",
      polygonOptions: {
        fillColor: "#FFFF00",
        fillOpacity: 0.5
      }
    }]
      });
      layer.setMap(map);
    }
    google.maps.event.addDomListener(window, 'load', initialize);
  </script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>

你还没有说明你的确切问题是什么,只是它不起作用。不是很有帮助。所以我猜。 你的地图对我很有用。没问题。尝试在下面的代码中设置fillOpacity:1,以查看它是否正常工作。通过使用.5,您可以允许底图颜色与FT层颜色混合

styles: [{
      polygonOptions: {
        fillColor: "#FFFFFF",
        fillOpacity: 0.5
      }
    },{
      where: "price > 200",
      polygonOptions: {
        fillColor: "#FFFF00",
        fillOpacity: 0.5
      }
    }]

熔丝可能有问题。当我尝试在本地运行它时,它对我也不起作用。我得到了带有可怕数据的互动程序,可能仍在加载、拖动或刷新页面,以发现,当我最终找到它时,它起了作用,但它在本地也起了作用。

啊,我现在明白我的问题是多么混乱和模糊。我应该说地图不会加载。对此我深表歉意。真有趣。在我发布这个问题的那天晚上,我请几个朋友试用这个代码。他们还报告说,只有数据可能仍在加载。然而,我只是在另一台机器上尝试了这段代码,它成功了。