Strange black color on overlap points

[vutle]

Thanks for this fast tenderer.

I'm trying to draw points with different colors, but if points are overlapping, it is shown as black. What would be the cause? Is it due to z-index or any other settings that can be applied to fix this? I'm using version 2.1.

Even set to one color, it still shown black on overlapping points.

I'm using Leaflet mapbox map with this settings:

var map  = new L.map('map1', {preferCanvas: true, attributionControl: false,  zoomSnap: 0.05 }).setView([-37.8094002219, 144.96645965059108], 13.2);
    L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
      attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
      maxZoom: 20,
      updateWhenZooming: false,
     id: 'mapbox/streets-v11',
     id: 'mapbox/dark-v10',
     tileSize: 512,
     zoomOffset: -1,
      accessToken: 'xxxxxxx'
  }).addTo(map);

My code is:

var colors = [{r:0.xx, g:0.xx, b:1.0},....]
 var clrs = function(index, point) { return colors[index]; };
 glifyPoints = L.glify.points({
          map: map,
          color:  clrs,   //{ r: 1, g: 1, b: 0, a: 0.5 },
          data:   data
            size: 5,
          });

[vutle]

Looks like turn on hardware acceleration on the browser help to solve this issue.