title: Mapbox GL JS some symbols missing on different zoom levels
body: <p>I am using the mapBoxGL version 1.0 JS library and I am using the clustered map functionality. But I noticed that on certain zoom levels, some of the symbols in a layer would disappear and it will then reappear again on other zoom levels. I cannot seem to figure out what is wrong with the configuration. I am enclosing the images and notice that the cluster total size also does not correspond to the total symbols.
  <a href="https://i.stack.imgur.com/VpRuu.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/VpRuu.jpg" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/30a0G.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/30a0G.jpg" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/8pF4P.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/8pF4P.jpg" alt="enter image description here"></a></p>
  
  <pre><code>map.addSource("dayplaces", {
      type: "geojson",
      // Point to GeoJSON data. This example visualizes all M1.0+ earthquakes
      // from 12/22/15 to 1/21/16 as logged by USGS' Earthquake hazards program.
      data: geojson,
      cluster: true,
      clusterMaxZoom: 12, // Max zoom to cluster points on
      clusterRadius: 50 // Radius of each cluster when clustering points (defaults to 50)
  });
  
  map.addLayer({
      id: "clusters",
      type: "circle",
      source: "dayplaces",
      filter: ["has", "point_count"],
      paint: {
          // Use step expressions (https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions-step)
          // with three steps to implement three types of circles:
          //   * Blue, 20px circles when point count is less than 100
          //   * Yellow, 30px circles when point count is between 100 and 750
          //   * Pink, 40px circles when point count is greater than or equal to 750
          "circle-color": [
              "step",
              ["get", "point_count"],
              "#51bbd6",
              100,
              "#f1f075",
              750,
              "#f28cb1"
          ],
          "circle-radius": [
              "step",
              ["get", "point_count"],
              20,
              100,
              30,
              750,
              40
          ]
      }
  });
  
  map.addLayer({
      id: "cluster-count",
      type: "symbol",
      source: "dayplaces",
      filter: ["has", "point_count"],
      layout: {
          "text-field": "{point_count_abbreviated}",
          "text-font": ["Open Sans Semibold"],
          "text-size": 12,
          "text-allow-overlap": true
      }
  });
  
  // https://svgtopng.com/
  // https://www.flaticon.com/free-icon/map-marker_34468
  map.loadImage('https://cdn.glitch.com/0a178325-3429-4356-9e0e-c6aed80fea14%2F34468green.png?v=1560084647010', function(error, image) {
      if (!error) {
          map.addImage('pin', image);
          map.addLayer({
              id: "unclustered-point",
              type: "symbol",
              source: "dayplaces",
              filter: ["!", ["has", "point_count"]],
              "layout": {
                  "visibility": "visible",
                  "icon-image": "pin",
                  "icon-size": 0.08,
                  "icon-allow-overlap": true,
                  "text-field": ["get", "order"],
                  "text-font": ["Open Sans Semibold"],
                  "text-allow-overlap": true,
                  "text-size": 11,
                  "text-offset": [0, 0.2],
                  "text-anchor": "bottom"
              }
          });
      } else {
          console.log("MAP LOAD IMAGE ERROR:" + error);
      }
  
  });
  
  
  
  // inspect a cluster on click
  map.on('click', 'clusters', function(e) {
      var features = map.queryRenderedFeatures(e.point, {
          layers: ['clusters']
      });
      var clusterId = features[0].properties.cluster_id;
      map.getSource('dayplaces').getClusterExpansionZoom(clusterId, function(err, zoom) {
          if (err)
              return;
  
          map.easeTo({
              center: features[0].geometry.coordinates,
              zoom: zoom
          });
      });
  });
  </code></pre>