|
@@ -149,8 +149,7 @@ function renderBlock(block, inline) {
|
|
|
}
|
|
|
} else if (block.type === "cloze") {
|
|
|
node = document.createElement("img");
|
|
|
-
|
|
|
- node.src = `/img/editor/answer_point_${block.value}.png`;
|
|
|
+ node.src = getAnswerPointImg(block.value);
|
|
|
node.dataset.isAnswerPoint = true;
|
|
|
node.dataset.order = block.value;
|
|
|
} else if (block.type === "audio") {
|
|
@@ -256,3 +255,20 @@ export function numberToUpperCase(val) {
|
|
|
|
|
|
return String.fromCharCode(64 + val);
|
|
|
}
|
|
|
+
|
|
|
+/**
|
|
|
+ * 获取答题点序号图片base64
|
|
|
+ * @param {number} serialNo 答题点序号
|
|
|
+ * @returns dataUrl
|
|
|
+ */
|
|
|
+export function getAnswerPointImg(serialNo) {
|
|
|
+ const canvas = document.createElement("canvas");
|
|
|
+ const ctx = canvas.getContext("2d");
|
|
|
+ canvas.width = 64;
|
|
|
+ canvas.height = 32;
|
|
|
+ ctx.font = "bolder 30px serif";
|
|
|
+ ctx.textAlign = "center";
|
|
|
+ ctx.textBaseline = "middle";
|
|
|
+ ctx.fillText(`(${serialNo})`, 32, 16);
|
|
|
+ return canvas.toDataURL();
|
|
|
+}
|