Javascript / jQuery绘制带有特定颜色的单元格的表格以计算方程式

Question

是否有一个库或有关纯JavaScript / jQuery脚本的至少一些信息，可以帮助我在下图中创建表单，以使护士将X放入响应者单元格中以计算称为CVD的医学方程式？

这是图片：

一些解释

在我的数据库中，我可以知道每个患者的年龄，根据它，我将显示表格，当然还要显示性别（男性或女性）。 然后，我们将指定他的总胆固醇，当添加X时，我们会看到X出现在哪种颜色上，并且我们可以知道什么是CVD危险因素。

当然，Y轴用于所谓的SOP。

我认为最难的部分是如何显示背景颜色。

Answer 1

这不能解决您的根本问题，但是为了显示表格的背景色，您可以使用CSS渐变，并相应地调整停靠点。

 .bg-grad { /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1dae59+0,1dae59+33,f37437+34,f37437+69,e43c40+70,e43c40+70 */ background: #1dae59; /* Old browsers */ background: -moz-linear-gradient(45deg, #1dae59 0%, #1dae59 33%, #f37437 34%, #f37437 69%, #e43c40 70%, #e43c40 70%); /* FF3.6-15 */ background: -webkit-linear-gradient(45deg, #1dae59 0%,#1dae59 33%,#f37437 34%,#f37437 69%,#e43c40 70%,#e43c40 70%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(45deg, #1dae59 0%,#1dae59 33%,#f37437 34%,#f37437 69%,#e43c40 70%,#e43c40 70%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1dae59', endColorstr='#e43c40',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } table.graph { border-spacing: 0; border-collapse: collapse; border: 1px solid #fff; } table.graph td { border: 1px solid #ccc; height: 20px; width: 20px; } 

 <table class='graph bg-grad'> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> </table>