Les bases de JavaScript : dessin (1 / 7 étapes)

Étape 1: Intro au dessin : apprendre les bases

Je ne veux pas perdre de temps sur des banalités, nous allons donc commencer ! Mais, tout d’abord, vous devez connaître les bases du dessin et comment faire des formes simples, avant de commencer à faire élaborer des formes. Commencer est très simple ; vous avez juste besoin de connaître les commandes. Voici les commandes d’albums qui sont utilisés dans presque tous les « dessin » ou « animation » à l’aide de JavaScript.

  • Rectangle

Pour dessiner un rectangle, procédez comme suit. (Je vais vous expliquer ce que la moyenne des nombres dans une seconde!!!)

Rect (200, 200, 200, 200) ;

Maintenant, il s’agit de la commande pour dessiner, mais que signifient ces chiffres ? Voici leur signification :

  1. Le premier nombre est pour localiser où se situera le rectangle. Regardez la première image. Il y a trois points rouges dans la partie supérieure, un seul marqué 0, une marquée 200 et un 400 étiquetées. Ainsi, le coin gauche est 0, le bon coin est 400, et le milieu est 200. Si votre premier numéro localise où se situera le coin supérieur gauche de votre rectangle. Ainsi, dans l’exemple, mon rectangle est situé au 200, dans le milieu exact de l’axe des abscisses. Le premier nombre contrôle où dans l’axe des abscisses au coin gauche (en haut) se situera, d’être simple.
  2. Le deuxième numéro est de localiser où sur l’axe y sera le coin supérieur gauche. Regardez la deuxième photo. Vous verrez qu’il y a trois points à nouveau. C’est le même que le premier chiffre, sauf il décrypte où le coin supérieur du rectangle sera situé, jusqu'à ou vers le bas. Donc, maintenant notre rectangle sera situé dans le centre de la page, ou du moins le coin supérieur gauche coin volonté.
  3. Le troisième nombre est le nombre premier qui indique quelle est la taille pour faire le rectangle. Ce numéro indique combien de temps sera le rectangle. Donc, nous savons déjà que le rectangle sera situé au 200, 200, ou, au milieu de la page. Maintenant, notre rectangle sera 200 large ou 200 depuis longtemps.
  4. Le quatrième nombre raconte comment haut pour faire le rectangle. Ainsi, dans notre cas, il est haut de 200. Nous avons donc 200, 200, 200, 200. Ainsi, au lieu d’un rectangle, nous avons effectivement un carré ! Mais je ne veux pas vous embrouiller, maintenant ! Vous pouvez modifier les numéros pour modifier la taille ou l’emplacement de votre rectangle. Découvrez la troisième photo pour voir la place que nous avons fait. La quatrième image montre un autre rectangle avec les coordonnées de : 20, 10, 40, 75.

NOTE!! **Dans la troisième photo, vous ne voyez pas les deux autres lignes c’est parce qu’ils sont exactement sur les lignes de fond de la toile (la mère de « dessin »).

  • ellipse (circulaire ou ovale)
Pour dessiner une ellipse, procédez comme suit. Je vais vous expliquer les nombres bientôt!! (Maintenant que vous savez comment faire un rectangle, c’est assez simple). ellipse (40, 40, 40, 40) ; Les chiffres signifient exactement la même chose. x, y, w, h, ou, axe x, axe y, largeur, hauteur. La chose seulement « différente » de placer et ellipses de dimensionnement plutôt que rectangles est qu’il n’y a aucun coin supérieur gauche, les nombres sont donc où se trouve le Centre . Vous avez terminé avec les « bases des bases! » Poster des questions dans les commentaires ci-dessous et continuer à l’étape suivante. Si quoi que ce soit prête à confusion, faites le moi savoir et je vais il simplifie!

Articles Liés

Apprendre les bases de Adobe Photoshop

Apprendre les bases de Adobe Photoshop

Voici quelques instructions de base pour vous aider à plonger dans l'univers de Photoshop. Une fois que vous à l'aise avec les concepts abordés ici, vous serez en mesure de jouer avec le logiciel et d'apprendre sur votre propre ! Il y a aussi de nomb
Comment faire la mousse Conseil paysage : les bases

Comment faire la mousse Conseil paysage : les bases

