Hallo@All.

Ich bin auf der Suche nach einer Möglichkeit einen variablen Text (mal kurz und mal lang) entlang eines Kreises zu schreiben.

Ich kenne mich leider nur etwas in PHP aus.

Ich habe schon hunderte Webseiten durchgelesen aber irgendwie will das nicht richtig funktionieren.

Kennt hier jemand eine Möglichkeit so etwas zu realisieren? Von mir aus auch in einer anderen Programmiersprache. Hauptsache ich muss nicht extra Software auf den Server installieren.

Mir ist alles recht. Hauptsache es funktioniert.

Kannst ja mal <canvas> probieren.
Der Text als Kreis:
http://stackoverflow.com/questions/6...as-circle-text

Browserunterstützung:
Firefox ab Version 3.5
Google Chrome ab Version 3.X
Opera ab Version 10.X
Safari ab Version 4.X

Der Canvas-Tag ist ein neues Element aus HTML5. Dieser Tag ermöglicht uns einfach und schnell Grafiken zu zeichnen, Bilder anzuordnen und erlaubt darüberhinaus auch Animationen zu erstellen. Canvas setzt jedoch ein Grundverständnis an HTML und Javascript voraus.
http://wiki.selfhtml.org/wiki/Doku:H...rafiken/Canvas

Ob da auch Ovale möglich sind kann ich dir nicht sagen. Aber wie schon mal vorgeschlagen evtl musst dir das wirklich als Funktion selbst proggen. Was du auch machen könntest den Betreiber der Website mal anzuschreiben und denjenigen zu fragen (Du hattest ja mal ne Besipielsite gezeigt ich glaub bei Coders Talk, wo es um das erstellen von Siegeln ging).

Weihnachtliche Grüsse Joe.

Hi,

zum Canvas Tag:
IE-Support und damit Support in allen relevanten Browsern kriegst du mit excanvas.js

Aber ich hätte noch zwei - bessere - Ideen:

1. Wenn du völlig unabhängig davon sein willst, welchen Browser jemand benutzt und ob er vielleicht sogar JS deaktiviert hat, benutz doch GD.
Wenn du PHP sowieso kannst (und magst) sollte dir diese Lösung eigentlich liegen.
zum Manual
(Dann aber bitte den Text als Alt-Attribut nicht vergessen!)

2. Wenns schnell gehen soll und (nur) ein Spaß-Projekt ist:
CSS3-Transform. Dafür giebs wie üblich auch nen Code-Generator: http://csswarp.eleqtriq.com/
(IE-Support + Support in älteren Versionen der "guten" Browser ist da aber nichtmal mittels Zusatz-Script ober ähnlichem möglich!!)

Gruß javaDeveloper2011

Danke erst einmal.

Ich benötige den Kreis mit dem Text zur weiteren Bearbeitung als Grafik. Ist dies mit den vorgeschlagenen Methoden möglich?

GD kommt leider nicht in Frage. Da verzweifeln sogar Fortgeschrittene PHP User dran...

Der User bekommt den Kreis mit dem Text ja zunächst nichts zu Gesicht. Der Kreis mit dem Text soll auf eine Grafik auf dem Server kopiert werden.

Ist dies mit Canvas möglich?

Das ganze ist flexibel genug um das so umzusetzen wie du es hier wünschst. Du kannst also den Text des Users als Variable oder Array speichern und ihn dann ausgeben lassen über deiner Grafik. Du könntest das Ergebniss des Textkreises dann speichern und müsstest nur den Hintergrund transparent bekommen. Aber ich glaub da fällt dir schon was ein, so lang wie du schon dran werkelst. Das ganze mit Imagecopy ineinander kopiert und fertig is das.

Probier doch erst mal ob das mit dem <canvas>"CircleText" überhaupt klappt, danach kommt das Imagecopy-Prob mit Tranzparenz (Stichwort wäre vielleicht Ovacity).

Weihnachtliche Grüsse Joe

Edit:
Grad das Prob erst richtig verstanden.
Ich befürchte das übersteigt meinen Horizont und Fähigkeiten.
http://canvas.quaese.de/index.php?nav=13,73&doc_id=73
Du willst den Text dann als Grafik speichern. Das umzustzen wird sicher gehen aber da bin ich echt überfragt.
Wem da was zu einfällt gerne!

Hi,

hoffe ich habe versanden was du willst.

