JavaScript pixel koordinatlarına dönüştürmek

Question

Kısaca, bir yazı tipi (boyut, ağırlık, vb.) Ve bir dize verilen bir pixel koordinatı sıralamasının, JavaScript kullanarak ilk harfe en sol üstten olup olmadığının bir yolu var mı? ?

E.g. I

[ 
[0,0], 
[0,1], 
... 
] 

Düzenleme hale gelebilir: Ben sınırlayıcı kutunun aramıyorum, daha doğrusu ben her koordinatları ve metni oluşturan her bireyin piksel için arıyorum. Metni daha sonra kareleri kullanarak yeniden oluşturmak için bu bilgilere ihtiyacım var.

Answer 1

Evet, text metrics elde etmek tuval eleman kullanabilirsiniz:

// setup canvas 
var c = document.createElement("canvas"), 
    ctx = c.getContext("2d"); 

// define (pre-loaded) font: 
ctx.font = "bold 16px sans-serif"; 

// get metrics 
var m = ctx.measureText("Hello"); 

ölçümlerini size genişlik ve yükseklik vb verecektir nesne Ama - Sadece genişlik şu anda en tarayıcılarda desteklenir. İhtiyacınız olan yükseliş ve iniş gibi şeyleri kapsayacak bir poly-fill10 var.

Metin alternatifleri dikdörtgeni algılamak için bitmap'i taramak bir alternatiftir.

Javascript Method to detect area of a PNG that is not transparent Ayrıca

, sadece metnin sınırlama kutusunu gerekiyorsa (metnin kendisinin değil piksel doğru başlangıç ​​noktası) bir DOM öğesini kullanabilirsiniz: Ben bu tekniği kapsayan burada bir cevap verdik Bu kutu için genişlik ve yükseklik elde etmek için. bitmap'ten piksel ayıklanması için ve noktaları bu dönüştürmek:

Use Javascript to get Maximum font size in canvas

açıklama sonrasında Güncelleme: Eğer bölünmüş kullanabileceğiniz bir dize ise

https://stackoverflow.com/a/30204783/1693593