How to draw only this part of the arc?

Question

Take a look at this picture:

I know p1, p2, and center, which are 2d points. I also know the angle p1-center-p2 and the radius r.

How can I draw only the filled part of the arc using the canvas' function arc()?

EDIT

What I really need to do is, given 2 points and an angle, draw a curved line between these 2 points such that p1-center-p2 angle is the given angle.

What I do is calculate the center and the radius of the circunference that has those 2 points in it and now I need to draw the line that joins p1 and p2 and has the given angle. This is my function to calculate the center of the circunference (which works properly)

function getCenter(v0x, v0y, v1x, v1y, curve) {
    // result = p0
    resx = parseFloat(v0x);
    resy = parseFloat(v0y);

    // tmpvec = (p1 - p0) * .5
    tmpx = (v1x - v0x) / 2;
    tmpy = (v1y - v0y) / 2;

    // result += tmpvec
    resx = resx + tmpx;
    resy = resy + tmpy;

    // rotate 90 tmpvec
    tmptmpx = tmpx;
    tmptmpy = tmpy;
    tmpy = -tmptmpx;
    tmpx = tmptmpy;

    // tmpvec *= 1/tan(c/2)
    tmpx *= 1/Math.tan(curve/2);
    tmpy *= 1/Math.tan(curve/2);

    // return res + tmpvec
    return [resx+tmpx, resy+tmpy];
}

Answer 1

The function atan2(y,x) is helpful for calculating the angle to points in a circle.

function drawArcPart(cx, cy, radius, p1x, p1y, angle) {

    var x = p1x - cx;
    var y = p1y - cy;

    var startAngle = Math.atan2(y,x);
    var endAngle = startAngle - angle;

    var ctx = document.getElementById('canvas').getContext('2d');
    ctx.fillStyle='black';
    ctx.beginPath();
    ctx.arc(cx, cy, radius, startAngle, endAngle, true);
    ctx.fill();
}

I have uploaded this JavaScript to jsFiddle, with an extension that also draws the points, and both your examples.