Der Code ist zwar etwas kompliziert aber nicht besonders lang. Es funktioniert mit kurzen und langen Texten, solange ihre länge in einem bestimmten Rahmen ist.

PHP-Code:

<?php

    $SIZE = 500;
    $RELATIVE_GAP_BETWEEN_END_AND_BEGIN = 1/6;
    $TEXT = $_GET['text'];

    header("Content-type: image/png");
    $img = ImageCreate($SIZE, $SIZE);
    $BACKGROUND_COLOR = ImageColorAllocate($img, 222, 222, 222);
    $TEXT_COLOR = ImageColorAllocate($img, 0, 0, 0);

    $length = strlen($TEXT);
    $step = (360*(1-$RELATIVE_GAP_BETWEEN_END_AND_BEGIN ))/$length;
    for($i=0; $i<$length; $i++)
        ImageFTText($img, 16, $i*$step+170, $SIZE/2+$SIZE/3*cos(deg2rad(-1*($i*$step+250))), $SIZE/2+$SIZE/3*sin(deg2rad(-1*($i*$step+250))), $TEXT_COLOR, 'verdana.ttf', substr($TEXT, $length-1-$i, 1));

    ImagePNG($img);

?>

Leider geht es nicht ohne font-file, deshalb musst du die verdana.ttf z.B. von hier herunterladen und im Verzeichniss der PHP-Datei speichern!

Probier mal das hier aus, ich glaube das macht genau was du möchtest.
http://csswarp.eleqtriq.com/

Danke für die guten Antworten und euer Interesse.

Zitat von Sebastian Schmidt

Probier mal das hier aus, ich glaube das macht genau was du möchtest.
http://csswarp.eleqtriq.com/

Wie kann man denn das Bild speichern? Das ganze muss ja im Hintergrund passieren.

Zitat von bl5000

Wie kann man denn das Bild speichern? Das ganze muss ja im Hintergrund passieren.

Das ist kein Bild das ist CSS3 und HTML, also im Idealfall einfach in einem Feld in deiner Datenbank speichern . Guck dir mal den HTML-Code den die Seite ausgibt.

Es gibt also keine Möglichkeit das irgendwie als Bild zu speichern?

Naja du wolltest Text entlang einer Linie schreiben, das ist eher eine Grafik alternative, ich glaube das als Grafik zu speichern oder sowas in der Art wäre der falsche Ansatz. :/

Er braucht den Text als Grafik weil er den von User erstellten Text über (oder druter) einer anderen Grafik kopieren möchte. Die ganze so erstellte Grafik soll dann downloadable sein, so das der User eben jene Grafik zb als Logo benutzen kann.

@bl5000 was war nochmal das Prob mit GD? Mir fällt im obrigen Bsp. auf das es schräg ist.

Nochmal zum Canvas: Hab mich nun da etwas belesen und der Text an sich wäre eine Grafik und kann als solche auch gespeichert werden (auf dem Server). Wenn du das Bspl von mir gezeigt einfach mal probierst siehst ja schon obs dir gefällt. Transparenz ist übrigens auch möglich zur Not wirds eben unter deiner "Logo"grafik kopiert (dann müsste man eben einen transparenten Kreisausschnitt übers Logo kopieren).
Solange wie du da schon suchst (sind doch bestimmt schon Monate?) würde ich dir raten das in der Richtung zu versuchen. Das ganze wird nur etwas knifflig wegen den Javascript/Ajax aber dafür gibts hier ja auch Foren zum rückfragen.

Gruss Joe.

Joe, der Vorschlag von dir ist eigentlich der einzige der klappen könnte. Nur muss ich mal nach fertigen Codes suchen.

GD kommt nicht in Frage. Es macht zuviele Fehler.

http://jsfiddle.net/c3Y8M/1/
Das ist der bereits gezeigte Code.

Hier dein variabler Font
ctx.font = "bold 30px Serif";
Und hier kannst dein Text zb als Variable anzeigen lassen.
ctx.fillTextCircle("Irgendein Text oder Variable ",150,150,75,Math.PI / 2);

Das ganze speichert aber noch nix das müsste man dann noch machen.

Hi bl5000,

was ist denn so schlimm an GD?
Man kann damit das Bild dynamisch erstellen oder speichern und mir sind bisher nie "Fehler" aufgefallen!
Gefällt dir irgendwas an meinem Beispiel nicht?

Gruß javaDeveloper2011