svgの色は変更しますが、一度に1つのポリゴンのみを変更します

Question

一度に1つのポリゴンを色に変更しようとしています。今のところ、2つ以上のポリゴンが同時に色を変更しています。どんな助力も非常に高く評価されます。ここ

フィドル：https://jsfiddle.net/xamonix/6em7qxx3/9/

スクリプト：

setInterval(function() { 
jQuery(".st0").each(function(i) { 
    var colors = ['#b30000', '#990000', '#800000', '#660000']; 
    (this).style.fill = colors[Math.floor(Math.random() * colors.length)]; 
}); 

}、1000）;

Answer 1

実際、すべてに新しい色が割り当てられます。しかし、色が4色しかないので、確率の規則では、ポリゴンの25％で新しいものは古いものと同じになります。

ポリゴンを1つだけ選択する場合は、それぞれを選択しないでください。

var polygons = jQuery(".st0"); 
var colors = ['#b30000', '#990000', '#800000', '#660000']; 

setInterval(function() { 
    var el = polygons[Math.floor(Math.random() * polygons.length)]; 
    el.style.fill = colors[Math.floor(Math.random() * colors.length)]; 
}, 1000);