多邊形指出字母

對於給定的字體和給定的字符串，如何在JavaScript中使用下面的圖片獲取像這樣的多邊形點？多邊形指出字母

alt text

（我知道對SO有關的問題，但它們對於Python或其他語言/環境;我想的JavaScript唯一的解決方案，如果可能的話）

編輯：隨訪@羅馬人答案：

使用typeface.js在線工具，我將TrueType字體轉換爲typeface.js格式。每個字母表示與此類似：（這裏是信d的表示）

"d": { 
     "x_min": 135.640625, 
     "x_max": 792.171875, 
     "ha": 928, 
     "o": "m 135 998 l 330 998 q 792 499 763 933 q 330 0 763 65 l 135 0 l 135 998 m 330 151 q 648 499 635 211 q 330 846 635 786 l 287 846 l 287 151 l 330 151 " 
    },

typeface.js碼的呈現基於此格式的信件的關鍵部分是：

switch(action) { 
    case 'm': 
     ctx.moveTo(outline[i++], outline[i++]); 
     break; 
    case 'l': 
     ctx.lineTo(outline[i++], outline[i++]); 
     break; 
    case 'q': 
     var cpx = outline[i++]; 
     var cpy = outline[i++]; 
     ctx.quadraticCurveTo(outline[i++], outline[i++], cpx, cpy); 
     break; 
    case 'b': 
     var x = outline[i++]; 
     var y = outline[i++]; 
     ctx.bezierCurveTo(outline[i++], outline[i++], outline[i++], outline[i++], x, y); 
     break; 
}

來源

2014-02-05 VividD

您可能需要寫一個畫布，然後使用一些算法（您可能可以借用另一種語言）計算，基於畫布的像素 –

有些工作已經完成了typeface.js，這是一個用「canvas rendered one」替換普通文本的JavaScript庫（因此您可以使用任意字體）。

typeface.js通過使用字體定義數據來實現這一點，該字體定義數據基本上保存每個字形的繪圖指令。字形「A」的數據可能如下所示：

m 253 638 l 379 949 q 394 945 387 946 q 409 944 401 944 q 443 949 428 944 
q 565 629 525 733 q 673 359 605 526 q 822 0 740 192 q 773 3 804 0 q 736 7 
743 7 q 686 4 709 7 q 650 0 664 1 q 588 199 609 137 q 532 355 567 261 l 
370 355 l 210 355 l 159 205 q 127 110 142 161 q 99 0 112 59 l 43 6 q 6 3 
20 6 q -14 0 -8 0 q 74 211 29 105 q 155 403 119 317 q 253 638 191 490 m 
370 422 l 502 422 l 371 760 l 240 422 l 370 422

（我插入了換行符）。

該字符串是一系列繪圖操作及其各自的數字參數。例如，「m 253 638」對應於「move to x：253 y：638」和「l 379 949」是「draw line to x：379 y：949」。等等，等等。

你應該看看這裏來源： http://bazaar.launchpad.net/~davidchester/typeface.js/trunk/view/head:/js/typeface.js

你能適應該渲染器提取您的poligons。這裏的主要技巧是讓this page爲你做出努力並創建字體定義。

來源

2014-02-05 12:48:53 Roman

很好的答案！讓我看看該庫... – VividD

我將感興趣的一種字體轉換爲typeface.js格式。讓我們來看看typeface.js如何繪製字母...... – VividD

多邊形指出字母

回答

相關問題