HTML content inside a diagram/splitting text into multiple rows

2 posts, 0 answers
  1. colin
    colin avatar
    1 posts
    Member since:
    Apr 2016

    Posted 13 Sep 2018 Link to this post

    I found an example using an older code base of kendo that allows for HTML content inside of a diagram but seems to have been removed under current release (see link below).  Is there a way to add HTML content to a diagram? 

    https://jsfiddle.net/Orbifold/mfcar358/

    Second question I have is how to do a newline character inside content to split text on two rows?  I tried \r\n, etc. but nothing works.

     

    var diagram = $('#diagram')
                .kendoDiagram({
                    shapes: [{
                        width: 150,
                        height: 100,
                        content:{
                            text:"I want to split this\r\n into two rows",
                            align: "center middle"
                        }
                    }]
                })
                .getKendoDiagram();
  2. Tsvetina
    Admin
    Tsvetina avatar
    2481 posts

    Posted 17 Sep 2018 Link to this post

    Hi Colin,

    This example does not seem to work in the jsfiddle and didn't work when I tested it in a Dojo using the quoted Kendo UI version (2015.1.318).

    In general, to render the visual equivalent of an HTML declaration inside the Diagram shapes, you can follow this example:
    Render External Content in Shapes

    To see how to split shapes text into multiple lines, you can check this example:
    Wrap Text

    Regards,
    Tsvetina
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top