JavaScript Canvas 8. Игра "Жизнь"

Поделиться
HTML-код
  • Опубликовано: 12 сен 2024
  • ⏰ Курс JavaScript 2.0: itgid.info/cou...
    🧠 Чат Telegram c мозголомками : t.me/itgid_info
    👇 Разверни для полной информации
    💎 Курс Функции в JavaScript: itgid.info/cou...
    🧑🏻‍💻 Сайт: itgid.info
    😋 Курс Методы массивов: itgid.info/cou...
    Создаем основу для популярной игры "Жизнь" с помощью JavaScript и Canvas.
    Скачать файлы урока: w3.org.ua/canva...
    Мы на facebook: / w3.org.ua

Комментарии • 63

  • @MrNoblz
    @MrNoblz 7 лет назад +7

    Спасибо вам большое! Дай бог вам здоровья!!! Все очень доступно и понятно объясняете.

    • @itgid
      @itgid  7 лет назад

      Спасибо.

  • @user-vt8uo6qb6t
    @user-vt8uo6qb6t 3 года назад +2

    Я:*смортю превью
    Мой мозг:МЫ ПРСТО ИГРАЕМ В ЖИЗНЬ...

  • @ViGvo
    @ViGvo 4 года назад +2

    Всего пару коротких if надо было добавить, чтобы правила были такими, как Конвэй придумал. И еще кнопку Стоп прикрутить, чтобы таймер останавливать и прекращать это безобразие. И еще интересно, на каком размере поля современная техника начнет тормозить. У Конвэя было задумано бесконечное поле, а у вас - тороидальное получается.

    • @вассявассин-ч3ц
      @вассявассин-ч3ц 2 года назад

      Да, действительно тороидальное, при бесконечном края рисунка не смыкаются друг с другом и не влияют на форму рисунка. Думаю рисунки в 2 вариантах будут различаться.

  • @user-ho5rm7qc7q
    @user-ho5rm7qc7q 4 года назад +1

    вау - вот спасибо так спасибо - очень полезно - давно хотела сделать программку для отрисовки схемок плетения бисером, теперь знаю с чего начать - огроменное спасибо!

  • @yippeeki-yey
    @yippeeki-yey 5 лет назад

    Мне очень помог момент с проверкой массива с выходом чисел за его диапазон, подобное условие было в одной задачке на олимпиаде по прогр. Создавалась матрица 10х10 заполненная нулями и единицами, и если три единицы в ряд "111", то считаем как знак минус, при том что ни слева, ни справа, ни сверху и снизу не будет других единиц, и так же со знаком плюс, три единицы по горизонтали и вертикали. Надо было всего подсчитать кол-во + и - в матрице.

  • @daryashynkevich8186
    @daryashynkevich8186 7 лет назад +2

    спасибо большое за ваши уроки :)

    • @itgid
      @itgid  7 лет назад

      Стараюсь. Пожалуйста.

  • @razzo3107
    @razzo3107 7 лет назад +1

    Спасибо за уроки, обязательно посмотрю весь Ваш курс по канвасу...
    Продолжайте дальше учить на Ванильном JS... Это круто!!!!
    А для идей и предложений, можно сделать Trello аккаунт и в него запихивать все идеи по видео, а заинтересованный народ сам туда подтянется и будет подсказывать ;)
    Это только предложение...
    Еще раз благодарю за уроки!

    • @itgid
      @itgid  7 лет назад

      Тоже идея. Спасибо!

  • @SuperLinuxoid
    @SuperLinuxoid 7 лет назад +1

    дякую за пророблену роботу

  • @user-qh5qo2tr7l
    @user-qh5qo2tr7l 5 лет назад

    Большое спасибо. Прекрасный урок.

  • @AitenirZhamakeev
    @AitenirZhamakeev 4 года назад +2

    Так воот как QR коды делаются)

  • @super-magical-man
    @super-magical-man 5 лет назад

    шикарно!

  • @logius84
    @logius84 4 года назад

    зачетный урок

  • @xmutaborx
    @xmutaborx 6 лет назад

    Если у Вас Chrome, то оставив в index.html размеры канваса 800 * 800 и изменив их в CSS на 300*300, будут проблемы с распознаванием координат мыши и будет непонятная хрень. Ставьте сразу правильные размеры в тэге canvas

  • @РоманСавранский-о8я

    урааа

  • @gfgddtr6217
    @gfgddtr6217 7 лет назад +4

    строка 55 .ошибка .mas==0, наверно mas=0 присваиваем же

    • @itgid
      @itgid  7 лет назад

      Посмотрю. Спасибо за исправления.

  • @mrgoodpeople
    @mrgoodpeople 5 лет назад

    делал такое на канвасе, правда сама "жизнь" не очень интересна, но путём модификаций удалось получить красивый эффект тлеющей бумаги =). весьма красиво, только точки нужно делать 1 на 1 пиксель.

    • @itgid
      @itgid  5 лет назад

      Круто. можно глянуть где-то.

    • @mrgoodpeople
      @mrgoodpeople 5 лет назад +1

      @@itgid у меня там некий "модифицированный" механизм, сам уже его толком не понимаю (давно делал), но решил поиграть с параметрами, вот тоже забавное поведение получилось:
      jsfiddle.net/yg17b3dk/8/
      делаю пару линий и запускаю. вначале растут быстро черные пятна, потом когда они заполняют весь экран, то уже начинают расти белые пятна, в итоге чернота полностью пропадает =). тоже интересно, как бы две стадии процесса.
      UPD:
      еще интересны параметры, когда получаются вяло расползающиеся пятна, как будто какой-то кристал растёт - jsfiddle.net/yg17b3dk/11/#
      тоже забавно =).

    • @itgid
      @itgid  5 лет назад

      @@mrgoodpeople Классно! Нужно разбираться, но мне нравится. Завораживает. И кстати, раз написал ошибочно анимацию на кенвасе, понравилась. Попробовал повторить - не, не получается.

    • @itgid
      @itgid  5 лет назад

      Запостил ваш код на канале!

    • @mrgoodpeople
      @mrgoodpeople 5 лет назад

      @@itgid ок, спасибо! я не против =). да я сам уже забыл что там и как. думаю можно всякие интересные модификации напридумывать, чтобы это выглядело ещё более интересно. Помню лишь, что я использовал не просто состояния 0 или 1, а у меня было любое возможное число, чем оно больше - тем более тёмной рисуется точка. А дальше соседние клетки могут по разному реагировать на такие состояния. 0 - это полностью белая клетка, то есть аналог "пустоты" в классической игре.

  • @EvgeshaFromUa
    @EvgeshaFromUa 2 года назад

    А я не понимаю проверку. 16:46 Мы же получается бегаем по всему ряду, а должны бегать левый, средний и правый сосед. Или я как то не понимаю эту проверку? Буду рад ответу

  • @TeaAndCoffe
    @TeaAndCoffe 7 лет назад +5

    все ваши уроки понимал налету но здесь я завис глухо, если бы мне дали такое тз то это был бы полный провал...

    • @itgid
      @itgid  7 лет назад

      пишите - разберемся.

    • @TeaAndCoffe
      @TeaAndCoffe 7 лет назад

      спасибо большое, пересмотрю ещё раз это видео чтобы на писать более менее внятные вопросы...

    • @romakushnir2820
      @romakushnir2820 7 лет назад

      урок отличный
      только мне, как новичку, логика с массивами тоже очень тяжело дается
      вот сижу второй день разбираюсь...

    • @jinke5935
      @jinke5935 4 года назад

      @@romakushnir2820 надеюсь разобрался.

    • @romakushnir2820
      @romakushnir2820 4 года назад

      @@jinke5935 к счастью, да

  • @mihalev1972
    @mihalev1972 7 лет назад

    Спасибо за Ваши уроки , А почему при повторных нажатиях на кнопку старт скорость циклов увеличивается?

    • @itgid
      @itgid  7 лет назад +3

      А это особенность работы таймера - для ее устранения нужно отключать клик при работающем таймере.

  • @user-mt1vz4tr2t
    @user-mt1vz4tr2t 6 лет назад

    Пж сделайте продолжение

  • @СергейОрехов-ю8т
    @СергейОрехов-ю8т 6 лет назад +4

    блээээд , мозг начинает кипеть просто !!!

    • @itgid
      @itgid  6 лет назад

      Да ладно. Может запутано, но еще не самое страшное!

    • @itgid
      @itgid  6 лет назад +3

      да в принципе вы не видели мой вчерашний гомнокод чата на быструю руку написанный. Строк 500 ереси, стыдно если кто-то увидит.

  • @bogdan_ov
    @bogdan_ov 5 лет назад

    Я так и не понимаю обязательно нужно ставить в массивах i и j ?

    • @itgid
      @itgid  5 лет назад +2

      нет, это врожденная и вбитая привычка на уроках программирования в школе, когда учили Pascal и Basic.

  • @voytya94
    @voytya94 6 лет назад +6

    ааа! сложна! ))

    • @itgid
      @itgid  6 лет назад +3

      ну такое

  • @VB-lx4sr
    @VB-lx4sr 6 лет назад +3

    Есть возможность проиграть, если нарисовать прямую посередине поля)

    • @qwer4781
      @qwer4781 4 года назад

      здесь нельзя выиграть или проиграть

  • @NotBlogGer_42
    @NotBlogGer_42 2 года назад

    что делать если ошибка var ctx = canvas.getContext('2d'); TypeError: Cannot read properties of null (reading 'getContext')

    • @vixazomova5899
      @vixazomova5899 2 года назад +1

      Значит не получен элемент канваса в строке выше. Либо неправильно прописан id, либо в html при подключении script добавить атрибут defer.

    • @NotBlogGer_42
      @NotBlogGer_42 2 года назад +1

      @@vixazomova5899 А можно просто весь код запихнуть в функцию. Например load.
      function load(){
      let canvas....
      ......
      }
      Потом в html написать в body onload="load();"

  • @ales6309
    @ales6309 6 лет назад +1

    Очень интересный урок!
    Можете обьяснить действия с mas[i]=[ ] и mas[i] [j] = 0 ?
    Посмотрел ваше видео про шахматную доску ruclips.net/video/gdNgcJG8uvw/видео.html но там иные действия.

    • @itgid
      @itgid  6 лет назад

      Честно говоря не помню что и как. Это скорее всего из-за того что в js изначально нет синтаксиса двумерных массивов, поэтому создаю обычный массив а в него запихиваю пустые массивы - эмулирую двумерность.

  • @span4ev
    @span4ev 6 лет назад

    Вот что это за "итэ" и "джитэ" ? почему переменную "ай" называет "итэ" ?

    • @itgid
      @itgid  6 лет назад +2

      увы мне, увы. Удалю канал, стыдно, назвал переменную не корректно.

    • @span4ev
      @span4ev 6 лет назад +1

      JavaScript решает
      я всего лишь спросил, что за приставка "тэ", почему так говорят? Почему "и-тэ" и "джи-тэ", когда имеют ввиду квадратные скобки? По поводу произношения - мне вообще плевать) меня во всём интернете бесит только ударение в слове "стрОка")

    • @itgid
      @itgid  6 лет назад +1

      я шутил. Вроде говорю итое ( i-тое) ну так в школе приучили :(

    • @span4ev
      @span4ev 6 лет назад

      JavaScript решает да я не только у вас это слышал, и мне интересно, почему так говорят?) это же должно иметь какую-то причину, что переменные в скобках называют с окончанием "тэ"

    • @span4ev
      @span4ev 6 лет назад +1

      JavaScript решает вы написали, что вас в школе так научили. И вы из Украины, насколько я знаю. И у другого видео блогера я тоже слышал "итэ" и "джитэ", и он тоже из Украины. Это как-то связано?

  • @noitaukkokronk
    @noitaukkokronk 3 года назад

    Не очень приятно, когда человек кушает, причмокивает и говорит одновременно.

    • @xaosit8974
      @xaosit8974 3 года назад +1

      Это звуки клавиатуры.