search

motiondivision / motionone

https://motion.dev
MIT License
2.95k stars 52 forks source link

Object literal may only specify known properties, and 'x1' does not exist in type 'MotionKeyframesDefinition'.ts(2353) #264

Closed Ladvace closed 4 months ago

Ladvace commented 4 months ago

is there a way to animate the linearGradient properties such as x1, y1, etc.? .

animate(
    "#paint0_linear_21_128",
    {
      x1: ["0.696289", "0.696289"],
      y1: ["609.792", "-72.6894"],
      x2: ["0.696289", "0.696289"],
      y2: ["-72.6894", "609.792"],
    },
    {
      duration: 2,
      repeat: Infinity,
    }
  );
  <linearGradient
            id="paint0_linear_21_128"
            x1="0.696289"
            y1="609.792"
            x2="0.696289"
            y2="-72.6894"
            gradientUnits="userSpaceOnUse"
          >
            <stop stop-color="#0A2E0A"></stop>
            <stop offset="1" stop-color="#48DD48"></stop>
          </linearGradient>
Ladvace commented 4 months ago

found the answer: https://motion.dev/docs/faqs

Motion One is built on top of the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API). As such, it's currently capable of animating CSS styles on HTML or SVG elements.

It can't currently animate SVG attributes like d