Javascript 绘制用户定义的颜色矩形

我试着点击一个按钮画一个矩形。 用户可以选择一种颜色，然后单击按钮绘制一个特定的彩色矩形。 如何获取此属性。 在我的小提琴中，当你点击图层按钮时，你可以在画布上得到一个矩形。如果您取消选中该复选框并再次单击，您将在同一位置得到一个矩形。我想每次都创建不同颜色的矩形。 这是代码笔，它每次都描述相同颜色的矩形

这是我试图编辑的代码。 现在它每次都用黑色画(

---

在init3中添加以下代码

var oMaterialCB = document.getElementById("pickColor");
        var sMaterial = oMaterialCB.options[oMaterialCB.selectedIndex].text;
        var sMaterialColor = oMaterialCB.options[oMaterialCB.selectedIndex].value;
        m_iCurrentLayerIndex = AddToCB('LayerList', sMaterial + 'Layer');


       //x,y, width, height
        var l_dYOfPrevLayer =  document.getElementById('TextLayer_ULy').value; 

        var Display_DY = DisplayCoords(l_dYOfPrevLayer);  //m_oSetup.Layers[m_iCurrentLayerIndex-1].BottomBoundary; 

        addRect(0,Display_DY,640,100, sMaterialColor);
        // get the last box, update the index for that box and type of that box


      }

---

为了获得更快的帮助，您应该隔离您认为是问题所在的代码，如果您不这样做，人们可能会认为您希望他们完成您的工作