<commit_before><commit_msg>topng-2<commit_after><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>canvas直线</title>
<meta name="Keywords" content="">
<meta name="Description" content="">
<style type="text/css">
    body, h1{margin:0;}
    canvas{margin: 20px; }
</style>
<script type="text/javascript">
    function addToGallery(){
        var canvas = document.getElementById("canvas8");
        var dataURL = canvas.toDataURL("image/png");
        var button = document.getElementById("btn-download");
        button.href = dataURL;
        var imageElement = new Image();  // Get the img object.
        imageElement.src = dataURL; 
        var img = document.getElementById("logo");
        img.src = imageElement;
    }
        function drawCanvas8()
    {
        canvas = document.getElementById("canvas8");
        ctx = canvas.getContext("2d");
        ctx.save();
        ctx.fillStyle = "#f00";
        //ctx.fillRect(0, 0, 144, 144);
        ctx.font = "italic 14px serif";
        ctx.fillText("Butterfly",95,141);
        ctx.translate(72,90); 
        ctx.strokeStyle = "#f00"; 
        ctx.beginPath(); //ctx.moveTo(0,0);
        var e = 0, c = 10; 
        var k = 2 * Math.PI / 360;
        do { 
            var t = e * k;
            var cost = Math.cos(t);
            var sint = Math.sin(t);
            //var equ = Math.exp(cost) - 2*Math.cos(4*t) - Math.pow(Math.sin(t/12),5);
            var equ = Math.exp(sint) - 2 * Math.cos(4 * t) - Math.pow(Math.sin(-Math.PI / 24 + t / 12.0), 5);
            x = 18 * cost * equ;
            y = -18 * sint * equ;
            
            e += 0.1; 
            ctx.lineTo(x,y); 
        } while ( e <= 7200 ); 
        ctx.closePath();
        ctx.stroke(); 
        ctx.restore();
        //ctx.translate(0,0); 
        // ctx.strokeStyle = "#ff0000";
        // ctx.beginPath();
        // ctx.moveTo(72,2);
        // ctx.lineTo(72,142);
        // ctx.moveTo(2,72);
        // ctx.lineTo(142,72);
        // ctx.stroke();
    }
</script>
</head>
<body onload="draw()">
    <h1>三次贝塞尔曲线</h1>
    <canvas id="canvas" width=200 height=200 style="border: 1px solid #ccc;"></canvas>
    <br />
    <canvas id="canvas8" width="144" height="144" style="border:1px solid blue;"></canvas>
    <br />
    <input type="button"  value="ToPNG" onClick="addToGallery()"><br />
    <a href="" class="button" id="btn-download" download="logo.png">Download</a><br />
    
    <img src="" id="logo" />

    <script>
    function draw() {
        var canvas=document.getElementById('canvas');
        var context=canvas.getContext('2d');        
       //绘制起始点、控制点、终点  
       context.beginPath();  
       context.moveTo(25,175);  
       context.lineTo(60,80);  
       context.lineTo(150,30);  
       context.lineTo(170,150); 
       context.stroke();  
       //绘制3次贝塞尔曲线        
       context.beginPath();  
       context.moveTo(25,175);  
       context.bezierCurveTo(60,80,150,30,170,150);  
       context.strokeStyle = "red";  
       context.stroke(); 
       drawCanvas8(); 
    }
    </script>
</body>
</html>
{'fraction_non_alphanumeric': 0.17748215444516546, 'fraction_numerical': 0.04769630110317975, 'mean_word_length': 2.031465093411996, 'pattern_counts': {'":': 0, '<': 36, '<?xml version=': 0, '>': 35, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 4, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3573958', 'n_tokens_mistral': 1133, 'n_tokens_neox': 1047, 'n_words': 195}