svg動畫:講解平穿及折連字形

尹規•構字符

在尹規中,平穿指帶横字元横向貫穿另一個字形。

「孑孓必本」也屬於平穿。

尹規使用&作為平穿構字符,例如:

  • 丹:冂&亠
  • 孑:㇇-亅&㇀

官方依據

尹規講到取碼方法時,說取碼要分横向和縱向:

  • 横向:縱貫,横截
  • 縱向:平穿,分斷

倉三手冊寫:

(1994年《(增訂版)倉頡第三代中文字母輸入法》第三章第三節〈字形特徵原則〉註二 wrote)雖然我們言明儘量不取重疊字形,但為了方便,也為了簡化取碼數,並不禁止縱向筆劃及橫向筆劃貫穿其他字形。

動畫如何製作

查到那個path元素的id之後,加入以下代碼到<svg>裏:

<script>
var pathkk = document.getElementById("1507");
alert(pathkk);
var length = pathkk.getTotalLength();
alert(length);
</script>

拿到該path的長度,之後加入屬性:

stroke-dashoffset="284.7"

就可以用以下代碼實現手寫動畫:

<animate attributeName="stroke-dasharray" values="284.7;569.4;569.4" repeatCount="indefinite" begin="3.5s" dur="7s" />

動畫講解「折連字形」

Leave a Comment