[Userscript] Replace kanji view with hanzi-writer instance

:warning: This is a third-party script/app and is not created by the WaniKani team. By using this, you understand that it can stop working at any time or be discontinued indefinitely.

This userscript requires the wanikani open framework. Directions to install are found here: Installing Wanikani Open Framework

User script link: Wanikani hanzi-writer addition

I made a quick userscript to embed GitHub - chanind/hanzi-writer: Chinese character stroke order animations and practice quizzes into Wanikani to replace the kanji view in reviews in order to help myself learn stroke order. It can both ‘quiz’ you on the stroke order of the kanji, and animate it. I originally made this for myself, specifically to use on a tablet, and as such I have not tested this on different setups (私は プログラマー じゃない). That said, it should have most of the features it needs, though I would like to add it to the kanji lessons at some point. If anyone wishes to expand on the code or report a bug, I would much appreciate it. Here is the github link for anyone interested.

I believe these gifs explains the functionality of this better than my words can.
scriptexample
scriptexample2

3 Likes

0.0.1 is a hotfix due to an error with handling the single page application shenanigans. It should? work now.

That looks cool! My main concern is that it’s called “hanzi” writer and for some components there are differences between the Chinese and Japanese strike order. Are you sure that it works fine for characters like 直, 骨, 海 or kokuji like 枠 or 込 for instance?

2 Likes

I’ll have to test with the instances you showed. I’m using the data from GitHub - chanind/hanzi-writer-data-jp: The data used by Hanzi Writer for Japanese so hopefully it will since it is supposed to be Japanese data, but I’ll double check with a different setup using the same library to be certain. I’ll update this comment when I have finished testing.

Edit: Here is the script I used to test these: A simple html script to test whether kanji in the dataset work. · GitHub. There is an array in the script tag which can be changed to test different kanji. One of the kanji you showed was 海, which has a different kyujitai and shinjitai form, which are terms I haven’t heard of before, but from my understanding it means that they were changed relatively recently. It shouldn’t pose too much of an issue, but I would recommend testing other versions and seeing. I’ll also see if I can make sure it doesn’t completely error when the kanji can’t be found, which I worry it will. Aside from that, I cannot see any obvious errors, but let me know if there is any. I can probably make a blacklist for which kanji don’t work well.
testscript

2 Likes

Released version 0.0.2. I refactored the code, but aside from that it should be mostly the same.

Kyuujitai and shinjitai are like traditional/simplified characters in Chinese. You can still find some kyuujitai relatively often in some contexts (龍, the traditional form of 竜 is even taught in WaniKani). That said you probably want to learn the shinjitai forms first because they’re the ones used in modern standard Japanese.

As far as I know the main source for Japanese stroke diagrams online is kanjivg: Viewer - KanjiVG

Since it specifically targets Japanese you can see that it draws 海 as expected.

This may be nitpicking though, depending on your objectives.

2 Likes

Didn’t realize how powerful the open wanikani framework was, so after messing around far too long with my own implementation, I’ve switched the script to use that, added a settings menu with it, and fixed a bug or two while I was at it, so v0.0.3.

1 Like