ChatGPT – erster Test, erstaunliche – gute Ergebnisse

Das ist wirklich erstaunlich … GUT. Hut ab. Da kommt einiges auf uns zu. Hier steht meine Anfrage:

Erstelle eine svg Grafik mit dem Text “IRR”. Erstelle eine Animation die den text rotiert.

IRRbert

Das spukt der Chat aus:

<svg width="100" height="100">
  <text x="50" y="50" font-size="40">
    <animateTransform attributeName="transform" type="rotate" from="0 50 50" to="360 50 50" dur="1s" repeatCount="indefinite"></animateTransform>
    IRR
  </text>
</svg>

So siehts aus:

Toll, klappt!!!

Bitte die Grafik doppelt so groß.

<svg width="200" height="200">
      <text x="100" y="100" font-size="80">
        <animateTransform attributeName="transform" type="rotate" from="0 100 100" to="360 100 100" dur="1s" repeatCount="indefinite"/>
        IRR
      </text>
    </svg>

Sehr schön. jetzt sollte der text noch etwas auf und ab hüpfen.

<svg width="200" height="200">
      <text x="100" y="100" font-size="80">
        <animateTransform attributeName="transform" type="rotate" from="0 100 100" to="360 100 100" dur="1s" repeatCount="indefinite"/>
        <animate attributeName="y" values="100;110;100" dur="0.5s" repeatCount="indefinite"/>
        IRR
      </text>
    </svg>

Bitte das hüpfen 4 x stärker!

<svg width="200" height="200">
      <text x="100" y="100" font-size="80">
        <animateTransform attributeName="transform" type="rotate" from="0 100 100" to="360 100 100" dur="1s" repeatCount="indefinite"/>
        <animate attributeName="y" values="100;90;110;90;100" dur="0.5s" repeatCount="indefinite"/>
        IRR
      </text>
    </svg>

Wahnsinn, ich bin begeistert. Weiter:

Erstelle eine 200 x 200 px svg grafik . Darau der rote Text “IRR”. Die Farbe des Textes soll animiert werden von rot nach blau nach rot in 1 sekunde.

<svg width="200" height="200">
  <text x="100" y="100" font-size="50" fill="red" text-anchor="middle">
    IRR
  </text>
  <animate attributeType="CSS" attributeName="fill" values="red;blue;red" dur="1s" repeatCount="indefinite" />
</svg>

Das hat nicht geklappt, der Text bleibt rot.

I apologize for the mistake in my previous response. Here is the corrected code that should animate the color of the text from red to blue to red in 1 second:

<svg width="200" height="200">
  <text x="100" y="100" font-size="50" fill="red" text-anchor="middle">
    <animate attributeType="CSS" attributeName="fill" values="red;blue;red" dur="1s" repeatCount="indefinite" />
    IRR
  </text>
</svg>

Also es ist wirklich erstaunlich. Er entschuldigt sich sogar für seine Fehler. Aber was war nun an der ersten Variante falsch?

Ich hab es mir mal angesehen. in der ersten Variante steht der Animate-Befehl nicht innerhalb des TXT-Tag. Das muss er schainbar aber , wie in der zweiten Version geschehen.