How do I create random dots concentrated in a particular area in JS?

Need some conceptual help here. Currently, I have a random-dot function that creates two sets of dots (orange and blue) that spread out over a canvas. But I'm looking for a way to concentrate the dot density in random areas around the screen.

The code looks essentially like this:

var createBlueDots = function () {
       for (var i = 0; i <=someRandomNum; i++) {
        context.beginPath();
        var rand_x = Math.random(i) * horz_max;
        var rand_y = Math.random(i) * vertical_max;
        context.arc(rand_x, rand_y, radius, 1, 2*Math.PI);
        context.fillStyle ="#0855A2";
        context.fill();
        context.closePath();   
        }
    }
createBlueDots();

... which when combined with another OrangeDot function creates something like this:

... but how do I create a series of dots that is concentrated around one or several areas of the screen? Something more like this?

Even just conceptual tips would be appreciated. Thank you.