JavaScript: нуқта кашед

Биёед бифаҳмем, ки чӣ гуна бо JavaScript нуқтаро дар браузер кашем.. ин аз ҷиҳати техникӣ мушкил нест, балки танҳо барои онҳое, ки ғалат мекунанд ва барои онҳое, ки барои кашидани нуқта дар Интернет омода нестанд - ин албатта як дастоварди куллӣ аст.

Роҳҳои зиёде барои кашидани нуқта вуҷуд доранд, биёед ба онҳо назар кунем

Созандагони бозӣ



Бо истифода аз Unity/Godot/microStudio ё яке аз ҳазорон созандагони бозӣ .. онҳо ҳама бо ин ё он роҳ ягон код эҷод мекунанд, ки JavaScript ё Webassembly бошад ва ҳоло ҳам ин нуктаро ба мо нишон медиҳанд.Мо ба ин рох манфиатдор нестем.мо воқеан дарк нахоҳем кард, ки чӣ рӯй дода истодааст, назорат аз болои код дар коди ибтидоӣ ҳадди аққал ва хонданашаванда хоҳад буд, ба ғайр аз он бузург аст.

Frameworks JavaScript

Ин ро-хи чеддй ба мо харчи бештар наздик аст, зеро.коди мо чун руз калон ва равшан нахохад буд, мо бисьёр реферат намедихем, коди худро бо китобхонахо хеле зиёд намекунем.Назорати код низ хуб мебуд

JavaScript тоза

Ин албатта роҳи Ҷеди аст.Рамз то ҳадди имкон мураккаб аст, назорати ҳадди аксар чизҳое аст, ки гӯё назорат кардан лозим нест.Рамзҳои манбаъ ҳадди ақалл мебошанд ва бо донистани golimy JavaScript, мо метавонем танҳо бехатар ба кор равем, зеро.ба мо чунин одамон лозиманд.

Вале вазифаи мо аз он иборат аст, ки чои кор не, балки ба таври оддй ва осон нуқта кашем.Вектори мо суръат ва чандир аст.

Ман китобхонаро интихоб кардам

p5js нуқта кашидан.Ин танҳо ин нест, албатта, агар вазифа кашидани нуқта бошад ва ин аст, албатта, ҳама чиз бояд бо JavaScript-и бараҳна анҷом дода шавад, аммо ман инро дар оянда иҷро мекунам, .k.он гох ману шумо дигар корхоро ба чо меорем, ки ба назар ачоиб мегар-данд ва барои ин ба мо асбоби хуб лозим аст.Яке аз онҳо p5js мебошад.

Дар golim JavaScript, ба мо лозим аст, ки рони барои муайян кардани функсияҳои оғозёбӣ ва дубора кашидан эҷод кунем, дар p5 ин ҳам анҷом дода мешавад, аммо хеле мухтасар.

Аммо аввал..

Танзими ҳадди ақали муҳити зист барои рушди JavaScript

Зеркашӣ кунед

p5.min.js ва паҳлӯ ба паҳлӯ нигоҳ доред.

ҳамин тавр

index.html

    <html>
    <head>
        <script src="p5.min.js"></script>
        <script src="sketch.js"></script>
    </head>
    <body style="margin: 0px;">
        <main>
        </main>
    </body>
    </html>

sketch.js

    function setup() {
    createCanvas(window.innerWidth, window.innerHeight);
    }

    function draw() {
    background(0);
    stroke('white');
    strokeWeight(10);
    point(window.innerWidth/2,window.innerHeight/2);
    }

Дар натиҷа, браузери шумо чунин кушода мешавад

Хуб, HTML фаҳмо аст, аммо ин чӣ гуна рамзи JavaScript аст?

Функсияи насбкунӣ инициализатсия аст, он як маротиба иҷро карда мешавад, дар он мо канвасро эҷод мекунем, яъне.майдоне, ки дар он мо нуқта мекашем.window.innerWidth, window.innerHeight

паҳнӣ ва баландии экран аст, яъне.мо рони пурра-экранро муайян мекунем ва бале, HTML барои ин низ сабки хеле муҳим дорад

<body style="margin: 0px;">

Ба мо лозим нест, ки ягон чизи дигарро оғоз кунем, мо танҳо бояд нуқта кашем.Принсипи ин ҷоро бубинед .. функсияи кашидан иҷро мешавад, масалан, 60 маротиба дар як сония ва 60 маротиба дар як сония мо нуқтаи худро мекашем.. Чунин ба назар мерасад, ки ин беақл аст, мо танҳо бояд нуқта кашем ва ин аст. он, вале дар оянда он барои умумии тамоми аниматсия асоси хоҳад буд.

Умуман, рамзи кашидани нуқта хеле содда аст:

point(10,10)

ва ҳама!

Аммо, рамзи мо каме калонтар аст

  background(0);
  stroke('white');
  strokeWeight(10);
  point(window.innerWidth/2,window.innerHeight/2);

замина сиёҳ

ситораи сафед

ғафсии нуқта 10

ва мо онро дар маркази амудӣ ва уфуқӣ мекашем.

Хуб.. мо дар рӯи рони нуқта кашидем, ҳама чиз тавре аст, ки бояд бошад, аммо мо ҳатто метавонистем онро дар HTML-и тоза бидуни ягон JavaScript кашем.. Он чӣ гуна хоҳад буд?

Он онро оддӣ ва ҳатто осонтар мекунад, аммо принсипҳо комилан фарқ мекунанд, ин аст рамзи ниҳоӣ барои кашидани мураббаъ дар маркази экран

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body style="background-color: black;">
    <div style="position: fixed; top: 50%; left: 50%; background-color: white; width: 10px; height: 10px;"></div>
</body>
</html>

Натича кариб як хел аст

Бале, кашидани чизе дар марказ дар HTML хеле осон аст, аммо барои илова кардани аниматсияҳо ва ҳатто бештар аз он интерактивии солим, шумо бояд мувофиқи принсипҳои CSS фикр кунед.Гарчанде ки ин вазифаи хеле ҷолиб аст.Танҳо як чизи ибтидоӣ ҳамаи инро мекушад, дар CSS рақамҳои тасодуфӣ вуҷуд надоранд, ин ҳама кӯшишҳои моро дар оянда мекушад, аз ин рӯ ман ба ин самт камтар бартарӣ медиҳам.

Агар ман тасаввур кунам, ки ман мехоҳам дар CSS-и холӣ осмони ситорадор созам, пас ҳама чиз барои ман кор намекунад, зероситораҳо бояд дар мавқеъҳои тасодуфӣ пайдо шаванд ва агар онҳо координатаҳои қаблан сохташуда дошта бошанд, он қадар зебо ва на он қадар оддӣ нахоҳад буд, зеро шумо метавонед дар CSS генератори рақамҳои тасодуфӣ нависед, аммо чунин код комилан зишти, хонданашаванда ва душвор ба назар мерасад. фаҳм!



bg bs ca ceb co cs cy da de el en eo es et fa fi fr fy ga gd gl gu ha haw hi hmn hr ht hu id ig is it iw ja jw ka kk km kn ko ku ky la lb lo lt lv mg mi mk ml mn mr ms mt my ne nl no ny or pa pl ps pt ro ru rw sd si sk sl sm sn so sr st su sv sw ta te tg th tk tl tr tt ug uk ur uz vi xh yi yo zh zu
Text to speech
QR-Code generator
Parsedown cheatsheet. Markdown
Filter data by column with regular expressions
Engines for creating games on LUA ?
JavaScript: draw a point
JavaScript: Speaking text in Chinese