<p><span style="color: #3C556F;">Lieber <span style="text-decoration: underline;">XING-Kontakt</span>, vielen Dank f&uuml;r Ihren Besuch!</span></p>
<p><span style="color: #3C556F;">Die Bezeichnung <span style="text-decoration: underline;">SVG</span> ist die Abk&uuml;rzung von &#8222;<span style="text-decoration: underline;">Scalable Vector Graphics</span>&#8220; und bedeutet auf Deutsch <span style="text-decoration: underline;">skalierbare Vektorgrafik</span>. Damit lassen sich Vektorgrafiken auch in den derzeit <span style="text-decoration: underline;">g&auml;ngigsten Webbrowsern</span> darstellen.</span></p>
<p><span style="color: #3C556F;">Auch <span style="text-decoration: underline;">Animationen</span> k&ouml;nnen z.B. mit JavaScript sehr einfach umgesetzt werden. Grafische Elemente wie Kreis, Ellipse, Rechteck, Pfad, Linie, Texte, usw. dienen dabei als <span style="text-decoration: underline;">Grundelemente</span> (grafische Primitive), die beliebig kombiniert werden k&ouml;nnen.</span></p>
<p><span style="color: #3C556F;">Zu den wesentlichen <span style="text-decoration: underline;">Vorteilen</span> z&auml;hlen die M&ouml;glichkeit zur <span style="text-decoration: underline;">gr&ouml;&szlig;eren Darstellung</span> von Grafiken m&ouml;glichst <span style="text-decoration: underline;">ohne Qualit&auml;tseinbu&szlig;en</span>.</span></p>
<p><span style="color: #3C556F;">Es gibt dazu auch zahlreiche <span style="text-decoration: underline;">JavaScript Bibliotheken</span> wie z.B. Velocity, SnapSVG, usw. Mit diesen k&ouml;nnen skalierbare Vektorgrafiken zumeist deutlich <span style="text-decoration: underline;">einfacher</span> in Webseiten eingebunden, sowie auch <span style="text-decoration: underline;">animiert</span> werden.</span></p>
<p><span style="color: #3C556F;">Da es aber auch schon einige solcher JavaScript Bibliotheken gegeben hat, die es mittlerweile nicht mehr gibt bzw. nicht mehr aktualisiert werden, kann es auch hierbei sinnvoll sein, die <span style="text-decoration: underline;">notwendigen Skripte</span> f&uuml;r <span style="text-decoration: underline;">Animationen</span>, usw. selbst zu erstellen.</span></p>
<p><span style="color: #3C556F;">Darunter habe ich ein <span style="text-decoration: underline;">einfaches Beispiel</span> einer solchen selbst erstellten und animierten <span style="text-decoration: underline;">skalierbaren Vektorgrafik</span> erstellt.</span></p>
<p><iframe loading="lazy" id="svg-html5-1" style="width: 500px; height: 300px; overflow: hidden;" src="https://files.schoenberg.mobi/svg-projekte/svg-beispiel-1.html" width="500" height="300" scrolling="no" frameborder="0"></iframe></p>
<p><span style="color: #3C556F;">und hier wie immer ein Glitze-Kleines-Bisschen <span style="text-decoration: underline;">Werbung</span> :-(</span></p>
<p><a href="http://schoenberg.co.at/marketing/"><img src="https://files.schoenberg.mobi/banner_0009l.gif" alt="schoenberg - think MINI" /></a></p>

<br />
          <div style="background-image: url('https://schoenberg.co.at/blog-software/wp-content/plugins/schoenberg-add-content/gesamt Blatt_4c_t1.png'); background-repeat:no-repeat; background-size: 760px 300px;">
              <p><span style="color: #3C556F;"><span style="text-decoration: underline;">Tools, Software & Programme</span> aufgrund <span style="text-decoration: underline;">DSGVO</span> leider <span style="text-decoration: underline;">nicht mehr verf&uuml;gbar !!</span> Fehler, Irrt&uuml;mer, usw. <span style="text-decoration: underline;">nicht ausschlie&szlig;bar</span>!</span></p>
              <p><span style="color: #3C556F;">vielen Dank f&uuml;r Ihr Verst&auml;ndnis und Ihnen sch&ouml;ne Gr&uuml;&szlig;e, </span></p>
              <p><span style="color: #3C556F;">Christian Sch&ouml;nberg (privater Blogartikel)</span></p>
              <p></p>
              
              <a target="_blank" href="https://www.xing.com/spi/shares/new?url=https%3A%2F%2Fschoenberg.co.at%2Fblog-software%2Fwp-json%2Fwp%2Fv2%2Fposts%2F3532"><img src="https://schoenberg.co.at/xing_51x51__I.gif" onmouseover="this.src='https://schoenberg.co.at/xing_51x51__II.gif';" onmouseout="this.src='https://schoenberg.co.at/xing_51x51__I.gif';" alt="XING.com - Netzwerk f&uuml;r Beruf und Leben" /></a> &nbsp;&nbsp;&nbsp; 
              <a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fschoenberg.co.at%2Fblog-software%2Fwp-json%2Fwp%2Fv2%2Fposts%2F3532" alt="Facebook" /><img src="https://schoenberg.co.at/facebook_51x51__I.gif" onmouseover="this.src='https://schoenberg.co.at/facebook_51x51__II.gif';" onmouseout="this.src='https://schoenberg.co.at/facebook_51x51__I.gif';" alt="Facebook" /></a> &nbsp;&nbsp;&nbsp; 
              <a target="_blank" href="https://twitter.com/share" data-url="https%3A%2F%2Fschoenberg.co.at%2Fblog-software%2Fwp-json%2Fwp%2Fv2%2Fposts%2F3532"><img src="https://schoenberg.co.at/twitter_51x51__I.gif" onmouseover="this.src='https://schoenberg.co.at/twitter_51x51__II.gif';" onmouseout="this.src='https://schoenberg.co.at/twitter_51x51__I.gif';" alt="Twitter" /></a>
              
          </div>   
{"id":3532,"date":"2017-09-11T22:26:12","date_gmt":"2017-09-11T22:26:12","guid":{"rendered":"https:\/\/schoenberg.co.at\/blog-software\/?p=3532"},"modified":"2017-09-11T22:26:32","modified_gmt":"2017-09-11T22:26:32","slug":"svg-skalierbare-vektorgrafiken-in-webseiten-einbinden","status":"publish","type":"post","link":"https:\/\/schoenberg.co.at\/blog-software\/2017\/09\/svg-skalierbare-vektorgrafiken-in-webseiten-einbinden\/","title":{"rendered":"SVG: skalierbare Vektorgrafiken in Webseiten einbinden"},"content":{"rendered":"","protected":false},"excerpt":{"rendered":"<p>Lieber XING-Kontakt, vielen Dank f&uuml;r Ihren Besuch! Die Bezeichnung SVG ist die Abk&uuml;rzung von &#8222;Scalable Vector Graphics&#8220; und bedeutet auf Deutsch skalierbare Vektorgrafik. Damit lassen sich Vektorgrafiken auch in den derzeit g&auml;ngigsten Webbrowsern darstellen. Auch Animationen k&ouml;nnen z.B. mit JavaScript sehr einfach umgesetzt werden. Grafische Elemente wie Kreis, Ellipse, Rechteck, Pfad, Linie, Texte, usw. dienen [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[1,95,208,139],"tags":[145,633,670,669,668],"_links":{"self":[{"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/posts\/3532"}],"collection":[{"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/comments?post=3532"}],"version-history":[{"count":3,"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/posts\/3532\/revisions"}],"predecessor-version":[{"id":3535,"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/posts\/3532\/revisions\/3535"}],"wp:attachment":[{"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/media?parent=3532"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/categories?post=3532"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/schoenberg.co.at\/blog-software\/wp-json\/wp\/v2\/tags?post=3532"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}