[CSS100] Day 05 Statistic
Cathy P
 2021-03-14 22:01:10      

Statistic Demo

See the Pen CSS100Days 005 by Cathy (@smile25896) on CodePen.

這次的題目使用svg畫了折線圖，折線圖上的點透過絕對定位固定位置。

學習重點

  1. 折線圖製作

html部分，使用了svg中的polyline（折線），指定每個點的x,y位置，可以畫出連續的直線。

1
2
3
<svg>
  <polyline points="9,46 50,12 90,23 130,11 171,38 211,48 251,19"></polyline>
</svg>