캔버스에 텍스트를 그리는 중입니다. 문제는 ctx.font = font가 완전히 무시되고 기본값이 10px sans-serif로 설정됩니다. 내 기능은 다음과 같습니다.명시 적으로 할당 할 때 캔버스 글꼴이 무시됩니다.
function drawResTexts(num) {
var num = num || "";
var font = (resTxtStyle["font-style"+num] !=
undefined ? resTxtStyle["font-style"+num] : "normal") + " " + resTxtStyle["font-size"+num] + "px " + resTxtStyle["font"+num];
ctx.font = font; // This line has no effect whatsoever
ctx.textAlign = resTxtStyle["align"+num] || "left";
var txtArr = resTxt.split("\n");
for (var i = 0; i < txtArr.length; i++) {
if (resTxtStyle["stroke"+num] != undefined) {
var stroke = resTxtStyle["stroke"+num].split(" ");
ctx.strokeStyle = stroke[1];
ctx.lineWidth = Number(stroke[0]) * 2;
ctx.strokeText(txtArr[i], resTxtStyle["pos"+num][0], resTxtStyle["pos"+num][1]);
}
ctx.fillStyle = resTxtStyle["color"+num];
ctx.fillText(txtArr[i], resTxtStyle["pos"+num][0], resTxtStyle["pos"+num][1] + i * (resTxtStyle["line-height"+num] || 0));
}
}
그럼이 함수는 drawText()를 사용하여 호출합니다.
글꼴 변수는 다음 "regular 45px Georgia"
입니다
resTxtStyle = {
"align": "center",
"font": "Georgia",
"font-size": "45",
"font-style": "regular",
"color": "#FFFF4C",
"stroke": "2 #000"
}
누군가가 도움을 주시기 바랍니다 수 있습니까 resTxtStyle OBJ이야?
여기에도 비슷한 문제가 있지만 여기서 - http://www.tenpay.tech/questions/2162612/html-5-canvas-font-being-ignored하지만 여기에서 canvas.getContext가 다시 호출되어 글꼴을 재설정했지만 내 경우에는 해당 사례가 없습니다.
도움을 받으실 수 있습니다.
예 캔버스'font' 속성은 올바른 CSS'font' 단축형 값을 기대합니다. * standard *'font-weight'는'normal'라고하며, * regular * 또는 *평원*. 이름이 마음에 들지 않는다면 [TrueType 숫자 가중치 소수점] (https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight#Common_weight_name_mapping)을 사용할 수도 있습니다. 그리고 모든 그래픽 소프트웨어가 "규칙적인" "*"을 사용한다는 당신의 주장은 잘못된 것입니다. 그들은 글꼴 디자이너가 그들에게 준 이름을 사용합니다. 예를 들면 나의 osx 디폴트 * Tahoma *는 * normal *이고, * Savoye LET *은 plain *입니다. – Kaiido
좋아요, 저를 시정 해 주셔서 고마워요. –