Comments (6)
See
It works quite quickly, basic js and svg :
- Pastebin for code : https://jsfiddle.net/dhuh6h6o/2/
- Run it online : https://runkit.com/npm/text-to-svg
I used absolute positioning and text-anchor
but translation()
could be nice as well.
We could do vertical text as well.
Key methods of the module are the following :
const textToSVG = TextToSVG.loadSync(); // load default font
const textToSVG = TextToSVG.loadSync('/fonts/Noto-Sans.otf'); // local custom font
.getD(text, options = {}) : Get the path data for d attribute of path.
.getPath(text, options = {}) : Get the path element of SVG.
.getSVG(text, options = {}) : Get the SVG.
from ruby-font-creator.
text-to-svg
seems a straight-forward solution to position and add rotation:
const TextToSVG = require('text-to-svg');
const textToSVG = TextToSVG.loadSync();
const attributes = {fill: 'red', stroke: 'black'};
const options = {x: 0, y: 0, fontSize: 72, anchor: 'top', attributes: attributes};
const svg = textToSVG.getSVG('hello', options);
console.log(svg);
from ruby-font-creator.
I pushed some tests I had written.
from ruby-font-creator.
Please add a ./fonts/ directory and your base open font to the repository.
I would like to give it a try this weekend, at least to output nice svg with balanced, etlegant sinograms and phonetic.
from ruby-font-creator.
Solved.
Check out branch hugo
: https://github.com/edouard-lopez/Hanzi-Pinyin-Font/tree/hugo
from ruby-font-creator.
Thanks I improved the method annotation()
to use like you
from ruby-font-creator.
Related Issues (20)
- Reorganize projects roles, naming, repositories HOT 2
- Spread the word to chinese.stackexchange HOT 1
- Associate glyph with correct codepoint HOT 4
- Error: Invalid code point NaN
- JavaScript heap out of memory: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed
- Error at start HOT 1
- Data duplicates crash the script HOT 2
- Renaming repo → update remote URL HOT 3
- How to add the font on mobile device?
- Include Google's Noto Serif CJK as default font ? HOT 3
- Support different fonts for glyph and it's ruby text HOT 2
- Opentype.js fails to render Noto fonts HOT 2
- Spread the word about Tifinagh-font HOT 3
- Version tarballs for inclusion in Linux HOT 1
- Split font to be used with unicode-range
- add Chinese font to wikipedia List of CJK fonts
- Read about chinese font fundamental HOT 2
- JB Pinyin
- Todo: Tifinagh Arabic and IPA dataset
- Adding Jyutping (粵拼) HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ruby-font-creator.