Given: a width, a height, and a set of sets of points. Output: An image where each set of points is connected and colored in (like a shape). Each shape must be a different color from all of the other shapes, but the actual color doesn't matter as long as each color is distinct. The shapes must be in order; whether you start at the end or the beginning of the set doesn't matter, though. The dots must be connected in the order they're given in the set.
Output formats are in accordance with standard image rules.
Examples
//the code here has nothing to do with the actual challenge and just shows examples document.getElementById("one").getContext("2d").fillRect(0, 0, 300, 300) const ctx = document.getElementById("two").getContext("2d") ctx.fillStyle = "black" ctx.beginPath();ctx.moveTo(0,0);ctx.lineTo(0,300);ctx.lineTo(300,0);ctx.closePath();ctx.fill() ctx.fillStyle = "lime" ctx.beginPath();ctx.moveTo(200,0);ctx.lineTo(600,0);ctx.lineTo(300,300);ctx.closePath();ctx.fill()canvas {border: 1px dotted black}<pre>Width: 500, Height: 500, Set: [[[0, 0], [0, 300], [300, 300], [300, 0]]]</pre> <canvas id="one" width="500" height="500"></canvas> <pre>Width: 600, Height: 300, Set: [ [[0,0], [0,300], [300,0]], [[200,0], [600,0], [300,300]] ]</pre> <canvas id="two" width="600" height="300"></canvas>Scoring is code-golf.
#000000different to#000001? \$\endgroup\$