ctx.createRadialGradient(xStart,yStart,radiusStart,xEnd,yEnd,radiusEnd)

    xStart:发散开始圆心x坐标
    yStart:发散开始圆心y坐标
    radiusStart:发散开始圆的半径
    xEnd:发散结束圆心的x坐标
    yEnd:发散结束圆心的y坐标
    radiusEnd:发散结束圆的半径

    径向渐变较为复杂,以下通过辅助线演示各种情况下径向渐变的实际效果

    1. 填充图形为两个圆心连线上找到一点p,使得直线pa与pb分别与两圆相切,则圆弧apb与填充的容器相交的区域即为最终填充效果。

      1.1. 渐变图形与两个圆心半径有关

      1.2. 绘制的最终效果与渐变和图形有关

    2. createRadialGradient画一个正常的圆球效果,应遵循以下几点:

      2.1. createRadialGradient()方法中,起始圆半径小于结束圆半径

      2.2. 起始圆完全在终止圆的范围内

      2.3. 终止圆在绘制区域内