html - 我可以根据 HTML 页面上的值插入笑脸动画吗？

Question

有没有办法在 HTML 页面上插入笑脸动画，它的微笑取决于一个值？我有一些来自朴素贝叶斯分类器的介于 -1 和 1 之间的值，它们分别对应于负面和正面情绪。是否可以在笑脸上形象化这种情绪，这意味着如果值接近 -1，则脸部会悲伤:(或者如果接近 1，则脸部会开心:) ..？

谢谢你。

Answer 1

假设您不想做任何服务器端工作，我能想到的做这个客户端的唯一选择是使用HTML5 canvas。如果您不知道那是什么，您首先需要阅读一些关于它的内容以及如何使用 JavaScript 在其上绘制东西。

第一步是绘制表情的静态部分（即脸部和眼睛的边框等）。您可能将其放置在画布上的图像中。如何做到这一点的示例：

var ctx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.src = 'images/face.png';
img.onload = function() {
    ctx.drawImage(img, 0, 0); //draws img where its left-upper corner is at 0, 0
};

然后，要绘制微笑曲线，您需要使用贝塞尔曲线。您只需根据您的值正确移动控制点。这是有关如何在画布上绘制贝塞尔曲线的教程：链接

希望以任何方式有所帮助！