fogleman / gg

Go Graphics - 2D rendering in Go with a simple API.
https://godoc.org/github.com/fogleman/gg
MIT License
4.34k stars 352 forks source link

Font render issue (transparent cross sections) in some fonts #153

Open bauer00 opened 2 years ago

bauer00 commented 2 years ago

I'm currently using the Google Font "Inter" (https://fonts.google.com/specimen/Inter) and when I draw a text onto an image with that font, some letters with cross sections, like "f" or "t" are rendered transparent in this cross section. I also use the latest version of "gg", 1.3.0.

It looks like this: grafik

This is the code I've executed to generate the image above (I've used examples/text.go and changed it a little bit):

const W = 1024
const H = 512
dc := gg.NewContext(W, H)
dc.SetRGB(1, 1, 1)
dc.Clear()
dc.SetRGB(0, 0, 0)
if err := dc.LoadFontFace("../resources/fonts/Inter-SemiBold.ttf", 50); err != nil {
    panic(err)
}
dc.DrawStringAnchored("ABCDEFGHIJKLMNOPQRSTUVWXYZ", W/2, H/2-50, 0.5, 0.5)
dc.DrawStringAnchored("abcdefghijklmnopqrstuvwxyz", W/2, H/2+50, 0.5, 0.5)
dc.SavePNG("out.png")

Do I need to load the font differently? Or use different settings to draw the text? Or is it an actual render bug withing the gg package?

Thanks for your help.

EQuimper commented 2 years ago

Same issue for me and this is not the same font

image
whitnelson commented 1 year ago

I'm also having the same issue with a handful of Google fonts. Here is Quicksand:

image-2

oneart-dev commented 1 year ago

Same with Inter font (google fonts), any solutions?

Screenshot 2022-09-16 at 15 16 28
oneart-dev commented 1 year ago

The solution is to download font from other sources. I used https://rsms.me/inter/ and it works fine. The font file size is twice, so i guess google optimizing font for web quite heavily.

guptaaansh commented 9 months ago

Is there a concrete solution for this, facing this issue and can not get higher quality fonts as this is a custom font.

timfanda35 commented 7 months ago

I found a solution here: https://www.reddit.com/r/golang/comments/14ldjiu/problems_with_drawing_fonts_onto_an_image/

Use https://github.com/goki/freetype to load font instead of using https://github.com/golang/freetype.


import (
    "github.com/goki/freetype"
    "github.com/goki/freetype/truetype"
        ...
)

// Load font with goki freetype
func loadFontFace(path string) font.Face {
    var fontBytes []byte
    fontBytes, err := os.ReadFile(FontPath)
    if err != nil {
        panic(err)
    }
    font, err := freetype.ParseFont(fontBytes)
    if err != nil {
        panic(err)
    }

    face := truetype.NewFace(font, &truetype.Options{
        Size: 72,
    })

    return face
}

Before

dc. LoadFontFace("NotoSansTC-Black.ttf", 72)

before

After

face := loadFontFace("NotoSansTC-Black.ttf")
dc.SetFontFace(face)

after