Results 1 to 3 of 3

Thread: How can I carry out the functionality of image cut with ExtJS4

  1. #1

    Default How can I carry out the functionality of image cut with ExtJS4

    Hi,everyone.
    Now I want to carry out the image-cut functionality like the pic below:
    未命名.jpg
    I know that some jquery plugin like 'imgareaselect' can do it,but that only works in the <img> label.
    Now I want to do it with ExtJS4 and I hope it to works in the <div> label.
    Anyone help me?

  2. #2
    Sencha Premium Member skirtle's Avatar
    Join Date
    Oct 2010
    Location
    UK
    Posts
    3,791
    Answers
    585

    Default

    Could you describe what you actually want it to do? Is it just a resizable area with the rest of the element masked out? Are the co-ordinates of the 'cut-image' sent off to a server for processing or are you trying to cut the image client-side?

    I don't believe there's anything out-of-the-box to do this but it should be achievable.

  3. #3
    Ext JS Premium Member christocracy's Avatar
    Join Date
    Oct 2006
    Location
    Montreal
    Posts
    381

    Default Beyond ExtJS

    Cutting / Cropping images is beyond the scope of ExtJS. Seems like you need the server-side involved here. Perhaps you send the co-ords of the selected area (top-left/bottom-right) to the server which uses something like ImageMagick.

    Or perhaps you use the co-ords to adjust the css-properties of a background image (by interacting with methods of Ext.Element) to *fake* a cut/crop.

    Anyway, this functionality is beyond the scope of ExtJS.
    /**
    * @author Chris Scott
    * @business www.transistorsoft.com
    * @rate $150USD / hr; training $500USD / day / developer (5 dev min)
    *
    * @SenchaDevs http://senchadevs.com/developers/transistor-software
    * @twitter http://twitter.com/#!/christocracy
    * @github https://github.com/christocracy
    */

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •