PEF-molecuul polymeer

by PhilQ

HTML

<div>
    <canvas id="logo"></canvas>
</div>

CSS

body{
    background-color: #1ABC9C;
}
div {
    position:absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    padding: 0px;
    margin: 0px;
}

canvas {
    width: 100%;
    padding: 0px;
    margin: 0px;
}

JavaScript

function toRadians (angle) {
  return angle * (Math.PI / 180);
}
function toDegrees (angle) {
  return angle * (180 / Math.PI);
}
$(window).load(function(){
    //alert(Math.sin(0));
    
    
    var cnv, ctx, w, h;
    cnv = document.getElementById("logo");
    ctx = cnv.getContext("2d");
    
    w = $("#logo").width();
    h = $("#logo").height();
    cnv.width = w;
    cnv.height = h;

    //ctx.translate(0.5,0.5);
    ctx.lineJoin = "round";
    ctx.lineCap = "round";

    var mirror = 1;
    var lineL = 50;
    var lineW = 4;
    var lineSpace = 2;
    var atomSize = 10;
    var sX = 10;
    var sY = 150;
    var clrBond = '#2C3E50';
    var atomStyles = {
        'h': {
            'stroke': "#BDC3C7",
            'fill': "#FFFFFF",
            'size': 6
        },
        'o': {
            'stroke': "#C0392B",
            'fill': "#E74C3C",
            'size': 8
        },
        'c': {
            'stroke': "#7F8C8D",
            'fill': "#BDC3C7",
            'size': 10
        }
    };
    
    ctx.lineWidth = lineW;
    ctx.strokeStyle = clrBond;

    function drawMolecule(sX, sY) {
        ctx.strokeStyle = clrBond;
        var points = new Array();
    
        var cX = sX;
        var cY = sY;
        points[0] = {
            x: cX,
            y: cY,
            a: '-'
        };
        
        cX += ( Math.cos(toRadians(18)) *lineL );
        cY += mirror* ( Math.sin(toRadians(18)) *lineL );
        points[1] = {
            x: cX,
            y: cY,
            a: 'o'
        };
        cX += ( Math.cos(toRadians(318)) *lineL );
        cY += mirror* ( Math.sin(toRadians(318)) *lineL );
        points[2] = {
            x: cX,
            y: cY,
            a: 'c'
        };
        tX = cX + ( Math.cos(toRadians(258)) *lineL );
        tY = cY + mirror* ( Math.sin(toRadians(258)) *lineL );
        points[3] = {
            x: tX,
            y: tY,
            a: 'o'
        };
        
        cX += ( Math.cos(toRadians(18)) *lineL );
  ...