Progress® Telerik® UI for ASP.NET AJAX Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 13 May 2022 16:59 by ADMIN
ADMIN
Vessy
Created on: 08 Sep 2014 14:10
Category: Diagram
Type: Feature Request
1
Add CssClass property to the Shape's ContentSettings
ContentSettings should have a property for CssClass:
<ContentSettings Text="Some txt" CssClass="myLabel" />

or a Style property:
<ContentSettings Text="Some txt" Style="font:bold 14px arial;color:red;" />

this would allow developers to style the textual elements in their diagrams.
3 comments
ADMIN
Vessy
Posted on: 13 May 2022 16:59

Hello,

As the shapes of the diagram are rendered via SVG objects, the CSS class/styles can be added to their HTML content like follows:

<style>
    .customShapeClass {
        color: red;
    }
</style>

    <telerik:RadDiagram ID="RadDiagram1" runat="server" Editable="false" Pannable="false" ZoomRate="0">
        <ClientEvents OnLoad="onDataBound" />
        <ShapesCollection>
            <telerik:DiagramShape Id="s1" X="700" Y="100">
               <ContentSettings Html="<div class='customShapeClass'>Red color</div>" />
            </telerik:DiagramShape>
            <telerik:DiagramShape Id="s2" X="200" Y="300">
                 <ContentSettings Html="<div style='color:blue;'>Blue color</div>" />
            </telerik:DiagramShape>
            ...

 

Regards,
Vessy
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/.

matt
Posted on: 01 Aug 2016 16:40 
good to see this and the other suggestions i made in beta are finally approved. had to use many work arounds
matt
Posted on: 09 Sep 2014 16:59 
when RadDiagram matures we'll definitely need a ways to style textual elements/shapes in our diagrams. currently the only way to do this is by manipulating the TextBlocks themselves via the Visual property and a corresponding javascript method. that works, but is not ideal as it mixes style w/ client side code....would prefer to indicate or specify all style in the markup.
Create an account Log In
View
Type
Status
Category