Tom2: Breite eines Objekts

Hi Leute

Ich versuche eine dynamisch generierte SVG-Grafik in meinen HTML-Code einzubinden, was mit dem folgenden Konstrukt geschieht:

<object data="project_svg.asp" width="2000" height="300" type="image/svg+xml">
<embed src="project_svg.asp" width="2000" height="300" type="image/svg+xml"></object>

Wie ihr seht ist die Grafik ziemlich breit. Zu breit für den Bildschirm. Mein Problem ist nun, dass die Grafik ohne jegliche Beanstandung einfach abgeschnitten wird, wenn ich das width-Attribut weglasse. Dieses ist mir nämlich unbekannt und kann stark varieren. Weiss vielleicht irgend jemand hier im Forum, wie ich den IE zum kompletten Darstellen ohne dieses Attribut bewegen kann? Ich bin für jede Hilfe dankbar.

FG & Thanks

Tom2

  1. Hallo,

    Weiss vielleicht irgend jemand hier im Forum, wie ich den IE zum kompletten Darstellen ohne dieses Attribut bewegen kann?

    Generiere doch die HTML-Seite, welche das dynamische SVG-Dokument einbindet, ebenfalls dynamisch mit den jeweils aktuellen Angaben von Breite und Hoehe.

    Passe alternativ den SVG-Code an, sodass immer eine feste Breite bzw. Hoehe im Wurzelelement und im HTML-Code steht und regele die Relation zwischen den Koordinatensystemen (intern/user) mittels viewBox-Attribute (viewBox="x y width height").

    MfG, Thomas

  2. Hallo Tom2!

    Wenn Du die Datei dynamisch generierst sollten diese Daten serverseitig zu erfragen sein und dann auch mit dem Quelltext gerendert werden können. Da wir weder Deine Serverseitige Scriptsprache wissen, noch etwas von Deinem relevanten Quelltext zu sehen bekommen, kann Dir hier wahrscheinlich schlecht jemand helfen.

    Schönen Gruß

    Afra

    1. hallo afra,

      Da wir weder Deine Serverseitige Scriptsprache wissen, noch etwas von Deinem relevanten Quelltext zu sehen bekommen, kann Dir hier wahrscheinlich schlecht jemand helfen.

      Das ist ein Irrtum. Die "Servertechnik" ist uninteressant, interessant ist, was im Browser ankommt. Und da muß man allerdings weiterfragen. Der IE selbst kann keine SVG-Grafiken anzeigen, er braucht ein plugin dafür. Es gibt dann, wie Thomas angemerkt hat, die Möglichkeit, im SVG selbst Breitenangaben zu machen, und _nicht_ im <object>-tag.

      Grüße aus Berlin

      Christoph S.

      1. Hallo,

        Es gibt dann, wie Thomas angemerkt hat, die Möglichkeit, im SVG selbst Breitenangaben zu machen, und _nicht_ im <object>-tag.

        Es ist sinnvoll an beiden Stellen etwas anzugeben, vor allem dann, wenn man flexibel sein will und im SVG als Breite bzw. Hoehe jeweils 100% eingestellt hat und im Browser wiederum eine bestimmte feste Flaeche fuellen moechte (siehe das Flaggen-Beispiel).

        MfG, Thomas

      2. Hallo Christoph!

        In Ausgangsposting stand aber, dass der IE die Daten in der richtigen breite darstellt wenn der Quellcode mit den Breiten definiert ist. Daher sollte der von mir beschriebene Lösungsansatz ausreichend sein. Etwas anderes können wir anhand der bisherigen Angaben vom Vorposter nicht sagen.

        Schönen Gruß

        Afra

        1. hallo afra,

          Daher sollte der von mir beschriebene Lösungsansatz ausreichend sein.

          Wenn du damit auf "sollten diese Daten serverseitig zu erfragen sein und dann auch mit dem Quelltext gerendert werden können" anspielst, ist das richtig.

          Etwas anderes können wir anhand der bisherigen Angaben vom Vorposter nicht sagen.

          Doch. Seine Frage läßt sich tatsächlich zufriedenstellend beantworten, der genaue Quelltext sowie die eingesetzte Servertechnologie sind für _diese_ Fragestellung zweitrangig.

          Grüße aus Berlin

          Christoph S.

    2. Hi Afra

      Wenn Du die Datei dynamisch generierst sollten diese Daten serverseitig zu erfragen sein und dann auch mit dem Quelltext gerendert werden können.

      Leider nein: Wie du an meinem geposteten Quelltext siehst, ist die Datenquelle ein eigenständiges _ASP_-Skript, welches von der einbindenden HTML-Seite getrennt ist. Die Skriptsprache, die ich verwende, ist VBScript.

      Da wir weder Deine Serverseitige Scriptsprache wissen, noch etwas von Deinem relevanten Quelltext zu sehen bekommen, kann Dir hier wahrscheinlich schlecht jemand helfen.

      Wer lesen kann ist klar im Vorteil *nichtbösmein*. Mein Problem ist, dass die Grafik bei einer relativen Breitenangabe (oder ohne jegliche) am Fensterrand abgeschnitten wird, was ich durch den Browser, also per HTML, zu verhindern versuchte. Ich möchte die Grafik nicht skalieren, sondern im Browserfenster einen Scrollbalken erscheinen lassen. Anscheinend bleibt mir jedoch nicht anderes übrig, als die Grafik nach Thomas' Vorschlag zu verkleinern.

      FG & besten Dank

      Tom2

      1. Hallo,

        Mein Problem ist, dass die Grafik bei einer relativen Breitenangabe (oder ohne jegliche) am Fensterrand abgeschnitten wird, was ich durch den Browser, also per HTML, zu verhindern versuchte.

        Keine Angabe zu width bewirkt 100% Breite und diese 100% beziehen sich auf die Fensterbreite (wie andere Prozentwerte auch). Daraus ergibt sich (mit der Hoehe) der so genannte Viewport und der ueberstehende Rest wird abgeschnitten.

        Anscheinend bleibt mir jedoch nicht anderes übrig, als die Grafik nach Thomas' Vorschlag zu verkleinern.

        Das viewBox-Attribut ist ja gerade fuer solche Faelle gedacht (wobei ggf. auch noch das Attribut preserveAspectRatio zur Beschreibung der Proportionen von Interesse ist).

        Hier mal ein kleines (vereinfachtes) Codestueck, welches der Grafik eine Breite von 640 x 480 px zuweist. Das Attribut viewBox deckt jeweils die 4-fache Breite bzw. Hoehe in internen Koordinaten ab. Der Kreis ist wiederum auf diese internen Koordinaten bezogen und wird auf der 640 x 480-Flaeche zentriert dargestellt.

          
        <svg width="640" height="480" viewBox="0 0 2560 1920">  
          
          <circle cx="1280" cy="960" r="200" fill="#F00"/>  
          
        </svg>
        

        Auf diese Weise lassen sich auch sehr große Werte darstellen, was z. B. den Kartografen zugute kommt.

        MfG, Thomas