2019年3月9日 | Be Yourself

小中大

☀️🌙

Home > 2019年 > 3月 > 9日

Canvasで円がぐるぐる回る。

2019年03月09日

この投稿は1年以上前に公開されました。 現在の情報とは異なる可能性がありますので、ご了承ください。

<!DOCTYPE html>
<html>
    <head>
    </head>
<body>
    <canvas id="ctx" ></canvas>
    <script>
            "use strict";
            let x = 0,y = 0;
            let xs = 300,ys = 300;
            let xc = 1,yc = 1;
            let ctx = document.querySelector("#ctx");
            let canvas;
            ctx.width = window.screen.width;
            ctx.height = window.screen.height;
            if(ctx.getContext)
            {
               canvas = ctx.getContext("2d");
               setInterval(draw,77);
            }
            function draw(){
               canvas.beginPath();
               canvas.fillStyle = "#3399ff";
               canvas.arc(x,y,35,0,Math.PI*2,true);
               canvas.globalCompositeOperation = "xor";
               canvas.fill();
                x =((Math.sin (xc) * xs)) + 500;
                y =(Math.cos(yc) * ys) + 500;
                console.log(x + ":" + ctx.width);
                console.log(y + ":" + ctx.height);
                if(x < 0 || x > ctx.width)
                {
                   xs*=-1;
                }
                if(y < 0 || y > ctx.height)
                {
                    ys*=-1;
                }
                if(x<0)
                {
                    x=0;
                }
                if(y<0)
                {
                    y=0;
                }
                if(x > ctx.width)
                {
                    x=ctx.width;
                }
                if( y > ctx.height)
                {
                    y=ctx.height;
                }
                xc+=1
                if(xc>360)
                {
                    xc=0;
                }
                yc+=1
                if(yc>360)
                {
                    yc=0;
                }
            }
        </script>
</body>
</html>

Canvasでぐるぐる円を廻す。
ガラクタコードが少しあります、最初違うコードを書いていたので
これを可変していろいろお試しください。
https://zip358.com/tool/demo5/js/index-3.html

著者名 @taoka_toshiaki

※この記事は著者が30代後半に書いたものです．

Profile
高知県在住の@taoka_toshiakiです、記事を読んで頂きありがとうございます.
数十年前から息を吸うように日々記事を書いてます．たまに休んだりする日もありますがほぼ毎日投稿を心掛けています😅．
SNSも使っています、フォロー、いいね、シェア宜しくお願い致します🙇.
SNS::@taoka_toshiaki

OFUSEで応援を送る

投稿日時 2019年03月09 05:30日

タグ

0, １, 300, body, Canvas, ctx, DOCTYPE, document, gt, head, Height, html, ID, let, lt, querySelector, screen, script, strict, use, Width, win, window, xc, xs, yc, YS, 円,

Home > 2019年 > 3月 > 9日

javascriptでEVENT処理レベル1

2019年03月09日

Logging

この投稿は1年以上前に公開されました。 現在の情報とは異なる可能性がありますので、ご了承ください。

<!DOCTYPE html>
<html>
    <head>
    </head>
<body>
    <input type="text" class="zyezyezye">
    <script>
            "use strict";
            let zyezyezye = document.querySelector(".zyezyezye");
            zyezyezye.addEventListener("input",()=>{
                console.log(">おいら>>" + zyezyezye.value);
                if(zyezyezye.value=="じぇじぇじぇ")
                {
                    console.log("おいら>>ｷﾀ━━━━(ﾟ∀ﾟ)━━━━!!nおいら>>じぇじぇじぇn<<ストーカーかよ!!");
                }
            });
        </script>
</body>
</html>

jqueryばかり書いているとこういう書き方、書かなくなる。
jqueryから世の中はjavascriptやvue.jsなどへシフトしているそうだけど、未だにjqueryばかり書いている自分です。なれないといけないと思いつつ！？
別のことに力を注いでいる毎日です。
ちなみに「じぇじぇじぇ」は方言で驚きを指す言葉だとか。

著者名 @taoka_toshiaki

※この記事は著者が30代後半に書いたものです．

OFUSEで応援を送る

投稿日時 2019年03月09 11:24日

タグ

１, addEventListener, body, class, console, DOCTYPE, document, EVENT, gt, head, html, if, input, javascript, let, log, lt, querySelector, script, strict, Text, type, use, value, zyezyezye, おいら, レベル, 処理,

Home > 2019年 > 3月 > 9日

映画、ウィンストン・チャーチル／ヒトラーから世界を救った男 (字幕版)を観ましたよ。

2019年03月09日

Logging

この投稿は1年以上前に公開されました。 現在の情報とは異なる可能性がありますので、ご了承ください。

映画、ウィンストン・チャーチル／ヒトラーから世界を救った男 (字幕版)を観ましたよ。これは良かった。

成功は決定的ではなく、失敗は致命的ではない。大切なのは続ける勇気だ
Success is not final, failure is not fatal: it is the courage to continue that counts

著者名 @taoka_toshiaki

※この記事は著者が30代後半に書いたものです．

OFUSEで応援を送る

投稿日時 2019年03月09 06:40日

タグ

5, 50, com, continue, counts, courage, failure, fatal, FINAL, is, IT, lSG, MIoE, nbsp, not, success, that, The, To, youtube, ウィンストン, コレ, チャーチル, ヒトラー, 世界, 勇気, 大切, 失敗, 字幕, 成功, 映画, 男,

Home > 2019年 > 3月 > 9日

PHPの無名関数の使い道が未だにわからないし…

2019年03月09日

Logging

この投稿は1年以上前に公開されました。 現在の情報とは異なる可能性がありますので、ご了承ください。

<?php
$mumei = function()
{
    if($cnt = func_get_args())
    {
        foreach($cnt as $key=>$value)
        {
            print func_get_arg($key);
        }
    }
};
$mumei(1,2,3,4,5,6);

わからない、未だにわからないし、使う機会が少ないのだけどいったいどこに使うのか。

追記：
2021年の今、無名関数を使ってコードを書くことが増えました、PHP8になりオブジェクト指向が洗練されてきています。今後、無名関数を使用してコードを書くこともあると思います。因みにJSの方が無名関数でコードを書くことが多いですね。

PHPでの無名関数の問題点は、頻繁に無名関数ばかり使用していると他のエンジニアが読みづらく感じる所かもしれません。特にPHPの昔のバージョンになればなる程、読みづらいと思います。

著者名 @taoka_toshiaki

※この記事は著者が30代後半に書いたものです．

OFUSEで応援を送る

投稿日時 2019年03月09 03:20日

タグ

１, 2, 2021, ３, 4, 5, 6, 8, arg, args, as, cnt, foreach, FUNC, function, GET, gt, if, JS, key, lt, mumei, php, print, value, エンジニア, オブジェクト, コード, こと, どこ, 今, 今後, 他, 使い道, 使用, 問題点, 所, 指向, 方, 未だ, 機会, 洗練, 無名, 追記, 関数, 頻繁,