20190615【充实计划】第1100期

昨日阅读1小时，累积阅读510小时

昨天阅读3小时，累计阅读2097小时

昨日阅读1小时，累计阅读249小时, 继续努力。

昨日阅读2小时，累计505小时

图形渐变

<linearGradient>标签设置，x1/y1 x2/y2设置渐变的开始和结束坐标。
<stop>设置渐变的颜色，可以有多个
offset属性用于设置渐变的位置，以百分比表示

<defs>

            <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
                 <stop offset="0%" style="stop-color: red; stop-opacity:1" />
                 <stop offset="100%" style="stop-color: blue; stop-opacity:1" />
             </linearGradient>
         </defs>
         <ellipse cx="200" cy="70" rx="85" ry="55" fill="url(#grad1)" />

使用<radialGradient>可以定义放射渐变

<defs>

            <radialGradient id="grad2" cx="20%" cy="30%" r="30%" fx="50%" fy="50%" >
                 <stop offset="0%" style="stop-color: red; stop-opacity:0" />
                 <stop offset="100%" style="stop-color: blue; stop-opacity:1" />
             </radialGradient>
         </defs>
         <ellipse cx="200" cy="70" rx="85" ry="55" fill="url(#grad2)" />

cx,cy和r设置最外层的圆心和半径；fx和fy设置最内层的圆

绘制自由路径

使用<svg>的<path>元素，可以绘制更加复杂的图形
<path id="svg_1" d="m127, 3851-1, -3412, -3115, -2717 ....>
d属性，可以包含多个连续的指令，用于绘制复杂图形
指令有m/L/H/V/A/C/S/Q/T/Z等

昨日阅读实践2小时，累计324.5小时.。。。

昨日阅读0.5小时，累计阅读124.5小时, 继续加油。

充实每一天 发表于 2019-6-15 06:43
微信扫描上方二维码“一起学习，共同进步”
为什么|学习笔记|好
芒格巴菲特所传授的多元思维学习法

20190615昨天阅读1小时累计阅读251小时。

充实每一天 发表于 2019-6-15 06:43
微信扫描上方二维码“一起学习，共同进步”
为什么|学习笔记|好
芒格巴菲特所传授的多元思维学习法

20190615昨天阅读1小时累计阅读107小时。

昨天阅读1小时，累计268小时

昨日阅读1小时，累计阅读457 小时, 努力再努力！