{"id":31004,"date":"2020-02-19T20:39:28","date_gmt":"2020-02-19T12:39:28","guid":{"rendered":"http:\/\/4563.org\/?p=31004"},"modified":"2020-02-19T20:39:28","modified_gmt":"2020-02-19T12:39:28","slug":"%e5%a6%82%e4%bd%95%e5%81%9a%e5%87%ba%e8%bf%99%e4%b8%aa%e5%8d%9a%e5%ae%a2%e7%9a%84%e8%83%8c%e6%99%af%e6%95%88%e6%9e%9c%e5%87%ba%e6%9d%a5","status":"publish","type":"post","link":"http:\/\/4563.org\/?p=31004","title":{"rendered":"\u5982\u4f55\u505a\u51fa\u8fd9\u4e2a\u535a\u5ba2\u7684\u80cc\u666f\u6548\u679c\u51fa\u6765?"},"content":{"rendered":"\n

\t\t\t\t\tyumijie<\/strong> \t\t\t\t\u5927\u4f6c\u6709\u8bdd\u8bf4 : \t<\/p>\n

\u5982\u4f55\u505a\u51fa\u8fd9\u4e2a\u535a\u5ba2\u7684\u80cc\u666f\u6548\u679c\u51fa\u6765?<\/h3>\n

\t\t\u535a\u5ba2:https:\/\/c*n*blogs.com\/huanglei559<\/p>\n

\u53bb\u6389*<\/p>\n

\u5f88\u559c\u6b22\u4ed6\u8fd9\u4e2a\u535a\u5ba2\u7684\u80cc\u666f\u6548\u679c,\u5e94\u8be5\u662fjs\u7279\u6548\u5427.\u6709\u5927\u795e\u80fd\u505a\u51fa\u6765\u5417?\t\t\t\t<\/p>\n

\t\t\t\t\twweng<\/strong> \t\t\t\t\u5927\u4f6c\u6709\u8bdd\u8bf4 : \t<\/p>\n

<\/h3>\n

\t\t var c = document.querySelector("#c");
    var ctx = c.getContext("2d");<\/p>\n

    \/\/making the canvas full screen
    c.height = window.innerHeight;
    c.width = window.innerWidth;<\/p>\n

    \/\/chinese characters – taken from the unicode charset
    var chinese = "0123456789qwertyuiopasdfghjklzxcvbnm,.\/;'[]QWERTYUIOP{}ASDFGHJHJKL:ZXCVBBNM<>?\u304c\u30ac\u304e\u30ae\u3050\u30b0\u3052\u30b2\u3054\u30b4\u304d\u3083\u30ad\u30e3\u304d\u3085\u30ad\u30e5\u304d\u3087\u30ad\u30e7\u308a\u3083\u30ea\u30e3\u3085\u30ea\u30e5\u308a\u3087\u30ea\u30e7";
    \/\/converting the string into an array of single characters
    chinese = chinese.split("");<\/p>\n

    var font_size = 10;
    var columns = c.width \/ font_size; \/\/number of columns for the rain
    \/\/an array of drops – one per column
    var drops = [];
    \/\/x below is the x coordinate
    \/\/1 = y co-ordinate of the drop(same for every drop initially)
    for (var x = 0; x < columns; x++)
      drops = 1;<\/p>\n

    \/\/drawing the characters
    function draw() {
      \/\/Black BG for the canvas
      \/\/translucent BG to show trail
      ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
      ctx.fillRect(0, 0, c.width, c.height);<\/p>\n

      ctx.fillStyle = "#0F0"; \/\/green text
      ctx.font = font_size + "px arial";
      \/\/looping over drops
      for (var i = 0; i < drops.length; i++) {
            \/\/a random chinese character to print
            var text = chinese;
            \/\/x = i*font_size, y = value of drops*font_size
            ctx.fillText(text, i * font_size, drops * font_size);<\/p>\n

            \/\/sending the drop back to the top randomly after it has crossed the screen
            \/\/adding a randomness to the reset to make the drops scattered on the Y axis
            if (drops * font_size > c.height && Math.random() > 0.975)
                drops = 0;<\/p>\n

            \/\/incrementing Y coordinate
            drops++;
      }
    }<\/p>\n

    setInterval(draw, 50);\t\t\t\t<\/p>\n

\t\t\t\t\t\u4e00\u4f4d\u4e0d\u77e5\u540d\u7f51\u53cb<\/strong> \t\t\t\t\u5927\u4f6c\u6709\u8bdd\u8bf4 : \t<\/p>\n

<\/h3>\n

\t\t\u6211\u89c9\u5f97\u53ef\u4ee5\uff0c\u554a\t\t\t\t<\/p>\n

\t\t\t\t\t\u5148\u5bb9\u6211\u6c34\u4e00\u53d1<\/strong> \t\t\t\t\u5927\u4f6c\u6709\u8bdd\u8bf4 : \t<\/p>\n

<\/h3>\n

\t\t\u719f\u6089\u7684\u611f\u89c9\uff0c\u597d\u50cf\u662f\u67d0\u4e2a\u8bfe\u7a0b\u7684\u6e90\u7801\uff0c\u4f60\u767e\u5ea6\u641c\u641c\u9ed1\u5ba2\u5e1d\u56fd h5\u7279\u6548\t\t\t\t<\/p>\n

\t\t\t\t\t\u8eab\u65e0\u5206\u6587\u76845\u6bdb\u94b1<\/strong> \t\t\t\t\u5927\u4f6c\u6709\u8bdd\u8bf4 : \t<\/p>\n

<\/h3>\n

\t\tcanvas\u7ed8\u7684\t\t\t\t<\/p>\n

\t\t\t\t\tyumijie<\/strong> \t\t\t\t\u5927\u4f6c\u6709\u8bdd\u8bf4 : \t<\/p>\n

<\/h3>\n

\t\twweng \u5927\u4f6c\u6709\u8bdd\u8bf4 : 2020-2-19 20:31<\/p>\n

\u8c22\u8c22\u5927\u4f6c,\u53bb\u8bd5\u8bd5;P\t\t\t <\/p>\n","protected":false},"excerpt":{"rendered":"

yumijie \u5927\u4f6c\u6709\u8bdd\u8bf4 : \u5982…<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[],"tags":[],"_links":{"self":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/31004"}],"collection":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=31004"}],"version-history":[{"count":0,"href":"http:\/\/4563.org\/index.php?rest_route=\/wp\/v2\/posts\/31004\/revisions"}],"wp:attachment":[{"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=31004"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=31004"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/4563.org\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=31004"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}