2009-12-03 4 views
16

Mon ami et moi avons l'intention de construire une boutique en ligne. L'une des principales caractéristiques du magasin est la capacité du client à concevoir ses propres produits. Mon ami a pris polyvore website comme exemple.bibliothèque d'éditeur d'image Javascript

Le lien ci-dessus pointe vers une page d'éditeur. Dans polyvore, le client peut faire glisser et déposer des éléments de droite à une «toile» dans le côté gauche de la page. l'image possède un gestionnaire simple pour redimensionner, faire pivoter et déplacer.

C'est la caractéristique principale que nous voulons atteindre. Je veux savoir s'il existe une bibliothèque JavaScript gratuite qui offre ces fonctionnalités? Nous n'avons pas besoin de trop d'avance, car l'objectif n'est pas de faire quelque chose comme une application Photoshop en ligne. L'éditeur polyvore possède la plupart des fonctionnalités dont nous avons besoin.

+0

FYI, je préfère utiliser jQuery et jQuery-UI. Mais il ne ferme pas une chance pour un autre cadre, si la bibliothèque seulement pour ce cadre. J'attends encore plus de réponses, pendant que je regardais. Je pourrais également envisager de faire un, peut-être en utilisant toile, donc si vous avez un bon lien tutoriel, n'hésitez pas à le partager ici, je vais voter le bon tutoriel. Merci –

+0

Avez-vous eu du succès? Je serais intéressé de savoir ce que vous avez trouvé notre ou éventuellement utilisé. Je développe une application similaire et bien que je me penche vers jQuery, je détesterais retravailler quelque chose qui a déjà été fait ... Merci! – TomO

+0

Salut Tom. Le projet lui-même a été mis en attente, donc je n'ai plus cherché la bibliothèque. N'hésitez pas à essayer les bibliothèques suggérées dans les réponses ci-dessous. –

Répondre

6

Pixastic dispose d'un éditeur d'image Javascript simple qui utilise Canvas.

+3

Un éditeur d'image javascript très bas et simple: http://code.google.com/p/svg-edit/ (essayez la démo) – Kartoch

+1

http: //editor.pixastic.com utilise canvas, non pris en charge par IE –

+1

le projet est annulé, mais pixastic semble prometteur. Peut-être que je vais essayer plus tard pour les autres projets –

1

Si vous développez votre application à l'aide d'un framework JavaScript complet, tel que Cappuccino ou SproutCore, ce type de manipulation d'image légère devrait être simple à mettre en œuvre. Si vous voulez un peu plus de flexibilité avec l'implémentation du site, optez pour une bibliothèque plus petite comme jQuery UI ou Interface Elements (c'est une liste très incomplète - il y a des tonnes de bibliothèques similaires).

0

Ce ne sera pas une réponse complète, mais devrait vous guider. Ext-js a un objet appelé Ext.Resizable, http://www.extjs.com/deploy/dev/docs/?class=Ext.Resizable, vous pouvez l'appliquer à n'importe quel noeud et il ajoutera des poignées pour le redimensionner. Ce n'est pas présent dans leur distribution principale (jsquery-like), vous avez besoin de la distribution complète.

La rotation des images est plus compliquée car elle n'est pas supportée par tous les navigateurs (webkit permet la rotation par css). Ce que je suggère est que vous utilisez une bibliothèque de toile de navigateur croisé, comme http://me.eae.net/projects/iecanvas/demo.html, qui vous permet de faire pivoter les images qui sont dessinées sur le canevas. Cependant, vous ne pouvez pas vraiment combiner les deux que j'ai mentionnés, je vous suggère de les regarder tous les deux pour l'inspiration et de sortir les vôtres (sauf si quelqu'un d'autre trouve un outil qui le fait déjà)

Questions connexes