Satura rādītājs
Lietojot preci audekls zīmēšanai mēs neaprobežojamies tikai ar taisnstūra figūru zīmēšanu, mēs varam zīmēt arī, izmantojot koordinātas un t.s ceļi kuri ir ceļi, pa kuriem mēs norādīsim elementu audekls kur un kā parādīt mūsu zīmējumu.Iespējas, ko tas mums dod, ir iespaidīgas, jo ar nepieciešamajiem algoritmiem mēs varam izveidot neierobežotas kompozīcijas, uzzīmēt jebkura veida figūras HTML5 un līdz ar to, līdz kopā ar citiem elementiem tiek sasniegti rezultāti, kas iepriekš nebija iedomāti iepriekšējās valodas specifikācijās.
Izmantojot ceļu
Kā mēs minējām ,. ceļš tas ļaus mums norādīt audeklam koordinātas, pēc kurām jāizveido zīmējums, ar šīm koordinātām audekls varēs zināt, kur novilkt atbilstošās līnijas, un galu galā, pareizi uzkrājot līnijas, mēs varam sasniegt jebkuru figūras veids.
Pirms pāriet uz atbilstošajiem piemēriem, mums jāzina, kādas metodes ir pieejamas audekla elementam un ceļam, apskatīsim šādu sarakstu:
- beginPath (): Šī metode ļauj mums sākt jaunu ceļu.
- closePath (): Šī metode mēģina aizvērt pašreizējo ceļu, uzzīmējot līniju no pēdējās rindas beigām līdz sākotnējām koordinātām.
- aizpildiet (): Aizpildiet apakšceļu aprakstītās veidlapas.
- isPointInPath (x, y): Atgriež vērtību true, ja norādītais punkts ir ietverts pašreizējā ceļa zīmētajā formā.
- lineTo (x, y): Uzzīmējiet apakšceļu norādītajās koordinātās.
- moveTo (x, y): Tas ļauj mums pāriet uz norādītajām koordinātām, neizvelkot apakšceļu.
- taisni (x, y, w, h): Uzzīmējiet taisnstūri, kura koordinātas augšējā kreisajā stūrī atbilst (x, y), tā platums atbilst w un augstums atbilst h.
- insults (): Zīmējiet ārējās līnijas, kuras zīmē apakšceļš.
• Mēs saucam par metodi beginPath.
• Mēs pārvietojamies sākotnējā pozīcijā, izmantojot metodi pārvietoties uz.
• Ar metodēm zīmējam apakšceļus lineToutt.
• Pēc izvēles mēs varam izsaukt metodi closePath.
• Visbeidzot, mēs izsaucam metodes aizpildīt vai stoke.
Mums jau ir ieteiktais zīmēšanas sākšanas secība, un tagad mēs redzam atbilstošo kodu HTML5.
Piemērs Jūsu pārlūkprogramma neatbalsta šo elementu audekls Kā redzam, tiek veikti divi zvani uz beginPath(), ar to mēs varam sākt zīmēšanas apgabalus uz audekla, pēc tam ar moveTo () mēs nosakām sākotnējās pozīcijas un pārējais ir zīmēt.
Apskatīsim, kā mūsu zīmējums izskatās pārlūkprogrammā:
