Сколько изображений необходимо для создания эффекта спинового изображения JavaScript 360 градусов?

StackOverflow https://stackoverflow.com/questions/4466600

Вопрос

Я смотрел на некоторые демонстрации в Apple, демонстрируя несколько крутых демо HTML5, CSS3 и JavaScript, и я был заинтригован Вот этот, 360 -градусный просмотрщик продукта.

Мне было интересно много фотографий, которые, по вашему мнению, мне нужно было попытаться повторить это. Сами яблоко говорит several На странице, но это не очень описательно.

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

Спасибо.

Это было полезно?

Решение

Они не указывают, потому что нет реального ответа. Если вы хотите, чтобы он был супер-гладким, 360 изображений были бы хороши. Apple использовала 72. Вы можете использовать любое число от 2 до 72 до 360, чтобы технически получить эффект, так что это ваш звонок, сколько работы стоит того, насколько гладким эффект.

Извиняюсь.

Другие советы

Демо использует 72 изображения.

Между прочим, демонстрация, кажется, просто обновляет изображение src атрибут.

Зависит от точности ротации, которое вы хотите.

Там нет фиксированного числа.

В этом конкретном примере они используют 72.

изображения можно найти в http://developer.apple.com/safaridemos/showcase/threesixty/images/optimized/seq_v04_640x378_72.jpg

заменить последнее 72 часть URL с 01 к 72 Чтобы получить все изображения.

Тебе нужно several, это настолько описательно, насколько это возможно.

Но обратите внимание на одну вещь. Если вы загружаете их в определенном порядке, вы можете получить прогрессивный эффект.

Например, загружайте первое «север» и «юг». Затем "Восток" и "Запад". Затем «Северо -Запад», «Юго -Запад», «Северо -Восток» и «Юго -восток» и так далее, таким образом, вы можете иметь более 72 изображений, но пользователю не придется ждать, чтобы получить постепенно плавный опыт.

Обратите внимание, что в этом случае вы будете загружать их силами двух.

1 -я нагрузка (после того, как одно изображение уже есть): 1 Изображение (противоположное)
2 -я нагрузка: 2 изображения (стороны)
3 -я нагрузка: 4 изображения
4 -я нагрузка: 8 изображений
...
8 -я нагрузка: 128 изображений.

Обратите внимание, что вы не будете использовать степени так легко. (Они просто должны были разделить на 5, 360/5 = 72)
Для расчета, какое изображение находится в заданной степени, вы бы использовали интерполяцию.
Итак, сначала вы интерполируете на 360 градусов до 2 (изображений), затем до 4, затем 8 ... чтобы узнать, какое изображение выбрать на основе которого у вас есть

Легкое объяснение интерполяции здесь.

Из визуального, а не технического ... плавность ротации - это фактор, который вы хотите посмотреть, сколько изображений вам нужно. Размер, если объект и уровень детализации помогают в ответе, у вас есть полоса пропускания. 20 изображений - минимум, 40 - хорошая рекомендация, но 72 выглядит великолепно. Помните, что если это фотография, каждое изображение добавляет больше работы и сложности.

Вот диаграмма, помогающая продемонстрировать количество изображений.http://www.photospherix.com/matrix.html

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

http://lukedurrant.com/2011/08/apples-360-rotating-ipod-html-5-source-code-dowdload/

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top