Large Image

5 posts, 0 answers
  1. Martin Roussel
    Martin Roussel avatar
    246 posts
    Member since:
    Jan 2010

    Posted 09 Dec 2013 Link to this post

    Hi,

    im trying to use a "large" Image in my RadImageEditor (using Q3 2012). The Image is a 8.17MB .jpg and is 7069px x 4907px. I can load it in the editor but cant use any feature after that. Either the browser (Chrome 31) crashes or the control event never gets launched (and code just hangs). What are the image size/high-resolution limitations with the control?

    UPDATE: Im now trying with a smaller jpg image which is 408KB and 1600px x 900px. Now I can do some image operation on it like crop, rotate,etc. but the OnImageSaving event never get launched when I want to call my custom save function.

    Note that everything works perfectly with this jpg image which is 244KB and 800px x 600px.

    here is my code:
    <telerik:RadImageEditor ID="RadImageEditor1" runat="server" Width="680" Height="450" OnImageLoading="RadImageEditor1_ImageLoading" OnImageSaving="RadImageEditor1_ImageSaving" OnClientSaved="OnClientSaved" OnClientCommandExecuting="OnClientCommandExecuting" ExternalDialogsPath="~/ImageEditorDialogs">
                            <Tools>
                                    <telerik:ImageEditorToolGroup>
                                        <telerik:ImageEditorToolStrip CommandName="Undo" />
                                        <telerik:ImageEditorToolStrip CommandName="Redo" />
                                        <telerik:ImageEditorTool CommandName="Reset" />
                                        <telerik:ImageEditorTool CommandName="Save" ToolTip="Save Image" />
                                        <telerik:ImageEditorTool CommandName="Crop" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="Resize" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="Zoom" />
                                        <telerik:ImageEditorTool CommandName="ZoomIn" />
                                        <telerik:ImageEditorTool CommandName="ZoomOut" />
                                        <telerik:ImageEditorTool CommandName="Opacity" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="Rotate" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="RotateRight" />
                                        <telerik:ImageEditorTool CommandName="RotateLeft" />
                                        <telerik:ImageEditorTool CommandName="Flip" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="FlipVertical" />
                                        <telerik:ImageEditorTool CommandName="FlipHorizontal" />
                                        <telerik:ImageEditorTool CommandName="AddText" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="InsertImage" IsToggleButton="true" />
                                        <telerik:ImageEditorTool CommandName="Print" />
                                    </telerik:ImageEditorToolGroup>
                            </Tools>
        </telerik:RadImageEditor>
     
     
     <telerik:RadCodeBlock ID="codeblock1" runat="server">
              <script type="text/javascript">
                  function OnClientCommandExecuting(imEditor, eventArgs) {
                   
                      if (eventArgs.get_commandName() == 'Save') {
                      
                          imEditor.saveImageOnServer('', true);
                          //Prevent the buil-in Save dialog to pop up
                          imEditor.setToggleState('Save', false);
                          eventArgs.set_cancel(true);
                          
                      }
                  }
     
              </script>
         </telerik:RadCodeBlock>
    protected void RadImageEditor1_ImageSaving(object sender, Telerik.Web.UI.ImageEditorSavingEventArgs args)
    {
         /...
    }


    TIA
  2. Vessy
    Admin
    Vessy avatar
    1384 posts

    Posted 12 Dec 2013 Link to this post

    Hi Martin,

    We are aware of the first reported issue and it is connected with performance issues in Chrome related to the drawImage method, which is the essential method to edit the raster image. You can find more detailed information on the subject in the following Chrome issues: 117949, 121780.

    We are still investigating whether there is a way to workaround this behavior, so you can track the following item for any progress on the issue: ImageEditor crashes in Chrome when too big image is loaded in it

    Regarding the second issue, though - I was not able to reproduce it on my side. The ImageSaving event is triggered properly on my side - you can see the video from my test here.

    Regards,
    Veselina Raykova
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Martin Roussel
    Martin Roussel avatar
    246 posts
    Member since:
    Jan 2010

    Posted 12 Dec 2013 Link to this post

    Hi Veselina,

    Can you please try to replicate the issue by uploading first the image to the server like in this demo . Maybe setting the ImageURL at declaration might change things. Also, are you using Q3 2012 or the latest version?

     It seems in my case ive been able to trigger the ImageSaving was by using CanvasMode="No"

    Also, the issue link status you provided is marked as "Declined". Is it really still under investigation?

    TIA
  5. Martin Roussel
    Martin Roussel avatar
    246 posts
    Member since:
    Jan 2010

    Posted 13 Dec 2013 Link to this post

    UPDATE: Using CanvasMode="No" seems to help alot but create an issue im reporting at the bottom of this post

    UPDATE 2:  Decided to give 2013.3 1114  and problem with the second picture (nature) seems fixed. Still same problem with the large one.


  6. Vessy
    Admin
    Vessy avatar
    1384 posts

    Posted 17 Dec 2013 Link to this post

    Hello Martin,

    I am glad that upgrading RadControls to the latest version has fixed the second issue. Unfortunately, as explained in one of my previous replies, the issue with the large images is connected to a browser bug, which cannot be controlled by us. This is also the reason why the item is marked as declined - because it is not connected directly to the RadControls and cannot be fixed by us.

    Kind regards,
    Veselina Raykova
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017