(Einfache) Bildbearbeitung/-erstellung

[maxxscho]

Hallo Leute!

Habe eine Anfrage bekommen und bin gerade etwas an recherchieren.
Folgende Anforderung:
Es handelt sich um den Verkauf von Broschen (Schmuckstück ;-). Hier will der Verkäufer seinen Kunden einen einfachen, kostenlosen Webdienst anbieten,
wo der Kunde seine Foto hochladen kann, darüber soll eine Art Maske gelegt werden, die der Form der Brosche entspricht, der Bereich des Fotos soll anpassbar sein und dann kann das Bild mit den Schnittmarken für die Brosche ausgedruckt werden können und der Kunde schneidet es aus und es passt genau in die Brosche.
Dies soll es dem Kunden erleichtern, ein Foto für seine Brosche zurechtzuschneiden.

Das ganze sollte doch mit JS/PHP möglich sein? Was meint ihr, habt ihr dazu ein paar Ansätze??

Danke im Voraus!

Gruss!

 

[fakerer]

AW: (Einfache) Bildbearbeitung/-erstellung

hi,
also bei mir ist ne Brosche eher n Schmuckstück da gibts kein Foto
aber wie auch immer wenn man keine Wölbungen oder so berücksichten muss, könnte man vielleicht einfach Foto hochladen und darüber zeigt man dann ein transparentes div mit der Maske an welches man per drag and drop verschieben kann oder wie auch immer und dann das ganze ausdrucken.
Im Prinzip müsstest du ja dann eine relative Posistion der beiden bilder dann haben und dies sollte ja dann zum Ausrucken gehen.

 

[maxxscho]

AW: (Einfache) Bildbearbeitung/-erstellung

Ja, eine Brosche ist ein Schmuckstück, dass man öffnen kann und da kannst du dann ein Foto von deiner(m) Liebsten, Hund, Katze, was auch immer rein geben. Und diese hat meist eine ovale und oder runde Form. Dafür soll man dann einfach sein Foto hochladen können und eben die Maske, die die Form und abmessungen der Brosche hat drüberlegen.

Hab mir das auch so in der Art wie du gedacht, also mit Drag&Drop. Dann wäre einfach mit JS/jQuery möglich. Interessant wirds aber beim Ausdrucken...
wie werden hier die Pixel in mm umgerechnet? Denn das Foto muss dann genau passen. Hatte damit noch nie zu tun.

 

[cebito]

AW: (Einfache) Bildbearbeitung/-erstellung

Dafür ist Canvas wie geschaffen. Klick mal links auf Play und geh mal die einzelnen Sachen durch genau so könnte auch dein Bild skaliert, gedreht, gespiegelt oder sonstwas werden und im Rahmen, der natürlich auch oval oder was auch immer sein könnte dargestellt werden. Dazu gibt es dann auch Methoden, das ganze als Bild zu speichern, Bspw. <canvas> - Grafik speichern 2 (Ajax, toDataURL)

 

[maxxscho]

AW: (Einfache) Bildbearbeitung/-erstellung

Ok, das ganze schaut sehr interessant aus. Werd mir das mal genauer ansehen und sonst nochmals nachfragen.


Danke!