Как стать автором
Поиск
Написать публикацию
Обновить

Комментарии 20

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

Плохая новость в том, что в вебките размеры отрисовки будут скакать на 1 пиксель туда-сюда. Например, однопиксельный бордюр будет местами двухпиксельным, а местами его вообще не будет.

Всего голосов 6: ↑5 и ↓1+4

А самое печальное, что это касается и таких значений как: 1%, 1.2rem, 1.2em, 10vmin, 10vh, 10vw и тд. Короче, чтобы всё было хорошо, получаемые в результате пиксельные размеры должны быть целыми.

Комментарий пока не оценивали0
Поправьте меня если я ошибаюсь.
Скакать на пиксель туда или сюда в одном и том же окружении он не будет. Под одним и тем же окружением я понимаю то от чего берется процент для относительной единицы. Грубо говоря, если размер области 100 пикселей, то позиция элемента left 3.7px всегда будет в одном и том же месте и скакнуть на пиксель влево или вправо может только в случае изменения размера области.

Равно и в случае с бордером. Он никогда не будет нулевым. Может быть меньше может быть больше, но не нулевой. Исключение только в случаях когда область просмотра масштабируется в область с меньшим разрешением.
Комментарий пока не оценивали0

Тут проблема в том, что в разных местах происходит округление в разную сторону и получаются артефакты типа этих: https://jsfiddle.net/sb4206bz/1/


Насчёт пропадания именно бордера — у меня не получилось сейчас воспроизвести (получилось только для box-shadow: https://jsfiddle.net/sb4206bz/2/). Возможно в свежих билдах хрома это пофиксили, а возможно я не так воспроизвожу. Но проблемы такие были. По той же причине.

Всего голосов 2: ↑2 и ↓0+2
Ужас. Аналогичное часто наблюдал в верстке различных макетов, где есть основной задний фон на весь экран и центральный плавающий блок (margin: 0 auto).
Всего голосов 1: ↑1 и ↓0+1
Спасибо Вам за проделанную работу!
Всего голосов 3: ↑3 и ↓0+3
всем привет!
наспамьте в ЛС ссылок на тригонометрические либы, 2д, 3д, всё то что про геометрию 7-11 классов+
мучительно и долго самому всё это кодить, хочется библиотек.

Спасибо.
Всего голосов 7: ↑0 и ↓7-7
http://glmatrix.net/ для линейной алгебры
Всего голосов 1: ↑1 и ↓0+1
А почему coinToss не сделать проще?

return Math.round(Math.random());


вместо

return Math.floor(Math.random() * 2);

Всего голосов 2: ↑2 и ↓0+2
Дело в особенности языка.
Из-за неточности вычислений с плавающей запятой, очень редко может возникать ситуация неправильного округления. ссылка
Метод floor работает гораздо проще и просто возвращает ближайшее целое число, которое меньше или равно указанному.
Таким образом, вместо ненадежного round() мы умножаем рандомное число на 2, результатом чего всегда будет число в промежутке [0,2) без каких-либо округлений. После чего надежно используем floor() и получаем 0 или 1.
Всего голосов 1: ↑1 и ↓0+1
НЛО прилетело и опубликовало эту надпись здесь
function truncated(num, decimalPlaces) {    
    let numPowerConverter = Math.pow(10, decimalPlaces); 
    return ~~(num * numPowerConverter)/numPowerConverter;
}


Теперь я понимаю, чем занято одно из ядер моего процессора на 100%, когда я открываю простенькую HTML страничку, на которой 200 чисел, округленных до 6 знаков после запятой.

Всего голосов 1: ↑0 и ↓1-1
Будьте осторожны с использованием ~~ при работы с числами:
function truncated(num, decimalPlaces) {    
    let numPowerConverter = Math.pow(10, decimalPlaces); 
    return ~~(num * numPowerConverter)/numPowerConverter;
}

> truncated(0.12345678912345678, 17)
> 1.578423886e-8


Простая замена ~~ на Math.round возвращает точность:

function truncated(num, decimalPlaces) {    
    let numPowerConverter = Math.pow(10, decimalPlaces); 
    return Math.round(num * numPowerConverter)/numPowerConverter;
}

> truncated(0.12345678912345678, 17)
> 0.12345678912345678
Всего голосов 1: ↑1 и ↓0+1
function coinToss() {
	return Math.random()<.5;
}

Но ведь в данном случае true будет чаще встречаться, чем false.
Math.random() генерирует случайное число от 0 до 0.9999999999999999, следовательно надо сравнивать не с 0.5, а с 0.49999999999999994 либо 0.49999999999999995, чтоб иметь наиболее честный результат.
Всего голосов 3: ↑2 и ↓1+1
На большинстве монет из реального мира одна сторона чуть-чуть тяжелее другой, так что в статье всё в порядке.
Всего голосов 1: ↑1 и ↓0+1

Не будет. Это условие разбивает всё множество значений [0,1) на 2 эквивалентных диапазона [0,.5) и [0+.5,.5+.5).

Всего голосов 2: ↑2 и ↓0+2
Самое сложное с математической точки зрения, что у меня было, это была система тригонометрических уравнений, сведённая к биквадратичным. Но это же школьный курс?
Всего голосов 2: ↑1 и ↓10
Очень интересная статья. Нет-нет да и приходится к математике в JS обращаться, на ходу реализуя и возможно далеко не самый лучший вариант. А тут всё грамотно по полочкам разложено, есть вопрос, открыл нужное место и уже хорошее решение за 5 сек готово! Сей труд не пропадёт даром!
Комментарий пока не оценивали0
Будьте осторожны с использованием ~~ при работы с числами:
function truncated(num, decimalPlaces) {    
    let numPowerConverter = Math.pow(10, decimalPlaces); 
    return ~~(num * numPowerConverter)/numPowerConverter;
}

> truncated(0.12345678912345678, 17)
> 1.578423886e-8


Простая замена ~~ на Math.round возвращает точность:

function truncated(num, decimalPlaces) {    
    let numPowerConverter = Math.pow(10, decimalPlaces); 
    return Math.round(num * numPowerConverter)/numPowerConverter;
}

> truncated(0.12345678912345678, 17)
> 0.12345678912345678
Комментарий пока не оценивали0
Про точные вычисления в JS:
Если понадобится прецизионная точность работы с числами, то MathJS в помощь: можно указать точность 64 (и больше) бит и уже 0.1 + 0.2 === 0.3

Про ГПСЧ:
Если возможности позволяют, то два и более ГПСЧ (с разных устройств) помогают создать нормальный рандом. В отдельных случаях движения мыши вполне годны для ГСЧ.
Всего голосов 1: ↑1 и ↓0+1
Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Публикации

Показать лучшие за всё время
Изменить настройки темы

Истории

Ваш аккаунт

Разделы

Информация

Услуги

Техническая поддержка
© 2006–2024, Habr