Задать вопрос
  • Как можно сократить код и определить точное место?

    WblCHA
    @WblCHA
    Нужно писать не максимально коротко, а максимально понятно.
    Тем более непонятно, в одном примере ты используешь ванилу, а в другом жквери. С тем же успехом можно написать свою функцию для конкретно данной задачи и тогда код можно сократить до:
    w('.itek', [5, 3, 2]);
  • Как сделать повторяющуюся анимацию?

    WblCHA
    @WblCHA
    Мне день разбираться с основной проблемой, но тут ужасно написано:
    let styles = [];
      for (let i = 0; i < properties.length; i++) {
        styles.push({
          color: `${properties[i].color}`,
        });
      }
    
    // =>
    
    const styles = properties.map((p) => ({ color: p.color }));
  • Как поместить созданный блок внутрь HTML кода в return?

    WblCHA
    @WblCHA
    2021. Сложение строк. Ты бы ещё вары использовал.
  • Как правильно сделать регулярку?

    WblCHA
    @WblCHA
    Данил, только правильнее так:
    /^кубик(?:\s[1-6])?$/
    Кубику незапоминающие скобки ненужны, как пробелу с числом запоминающие ненужны.
  • Хватит ли данного ноутбука для комфортной веб разработки?

    WblCHA
    @WblCHA
    rPman, ты про 8 и 4 шутишь или серьёзно? Для работы сегодня 16 ─ это минимум. Тем более для веба, которому одновременно нужно постоянно держать как минимум иде + браузер открытыми.

    В общем, kaori_el, для твоих задач 16 минимум (обязательно в двухканале), rPman из другой сферы и для его задач, возможно, хватает и меньше.
  • Хватит ли данного ноутбука для комфортной веб разработки?

    WblCHA
    @WblCHA
    Оперативы хотя бы 16 надо.
    Обязательно как минимум 2умя плашками.
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    Alixx, если ты откроешь свг как текст, то у увидешь там пути. Их точно так же можно создать через жс, запихнув в свг, тебе будет достаточно взять точки из сгенерированого тобой свг.

    И да, раз у нас такое активное общение, может перейдём на более удобные для этого площадки, а то я уже устал мотать вниз каждый раз... :/
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    Alixx,
    document.createElementNS("http://www.w3.org/2000/svg", "svg");

    Вообще у меня есть старый-старый минипроект с говнокодом (писал, когда ещё только, по сути, начал учить жс), генерирующий гексагоновую карту на свг. Могу скинуть, если хочешь.
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    Alixx, с этим шаблонизатором я дел не имел, так что если так реализовывать, то да, импортить надо будет через хтмл.
    Но вообще можно создать свг через жс и добавить его на страничку.
  • Удалили акк Upwork с деньгами, что делать?

    WblCHA
    @WblCHA
    viacheslav228, их же отправили назад заказчику, попробуй с ним связаться напрямую и объяснить ситуацию, возможно перечислит тебе напрямую.
    Впрочем, с твоим красноречием я сомневаюсь в положительном результате.)
  • Как защитить сайт от прямых ссылок на изображения со вставками изображений на других сайтах?

    WblCHA
    @WblCHA
    Автор же спрашивают про защиту от хотлинкинга, причём здесь тут бред, что ты написал?
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    практики во фронте у меня мало, поэтому многое по факту уже смотрю, тестирую

    Alixx, забавно, я сам нод жс бекендер, поэтому с фронтом тоже много дел не имею.) Так что с этим:
    когда до дела дойдёт, только тогда смогу понять, чё подходит, а что нет
    полностью согласен.

    Чёто сколько сегодня читаю про свг, тем больше он меня пугает.

    Меня он тоже пугает местами, честно говоря, но по факту он довольно простой и лаконичный. Path непростой, да, но есть лайфхак, как получить легко и быстро все точки необходимой области. Когда дойдёшь до этого, расскажу, а то там много расписывать, а сейчас мне лень.)
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    Foint

    Alixx, опечатка же.)

    Почему же здесь так же не получится?

    Если так, то да, но тогда, имхо, лучше сделать наоборот, свг держать дисплей нон и когда надо диплей блок/флот/что угодно. Причём можно сделать визабилити хайден или опасити 0, чтобы даже теоретического мерцания не было.
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    Почему? А elementfrompoint разве не подойдёт?

    Возможно, я чего-то не понимаю, но каким образом он может вообще подойти? Канвас же будет на переднем плане. Разве что elementsFromFoint, но если нужен эвент на ховер, то эта операция на моусмув будет достаточно ресурсопрожорлива, хотя здесь могу ошибаться.

    Но! Не получится для фона загружать картинки целиком - они весят десятки мб и размером 20000х10000px (примерно пишу). Не каждый слабый комп/ноут такое потянет. Поэтому такие картинки нарежу на квадраты и буду подгружать по мере надобности.

    Разумно. Так же предложу дополнительно сжать изображения, до 90-95%, если речь о жпг, глазом не отличишь от оригинала.

    А как с свг? Его можно загрузить целиком, да, но спозиционировать и уменьшить масштаб под текущий размер фона можно?

    Естественно.
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    даже для рисования можно поверх всего канвас налепить и по нему рисовать путь

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

    И как быть с передвиганием карты?

    Тут как раз вообще нет проблем, будет 1 большой свг с множеством элементов внутри. Достаточно будет просто сдвигать свг. Или же просто использовать стандартные полосы прокрутки.

    И ещё вопрос, т.к. с свг я никогда не работала, если в фоне показана часть картинки, то нужны и только части свг, соответствующие для этой части фона. Часть фона показать просто с css, а часть свг показать можно?

    Я не думаю, что возникнут проблемы с производительностью, а значит ничего не мешает сразу отрендерить весь свг. По сути, это дом, часть дома будет за границами экрана, что абсолютно нормально.

    В целом, если что, пиши сюда, мне самому интересно, если найдутся какие-то неприятные (или приятные) нюансы, которые я пропустил.
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    нельзя рисовать путь как в paint

    Alixx, до сих пор не могу понять зачем это надо, но ладно.
    Есть полилайн: https://www.w3schools.com/graphics/svg_polyline.asp
    Если нужны кривые, то тогда путь, но он сложнее: https://www.w3schools.com/graphics/svg_path.asp

    И прямой доступ к объектам через инструмент. Т.о. можно просто в стилях объектов менять их места, удалять и менять как угодно.

    И каким же образом это является минусом? Вернее это минус, только канвас от него вообще никак не спасает, как и всё, что находится у клиента.
    Во-первых, все данные, с которыми будет работать код у клиента, будет, внезапно, в самом коде. То есть изменение дома приведёт лишь к визуальным изменением у клиента, не более.
    Во-вторых, всё, что не относится к отображению информации, должно выполняться на сервере.
    В-третьих, на сервере должна проводиться полная проверка валидности действий, поскольку клиенту ничего не мешает отправить запрос серверу через тот же fetch, вручную прописав всё, что он хочет.

    Иными словами, реализация фронка никаким образом не повлияет на реализацию бека, при любой реализации необходимо будет делать одни и те же проверки.

    И будет постоянная динамика - одновременное движение и героев других игроков и их круги обзора

    Это всё статика (почти). Обзор всё равно завязан на иконке/фигурке игрока и с свг будет достаточно перемещать весь элемент героя со всем, что к нему относится.
    Единственное "но": если объекты надо перемещать с разной скоростью, то реализацию надо будет писать самому. Или искать готовую. Но в канвасах её итак и так придётся реализовывать.

    анимация разных объектов и природы (напр., течение воды).

    У меня большие сомнения, что ты собираешься реализовывать детализированную анимацию с кучей кадров. То есть всё это можно реализовать через видео/таймауты, но тут надо смотреть, конечно.
    В любом случае никто не мешает использовать анимированный канвас на фоне прозрачного элемента свг.

    И про динамику ты неверно меня поняла. У тебя динамики будет минимум. В большинстве текущих браузерных игр канвас необходим, т.к. каждый следующий кадр будет практически новым, а у тебя есть карта, которая сама по себе статична. Объекты на карте большую часть времени тоже статичны.
    На выходе у тебя получится статичная игра с элементами динамики, а ты в первую очередь смотришь на динамичные игры с элементами статики, что в корне неверно.
  • Каким образом лучше реализовать такую карту на canvas?

    WblCHA
    @WblCHA
    Alixx, что за абсолютное непонимания, что каждой технологии своё место?
    Хорошо, давай взглянем на https://surviv.io/, вся игра на канвасе, кроме, внезапно, всех кликабельных элементов, они на дивах.
    Искать схожий пример мне лень, поскольку абсолютное большинство браузерных игр вообще не имеют кликабельного интерфейса непосредственно во время игры.
    Канвас нужен при постоянной динамике, тебе же нужна практически статичная сцена со множеством кликабельных элементов сложной формы. Так скажи мне, зачем тебе в таких условиях канвас? В 99% играх позиция мыши использует лишь для расчёт направления? И это очень простая операция, в отличии от расчёта пересечений с объектами сложной формы.

    Короче, хочешь писать на канвасах? Пиши. Только я себе слабо представляю, как ты реализуешь всё, что задумала за адекватное количество времени.
  • Как исправить выведение [object Object] из функции?

    WblCHA
    @WblCHA
    for (const x = 0; x <= n; x++)

    На этих строчках у вас дичь какая-то.