Permalink
Browse files

Play with rendering a TrueType font to a CanvasRenderingContext2D (in…

… browser).
  • Loading branch information...
dmitshur committed Jan 8, 2018
1 parent 3664bd9 commit 51fe0152594c90a86a1920e8437dc0cd7f4fdc70
Showing with 89 additions and 12 deletions.
  1. +15 −12 235/main.go
  2. +10 −0 236/index.html
  3. +64 −0 236/main.go
View
@@ -15,21 +15,22 @@ import (
)
func main() {
err := run()
err := run(1000, 1000)
if err != nil {
log.Fatalln(err)
}
}
func run() error {
//f, err := sfnt.Parse(goregular.TTF)
//if err != nil {
// return err
//}
//face, err := opentype.NewFace(f, nil)
//if err != nil {
// return err
//}
func run(width, height int) error {
// Load font from TTF data.
/*f, err := sfnt.Parse(goregular.TTF)
if err != nil {
return err
}
face, err := opentype.NewFace(f, nil)
if err != nil {
return err
}*/
f, err := truetype.Parse(goregular.TTF)
if err != nil {
return err
@@ -40,16 +41,18 @@ func run() error {
//Hinting: font.HintingVertical,
})
m := image.NewNRGBA(image.Rect(0, 0, 1000, 1000))
m := image.NewNRGBA(image.Rect(0, 0, width, height))
// Draw text on image.
fd := font.Drawer{
Dst: m,
Src: image.Black,
Face: face,
Dot: fixed.P(100, 900),
Dot: fixed.P(100, height-100),
}
fd.DrawString("Hello.")
// Output image to a PNG file.
var buf bytes.Buffer
err = png.Encode(&buf, m)
if err != nil {
View
@@ -0,0 +1,10 @@
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<script src="236.js"></script>
</head>
<body style="margin: 0">
<canvas id="canvas" style="background-color: rgb(227, 189, 162);"></canvas>
</body>
</html>
View
@@ -0,0 +1,64 @@
// Play with rendering a TrueType font to a CanvasRenderingContext2D (in browser).
package main
import (
"fmt"
"image"
"log"
"github.com/golang/freetype/truetype"
"github.com/gopherjs/gopherjs/js"
"golang.org/x/image/font"
"golang.org/x/image/font/gofont/goregular"
"golang.org/x/image/math/fixed"
"honnef.co/go/js/dom"
)
var document = dom.GetWindow().Document().(dom.HTMLDocument)
func main() {
document.AddEventListener("DOMContentLoaded", false, func(dom.Event) {
var (
canvas = document.GetElementByID("canvas").(*dom.HTMLCanvasElement)
width, height = dom.GetWindow().InnerWidth(), dom.GetWindow().InnerHeight()
dpr = js.Global.Get("devicePixelRatio").Float()
)
canvas.Width = int(float64(width)*dpr + 0.5) // Nearest non-negative int.
canvas.Height = int(float64(height)*dpr + 0.5) // Nearest non-negative int.
canvas.Style().SetProperty("width", fmt.Sprintf("%vpx", width), "")
canvas.Style().SetProperty("height", fmt.Sprintf("%vpx", height), "")
err := paint(canvas.GetContext2d(), canvas.Width, canvas.Height, int(dpr))
if err != nil {
log.Println(err)
}
})
}
func paint(ctx *dom.CanvasRenderingContext2D, width, height, scale int) error {
// Load font from TTF data.
f, err := truetype.Parse(goregular.TTF)
if err != nil {
return err
}
face := truetype.NewFace(f, &truetype.Options{
Size: 300,
DPI: 72 * float64(scale),
//Hinting: font.HintingVertical,
})
m := ctx.CreateImageData(width, height)
// Draw text on image.
fd := font.Drawer{
Dst: m,
Src: image.Black,
Face: face,
Dot: fixed.P(100*scale, height-100*scale),
}
fd.DrawString("Hello.")
// Output image to a context.
ctx.PutImageData(m, 0, 0)
return nil
}

0 comments on commit 51fe015

Please sign in to comment.