mbilbille / dmak Goto Github PK
View Code? Open in Web Editor NEWDraw your Japanese writings with a bit of JS and CSS
Home Page: http://mbilbille.github.io/dmak
License: MIT License
Draw your Japanese writings with a bit of JS and CSS
Home Page: http://mbilbille.github.io/dmak
License: MIT License
The changes are at https://github.com/Akeru/dmak/tree/stroke-number-display. Will send a pull request when the 1st one is closed.
As pointed out by @konqi the actual structure of dmak.js
does not allow to have several instance of Dmak in parallel.
Here is a first try to make it works: https://github.com/konqi/dmak/commit/6d15724ab7883dc0b0285a844e1f147def09f281 but it makes helpers public which is not great.
Should include a dependency on Raphael library
https://github.com/DmitryBaranovskiy/raphael/blob/master/bower.json
bower register dmak git://github.com/mbilbille/dmak.git
It might be cool to have reverse drawing as well, no?
http://jsfiddle.net/beebs93/2QjY9/
Based on the same technique used by @jakearchibald
All is in the title ; should erase both order + stroke.
๐ Hey there! Great project.
I'd like to request a new feature where the kanji can start in an already-drawn, fully completed form.
Right now, the character/canvas starts empty and draws the kanji stroke by stroke. However, I would like to be able to show it in completed form, so I can use buttons/controls below the character to redraw and/or navigate through the stroke order.
For my use-case, the user would have to wait for the kanji to be fully drawn, which is slower and visually quite busy. Displaying it completed with the stroke order, but having the flexibility to re-draw and navigate through the strokes is what I'm after.
Thank you!
I have read something in pull requests. I tried to use it in Anki, but I failed. I don't know why. Could you tell me If your script is working in Anki?
Speed loading time
Test case: ใใใ
Only load ใ
VG data once
(if you'd like ๐ )
The really interesting part of KanjiVG data is the grouping of strokes and the kvg:element attribute.
Kanjis are often built upon (parts) of others. ็ท is composed of ็ณธ and ๆณ, which is composed of ๆฐด and ็ฝ which is composed of ๆฅ and a stroke. Using the information while learning kanjis can be a real time saver.
The old viewer of KanjiVG tries to show this information using the group coloring feature but is is not very user friendly and buggy : it shows 2 colors for ้ป while there should be three (the lower curve is not part of anything) and clicking through the kanji components is cumbersome.
So, if you feel like it maybe you could come up with some nicer way to display this hierarchy.
I love this project. I wanted to extend this project to my language Tamil
.
Is it configurable to other languages?
hi. pardon my lack of experience in javascript, how can i make it so that when a user clicks on the Dmak cell it redraws the kanji from 0?
Suggested by @boberman here https://twitter.com/tangorin/status/474534212595245056 i order to minimize storage and maximize loading time.
Sample: convert 0672c.svg
:
<path id="kvg:0672c-s1" kvg:type="ใ" d="M20.5,33.5c1.93,0.62,4.91,1.07,8.1,0.75C42.43,32.88,66,30.75,79.64,30c3.2-0.18,7.22,0.25,9.23,0.5"/>
into:
stroke = {
groups: [ 'kvg:0672c-s1 ' ],
path: "M20.5,33.5c1.93,0.62,4.91,1.07,8.1,0.75C42.43,32.88,66,30.75,79.64,30c3.2-0.18,7.22,0.25,9.23,0.5",
text: {
value: 1,
x: 13.50,
y: 34.50
}
};
TO TRY: to put all of this data into one single unique file
Display the space character as a small gap between 2 kanji boxes.
Is it necessary to have Dmak.js on a live server? I am trying to run it on my dev box but I keep getting 404s. Can I optionally host all the kanji svg on my box and teach Dmak the directory? I think that would be faster that requesting the resources outside the home server.
I've created a branch with initial support for drawing animations under IE. I did not submit a PR because this is mostly a proof of concept. It works although it is lacking some feature (reverse drawing mainly). You might want to review Akeru@9b99e40
Note : jQuery is a had dependency for this to work.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.