Ce guide est conçu pour vous aider à utiliser les compétences de base pour rendre un bâtiment de Conseil de mousse qui peut être utilisé, par exemple, pour créer une maquette pleine comme indiqué avec des fournitures supplémentaires. Il s'agit d'un p
Pourquoi des contrôles à bas prix en ligne sont meilleure Option ?

Pourquoi des contrôles à bas prix en ligne sont meilleure Option ?

Plus tôt, nous avons utilisé pour obtenir nos chèques pour notre compte de chèque qu'à partir de banques. Mais aujourd'hui avec la croissance de l'internet dans tous les aspects, nous pouvons profiter ordonnant des vérifications dans les magasins en
Les bases d’un site Web div

Les bases d’un site Web div

cette instructable va vous montrer les rudiments de la façon de construire un site Web avec des divs. Parce que les tables utilisées pour la mise en page sont mauvais ! : pPour comprendre ce instructable, vous aurez besoin de connaître le css et html
Votre premier vrai robot le simple passant, apprendre toutes les bases, alors que chez lui:)

Votre premier vrai robot le simple passant, apprendre toutes les bases, alors que chez lui:)

ce tutoriel est le moyen le plus facile pour vous donner une avance rapide dans la construction de robots dans le monde.Et alors, il est très facile !Il s'agit d'une version actualisée, l'original peut être trouvé ici : la notice originaleBienvenue:)
Les bases de l’HTML et le CSS codage

Les bases de l’HTML et le CSS codage

Avez-vous déjà souhaité faire votre propre site, mais ces autres webbuilders sont trop chers ? Cherchez pas plus loin pour une introduction à HTML et CSS, programmation et le codage.Étape 1: Configurer Chaque HTML et CSS codage page commence par cett
Comment jouer piano - les bases

Comment jouer piano - les bases

je vais vous apprendre les bases pour apprendre le piano. Je vais vous apprendre quelles notes sont les touches sur lesquelles, je vais vous apprendre accords, que je vais vous donner un graphique pour apprendre à lire la musique.Étape 1: vocabulaire
Les bases du Kit Lin One

Les bases du Kit Lin One

Le début du kit lin unÉtape 1: Quels sont les avantagesLa boîte est livré avec un manuel, la chose réelle, une batterie et trois autres piècesÉtape 2 :Voilà à quoi ça ressembleÉtape 3: batterieIl s'agit d'une photo de la batterie. La batterie est une
Effet aquatique pour les Bases de Miniature

Effet aquatique pour les Bases de Miniature

si vous voulez faire une miniature de monstre de mer ! Si vous êtes comme moi, vous juste peignez en noir les bases des vos miniatures et sont fait avec elle. Bien pour les créatures aquatiques, j'ai décidé d'être un peu plus créatifs et les joueurs
Poêles à base

Poêles à base

pouvez vous colorer à l'intérieur des lignes ? Vous avez peu de patience ? vous voulez faire un cadeau cool ? Il n'importe pas que c'était bon marché. Son sang froid parce que vous l'avez fait !Étape 1: Pyrogravure 101 Ok j'ai fait cela avec certains
Aérographe Basics - ce sont les bases pour apprendre à l’aérographe

Aérographe Basics - ce sont les bases pour apprendre à l’aérographe

Airbrush Basics, modification des couleurs - montage - démontage - propre - les meilleurs vidéos gratuites sont ici modification des couleurs - montage démontage - nettoyage -Tout le monde a besoin de connaître les bases, alors vous pouvez prendre so
« Bain d’eau chaude » Canning - les bases

« Bain d’eau chaude » Canning - les bases

Canning est une énorme partie de mon été. Je garde toujours un jardin taille moyen (60-80 plantes), principalement tomates, poivrons chaud/doux et fines herbes, de plus en plus avec quelques autres choses jetées pour faire plaisir. Cela signifie, par
Les bases d’une pile à hydrogène sec-

Les bases d’une pile à hydrogène sec-

ce PowerPoint montre les bases d'une pile à hydrogène sec.Aussi ici : pile à hydrogène sec PPOui ici est le nouveau One :Nouvelle VERSION améliorée etCertains des avantages d'une pile sèche sont qu'il est beaucoup moins corrosif que la submersion.  I
Les bases de dragueur de mines

Les bases de dragueur de mines

dans ce instructable, mon premier seul, je vais vous montrer comment-à, de, les cordes et les bases, sur la victoire de votre classique jeu de démineur... sans le cheat codes. Tout ce dont vous avez besoin est un petit coup de chance (nécessaire sur