NOVINKA: Získej 40 hodin praktických dovedností s AI – ZDARMA ke každému akreditovanému kurzu!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

Diskuze – Lekce 26 - Obrázky a kreslení na canvas v JavaScriptu

Zpět

Upozorňujeme, že diskuze pod našimi online kurzy jsou nemoderované a primárně slouží k získávání zpětné vazby pro budoucí vylepšení kurzů. Pro studenty našich rekvalifikačních kurzů nabízíme možnost přímého kontaktu s lektory a studijním referentem pro osobní konzultace a podporu v rámci jejich studia. Toto je exkluzivní služba, která zajišťuje kvalitní a cílenou pomoc v případě jakýchkoli dotazů nebo projektů.

Komentáře
Avatar
Jan Felkl
Člen
Avatar
Jan Felkl:6.7.2017 17:24

Ahoj příklad přepínač funguje ale jakmile jsem obrázky dal do adresáře img tak to přestalo fungovat, cestu jsem změnil.
Něco dělám špatne ale co?

function Prepni() {
if (prepinac.getAt­tribute("src") == "img\prep0.png") {
prepinac.src = "img\prep1.png"
} else {
prepinac.src = "img\prep0.png"
}
}

 
Odpovědět
6.7.2017 17:24
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Jan Felkl
Michal Žůrek - misaz:6.7.2017 17:27

V javascriptu se jako oddělovač složek nepoužívá \ ale /

 
Odpovědět
6.7.2017 17:27
Avatar
Jan Felkl
Člen
Avatar
Jan Felkl:6.7.2017 17:30

dik už to jede

 
Odpovědět
6.7.2017 17:30
Avatar
David Koníček
Člen
Avatar
David Koníček:18.12.2017 8:19

Škoda, že tu není uvedený příklad jak vykreslit ten externí obrázek.. až po delším bádání jsem přišel jak na to. Klidně bych se u toho trochu víc rozepsal, ale nechci kritizovat.

Odpovědět
18.12.2017 8:19
Věř, běž a dokážeš!
Avatar
Tomáš Pařízek
Člen
Avatar
Tomáš Pařízek:7.2.2018 12:26

Mám takové dva dotazy, nevím přesně kde se mám zeptat, tak se ptám u tohoto článku.

1.) Proč místo označení proměnné var používáte let?
2.) Co znamená this, případně mohl byste někdo uvést jednoduchý příklad?

 
Odpovědět
7.2.2018 12:26
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Tomáš Pařízek
Michal Žůrek - misaz:7.2.2018 14:06
  1. let jsem tam nenapsal já, ale někdo to upravil. Je to dnes hrozně cool. Oproti var se to chová jinak napříč různými scope a nedovoluje to za určitých okolností změnu hodnoty proměnné. Nevýhoda je, že to neumí starší prohlížeče. Osobně to nepoužívám.
  2. this slouží k určení kontextu volání. Používá se u objektů a metod k přístup k aktuální instanci.
function Clovek(jmeno, prijmeni) {
        this.jmeno = jmeno;
        this.prijmeni = prijmeni;
}

Clovek.prototype.pozdrav = function () {
        alert("Zdraví tě " + this.jmeno + " " + this.prijmeni);
}

var karel = new Clovek("Karel", "Chytrý");
karel.pozdrav();
 
Odpovědět
7.2.2018 14:06
Avatar
Tomáš Pařízek
Člen
Avatar
Odpovídá na Michal Žůrek - misaz
Tomáš Pařízek:7.2.2018 14:55

Děkuji, to se mi hodí. Je to něco podobného jako v Pythonu self.

 
Odpovědět
7.2.2018 14:55
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Tomáš Pařízek
Michal Žůrek - misaz:7.2.2018 15:12

přesně tak. je to v podstatě totéž. V JS to lze ještě použít sice i jinak, ale to je docela složité.

 
Odpovědět
7.2.2018 15:12
Avatar
Tomáš Pařízek
Člen
Avatar
Odpovídá na Michal Žůrek - misaz
Tomáš Pařízek:8.2.2018 13:07

Jen bych se teda chtěl zeptat na konkrétní věc. Pokud si chci vytvořit takovou malou, řekněme ,,Knihovničku", která se teda jmenuje po mě. Kde jsem udělal chybu zde:

Knihovna: parizek.js

var GameObject = function(color, width, height) {
        this.color = color
        this.width = width
        this.height = height
        }

function GameObject.prototype.create()
{
        var a = document.createElement(div)
        a.style = "height: " + this.height + "; width: " + this.width + "; background-color: " + this.color
        return a
        }

A zde test: test.html

<title>Test</title>
<meta charset="utf-8">
<body id="telo">

<script src="parizek.js"></script>
<script type="text/javascript" >
        plocha = new GameObject("orange", "50", "50")
        plocha.create()
        telo.appendChild(plocha)
</script>
Editováno 8.2.2018 13:08
 
Odpovědět
8.2.2018 13:07
Avatar
Michal Žůrek - misaz
Tvůrce
Avatar
Odpovídá na Tomáš Pařízek
Michal Žůrek - misaz:8.2.2018 15:23

Skvělý začátek! Správně je to takhle.

var GameObject = function(color, width, height) {
    this.color = color
    this.width = width
    this.height = height
}

GameObject.prototype.create = function () { // musí se psát takhle
    var a = document.createElement("div") // div musí být v uvozovkách
    a.style = "height: " + this.height + "; width: " + this.width + "; background-color: " + this.color
    return a;
}

a

<title>Test</title>
<meta charset="utf-8">
<body>

<script src="parizek.js"></script>
<script type="text/javascript" >
    var plocha = new GameObject("orange", "50", "50")
    document.body.appendChild(plocha.create()) // musí se vložit to co vrátí nějaký element, tedy metoda create.
</script>
 
Odpovědět
8.2.2018 15:23
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 55.