Kumirei
October 25, 2020, 5:33pm
#1
This is a fork of the original Stroke Order script which has recently started having a few issues. The original author @looki does not seem to be around anymore, so with a fix from @killergerbah I will take up maintenance of this script. Unless of course @looki comes back and is against it.
Stroke Order Diagram
Inserts stroke order diagrams from Jisho into reviews, lessons, and kanji pages.
Available at
WaniKani Stroke Order
53 Likes
Thanks. I’ve installed it in Safari 14 but I just get an empty element and the when I inspect the HTML it says:
<svg id="stroke_order">Error while loading diagram</svg>
Any ideas?
1 Like
Kumirei
October 25, 2020, 5:53pm
#3
Hmm. Did it as you for cross origin permission?
I noticed in the previous thread some have reported a problem that occurs in Safari specifically. Sharing this in case it fixes the problem for you. [Unsupported] [Userscript] Stroke Order Diagram - #92 by Raven_shp
2 Likes
Yeah, and I hit ‘always allow domains’.
1 Like
Thanks I’ll try that. Will update shortly.
1 Like
Yep, that worked. Thanks!
For anyone else using Safari the change I made was this for the new script:
url: new URL(JISHO + "/search/" + getKanji() + "%20%23kanji"),
2 Likes
Since this fixes the problem in Safari and doesn’t break the script in Chrome (just tried it), seems like we should get this into greasy fork @Kumirei
2 Likes
Kumirei
October 25, 2020, 6:02pm
#9
Already on it! Seems like there are two places that I need to change it in, though
edit: updated
4 Likes
Just grabbed the update and still looks good. Thanks a lot for updating this!
1 Like
Kumirei
October 25, 2020, 6:05pm
#11
Thank @killergerbah , they are the one who fixed it. I’m just accepting the responsibility for the future
3 Likes
You are trying to tempt me to use scripts. I will not give in. You can’t seduce me with your sultry DOM manipulation.
5 Likes
@Kumirei I have an improvement to prevent diagrams from overflowing horizontally. These styles were copied from Jisho. Below is the suggested change.
var sectionHTML = '<section><h2>Stroke Order</h2><div style="width:100%;overflow-x: auto; overflow-y: hidden"><svg id="stroke_order"></svg></div></section>';
3 Likes
Kumirei
October 27, 2020, 1:31am
#15
Updated! I also took the opportunity to wrap the script in an anonymous function to keep it out of the global scope
4 Likes
Murphy
October 31, 2020, 11:51am
#16
I’ve been using this script for one year now and it has become a staple in my Wanikani experience. Thank you for making this script!
2 Likes
riiibu
October 31, 2020, 1:31pm
#17
sometimes when i start a new batch of lessons, the first item will have two stroke order diagrams overlapping like in the images below. it’s always the diagram of the current kanji, as well as another of the batch’s kanji. not sure if this was true for the previous time i saw this, but i did have the re-order script set to re-order the lesson items this time, so maybe it has something to do with that? anyone else have this problem or is it just me?
4 Likes
Kumirei
October 31, 2020, 2:13pm
#18
I know you posted earlier so you probably do, but just to confirm, you have the newest version?
2 Likes
riiibu
October 31, 2020, 3:17pm
#19
i think so! i’m running version 1.1.5
2 Likes
Kumirei
October 31, 2020, 3:18pm
#20
Alight, thanks. I don’t have any lessons, but I will see if I can either find the issue in the code or replicate it in reviews when I get the time
2 Likes