Progress® Telerik® UI for ASP.NET MVC Feedback Portal
Back to Feed
Request a Feature Report a Bug
Unplanned
Last Updated: 15 Dec 2020 15:05 by ADMIN
James
Created on: 11 Dec 2020 23:04
Category: Diagram
Type: Feature Request
1
Diagram TextBox with Strikethrough

In a Telerik MVC Diagram, how do I make this text have a strikethrough?

            g.append(new dataviz.diagram.TextBlock({
                text: dataItem.AuditText,
                x: 30,
                y: 30,
                color: "#fff",
                stroke: "solid"
            }));

Thank you!

James

3 comments
ADMIN
Alex Hajigeorgieva
Posted on: 15 Dec 2020 15:05

Hello, James,

I have now moved this thread to the Public Feedback portal and others will be able to upvote it.

As for the CSS classes support, this forum thread goes into more details. 

However, if the custom look is needed and you cannot achieve it with the available Diagram API and Drawing API, you may temporarily render HTML, convert it to drawing primitives and remove it. Here is the how-to article:

https://docs.telerik.com/kendo-ui/controls/diagrams-and-maps/diagram/how-to/external-content-in-shapes

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

James
Posted on: 14 Dec 2020 14:35

Hi Alex,

 

Thank you ,and yes, please open a feature request request on my behalf, I would appreciate that.

Is there a way to add CSS classes to diagram elements; such as, the text box, etc.?

 

Thank you!

ADMIN
Alex Hajigeorgieva
Posted on: 14 Dec 2020 13:59

Hi, James,

To add the strikethrough to the<text> SVG element, we would need to expose a separate property for the TexBlock element. I can log a feature request on your behalf if you like.

Meanwhile, I would suggest using CSS:

  <style>
      text[fill="#fff"]{
        text-decoration:line-through;
      }
  </style>

If you need to strike through some text but not other, you could use one of the other properties of the text block to distinguish the one that requires text decoration. here is a runnable Dojo for your reference:

https://dojo.telerik.com/@bubblemaster/EVENeNoZ

Let me know in case you need further assistance.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Create an account Log In
View
Type
Status
Category