Проблема
Привет всем, как следует из названия, я пытаюсь сделать кадр a-curvedimage. У меня есть следующие значения из динамического источника данных.
computedX: -365, //computedX: x + width / 2 - parentArtboardWidth / 2 (centering x origin)
computedY: 737, //computedY: -(y + height / 2) + parentArtboardHeight (centering y origin for aframe)
height: 350,
name: "white plane",
parentArtboardHeight: 1080,
parentArtboardName: "01",
parentArtboardWidth: 1920,
parentInstanceOf: "Artboard",
width: 686,
x: 252,
y: 168,
zIndex: 3
Теперь значения фактически работают точно, я хочу, чтобы они работали, но с плоским изображением. Однако для их изгибания мне нужно height radius и theta-length относительно image aspect ratio. Я знаю, как рассчитать image aspect ratio, но как я могу вычислить другие оставшиеся значения? Вот кодексанокс. не стесняйтесь попробовать это самостоятельно. https://codesandbox.io/s/optimistic-johnson-bykmn Обратите внимание, что если вы хотите изменить изображения с плоских на кривые, перейдите к line 189 и установите showCurved на true или false.
Ожидаемый результат : Я ожидаю немного искривить элементы, но не нарушая координаты x и y. В настоящее время координаты не являются правильными в a-curvedimage, хотя эти значения computedX computedY отлично работают на плоских изображениях.
Дополнительная информация
В кодовом окне (https://codesandbox.io/s/optimistic-johnson-bykmn),, где вы можете попробовать эту проблему самостоятельно:
- Line 189 Есть переменная showCurved, которую вы можете установить наtrue false для переключения между a-curvedimage и a-image.
- Формулы сейчас беспорядочные, но они присутствуют в Line 189 до Line 219.
- a-image сущностиСгенерированные из Line 234 и a-curvedimage Сгенерированные сгенерированные из Line 249.
Моя конечная цель - показать элементы в кривых (текущее количество кривой в порядке), но сделать их правильными, как когдав квартире.