qianxiaojie991403 2023-09-02 08:11 采纳率: 0%
浏览 16
已结题

求基于hanzi-writer,怎么生成点阵字

基于hanzi-writer组件,怎么 生成点阵字,用于汉字顿笔的掌握
希望提供具体代码
https://www.lovext.org/mzgs/这个是做的在线字帖,如果有这个功能就更加完美了,谢谢大师们啦,我也是实在没责了,年龄大了,想不出办法啦
参考下图需求
1、点阵字有不同有规则组成
2、根据笔顺,顿笔处点加粗显示
大概就这两个需求,现在世面上流行的汉子字帖就是,点阵字字帖
注意:@所有人,测试地址,https://www.lovext.org/mzgs/dh,汉字动画功能我已经实现了,这个是测试地址,我现在要的下图【点阵字】【冬】的效果

img

  • 写回答

18条回答 默认 最新

  • 专家-赤兔[在线] 优质创作者: 编程框架技术领域 2023-09-02 19:09
    关注
    获得1.80元问题酬金

    引用 皆我百晓生 小程序回复内容作答:
    要实现在hanzi-writer组件上生成点阵字,可以按照以下步骤进行:

    1. 首先,你需要在网页中引入hanzi-writer的库文件。你可以使用以下代码将其引入到你的HTML文件中:

      <script src="path/to/hanzi-writer.min.js"></script>
      
    2. 在HTML文件中,创建一个包含hanzi-writer组件的容器元素。例如:

      <div id="hanzi-container"></div>
      
    3. 在JavaScript中,使用以下代码初始化hanzi-writer组件,并指定容器元素和要显示的汉字:

      const writer = HanziWriter.create('hanzi-container', '字');
      

      请将上面的'字'替换为你要显示的汉字。

    4. 然后,你可以使用以下代码来生成点阵字:

      writer.quiz();
      
    5. 要显示笔画顺序,可以使用以下代码:

      writer.showOutline('order');
      

    这里是一个完整的例子:

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
      <title>Hanzi Writer Demo</title>
      <script src="path/to/hanzi-writer.min.js"></script>
    </head>
    <body>
    <div id="hanzi-container"></div>
    
    <script>
    const writer = HanziWriter.create('hanzi-container', '字');
    writer.quiz();
    writer.showOutline('order');
    </script>
    </body>
    </html>
    

    请将"path/to/hanzi-writer.min.js"替换为实际的hanzi-writer库文件路径。

    综上所述,你可以使用以上代码基于hanzi-writer生成点阵字。希望对你有帮助!

    评论

报告相同问题?

问题事件

  • 系统已结题 9月10日
  • 修改了问题 9月2日
  • 修改了问题 9月2日
  • 修改了问题 9月2日
  • 展开全部