Задать вопрос

liltrill

Ответы

  • Как вставить переменную в style.transform translate?

    @liltrill
    Вот запись для X и Y, Первая X, Вторая Y:
    let forarray = ["6","-16","13","-20","-23","9"];
elem.style.transform = `translate(${forarray[1]}%,${forarray[1]}%)`;


    var - не следует использовать;
    Eсли переменная меняется то let:
    let forarray = ["6","-16","13","-20","-23","9"];

    Если переменная не меняеться то const:
    const forarray = ["6","-16","13","-20","-23","9"];

    Шаблонный строки это вот это:

    `width: ${value}px`;

    т.е такие кавычки и в них ${} - в которых можно писать js
    Ответ написан
    6 комментариев
    6 комментариев

  • Как во вложенном объекте заменить значения?

    @liltrill Автор вопроса
    Реализация решений Дмитрий на for of и с автоматическим поиском вложенности:

    deepMerge(a, b) {
    a = {...a};

    for (let [key, value] of Object.entries(b)) {
        if (typeof value !== 'object') a[key] = value;
        else a[key] = this.deepMerge(a[key], value);
    }

    return a;
}
    Ответ написан
    Комментировать
    Комментировать

  • Как сохранить результат в рекурсии?

    @liltrill Автор вопроса 
    function getObjectId(id, listQuestion) {
        let returnValue = '';
        
        for ( let question of listQuestion ) {
            if ( question.id === id ) return question;

            if ( question.ifQ ) {
                for ( let answer of question.answer ) {
                    returnValue = getObjectId(id, answer.children);
                    if ( !!returnValue ) return returnValue;
                }
            }
        }
    }
    Ответ написан
    Комментировать
    Комментировать

  • Почему drop shadow и box shadow дает разный результат?

    @liltrill Автор вопроса
    Расчет в box-shadow и drop-shadow разный, в моем случае пришлось изменить box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.12) на drop-shadow(0px 2px 5px rgba(0, 0, 0, 0.12)
    Ответ написан
    Комментировать
    Комментировать

  • Не работает transition в svg inline use при использовании переменной?

    @liltrill Автор вопроса
    Вообщем, я так понял браузерам очень лень делать такую реализацию по неизвестным мне причинам, так как с 2016 года работает пример с currentColor - переменная текущего цвета и анимация срабатывает отлично, но кастомные переменные идут мимо, по не понятным мне причинам. Максимальное количество анимированных изменений цветов это 2. Кастомные переменные будут без анимации. Обидно немножко.
    Ответ написан
    Комментировать
    Комментировать

  • Как отключить скроллинг страницы?

    @liltrill Автор вопроса
    Вообщем лучше чем скрыть скролл бар решения нет.
    Чтобы было не так плохо, необходимо узнавать ширину скроллбара и при скрытии добавлять padding-right вместо скроллбара
    Ответ написан
    Комментировать
    Комментировать

  • C3.js Doughnut Chart как показать процент доли не в доли, а рядом?

    @liltrill Автор вопроса
    После множества часов поиска и доработки решений которые были найдены на зарубежных форумах я могу ответить на свой вопрос.

    Для того чтобы позиционировать label(это текст который находится в доли процента), необходимо повесить событие onrendered в объекте который передается в c3.js при его создании, после чего находим все label.

    Узнаем координаты label для теоремы пифагора, после чего делаем нужные расчеты(я не силен в геометрии/тригонометрии так что просто взял готовую формулу и даже не буду ее описывать так как не смогу пояснить за нее :) )

    onrendered: function() {
     // Поиск всех label
     d3.selectAll(".c3-chart-arc text").each(function(v) {
          // Получение label
           let label = d3.select(this),
          // Получение координат label (По дефолту label находится в середине доли, вот эти нам 
          // координаты и нужны)
           matrix = label._groups[0][0].transform.animVal[0].matrix;

           let x = matrix.e,
                y = matrix.f;

           // Ну тут вычисления :)
           let h = Math.sqrt(x*x + y*y);

            // 414/414 - ширина и высота svg
            // 15 - отступ от доли
            let labelr = Math.min(414, 414) / 2 + 15;

            // Тут я поясню только за labelr, так как не шарю за формулы, labelr - расстояние от 
            // середины графика до конечного положения, с выбранным отступом от доли
            label.attr("transform", "translate("+ (x/h * labelr) +  ',' + (y/h * labelr) +")");
     });
}
    Ответ написан
    1 комментарий
    1 комментарий