SVG Example:

            <svg>
                <defs>
                    <pattern id="Occupied"
                            width="4" height="10"
                            patternUnits="userSpaceOnUse"
                            patternTransform="rotate(45 50 50)">
                        <line stroke="#ffb29d" stroke-width="2" y2="10"/>
                    </pattern>
                </defs>
                <rect x="5" y="5"
                      width="40" height="100"
                      fill="url(#Occupied)"
                      stroke="#ff7094"
                      stroke-width="1" />
            </svg>

Bug report

On Zoom Some Connection lines become bolded

Reproduction of the problem
Dojo: https://dojo.telerik.com/uHOdOHOV/4

Zoom the chart randomly

Current behavior

Some Connection lines become bolded

Expected/desired behavior
Connection lines coordination shall be rounded so they render equally

Environment
Kendo UI version: [all]
Browser: [all]

Hi Team,

I would like to request adding Swimlane Orientation for the Kendo UI Diagram. 

Thank you!

Bug report

In a Diagram, if you have a lot of nested data, a "Maximum call stack size exceeded" error is thrown.

Reproduction of the problem

1. Open this example - https://dojo.telerik.com/OcOBaFoq/3

Current behavior

A Maximum call stack size exceeded error is thrown

Expected/desired behavior

No errors should be thrown.

Environment

• Kendo UI version: 2023.3.1010
• Browser: [all]

Expand/Collapse feature on click of the diagram nodes. 
Load data on demand during enpansion of the node.

Enhancement

Expose renderAs property in Diagram as it is in Chart

TicketID: 1563168

Environment
Kendo UI version: ]all]
Browser: [all]

Hi Team,

I'd like to request the functionality to inject HTML code using the Kendo UI Drawing API.  Specifically, being able to utilize a Node Container with the Drawing API would be great.  

Thank you!

The Typescript definitions for Kendo UI define the connections() method which is part of the kendo.dataviz.diagram.Shape interface as follows:

connections(type: string): void;

The documentation (https://docs.telerik.com/kendo-ui/api/javascript/dataviz/diagram/shape/methods/connections) however, specifies:

Returns the connections attached to the shape. You can optionally specify to return only the incoming or outgoing connections.

Therefore, connections() should not be of type void and the type parameter should be optional.

To solve this issue, we currently cast both the parameter and the result.

While the Diagram component is nice it is not explicitly constrained to OrgChart behavior with custom drill-up and built-in drill-down capability like the control for the ASP.NET AJAX suite has and thus trying to implement it as such would consume too much time.  The Diagram component is amazing and certainly has valid use cases but to extend it for use as an OrgChart with all the behaviors that exist in the pure AJAX control would be a pain.

What about adding dynamic scrollbars to the HTML5 Diagram widget?

As developer I'm familiar with the pan and zoom concept, but customers and normal users are expected to see scroll bars to move around a diagram. 
In this demo

http://demos.telerik.com/kendo-ui/html5-diagram-sample-app

you can add objects that fall outside of the main view, but no scroll bars appears.

Here http://kendoui-feedback.telerik.com/forums/127393-telerik-kendo-ui-feedback/suggestions/6552432-html5-diagram-control-allow-scrolling

was posted a similar request, but the scrollbars Kenshin suggested 
are static.

The scrollbars does't readapt if the work area changes. 

If you move objects around, apply a different zoom, add more elements, and so on.

I want the content to be divide into two lines. So I tried setting `connectionDefaults.content.visual` with the below function:


            var getConnection = function (data) {
            var g = new kendo.dataviz.diagram.Group({
                autoSize: true
            });
            var text1 = new kendo.dataviz.diagram.TextBlock({
                text: data.label.name,
                fontSize: 16
            });


            g.append(text1);

            var text2 = new kendo.dataviz.diagram.TextBlock({
                text: data.label.value,
                fontSize: 16
            });


            g.append(text2);
            return g;
        }
But the problem here is that the `data` field does not populate the connection data due to which assigning values is not possible.


A solution for this is much appreciated.

Currently, a shape that is a group of inner shapes is selected by clicking anywhere inside its bounding box. 
However, when there's a gap between the inner shapes through which you see another shapes, clicking that other shape will not select it due to the bounding box.
If instead the selection was based on the inner shapes, that wouldn't be a problem.

I would like to see some graphical documentation to show the structure of the controls created by Kendo. I'm imagining an exploded diagram or something like this picture: ( http://bit.ly/VKIgHn ). But instead of kindle hardware - there are layers of the divs, blocks, sub containers and other working parts of the widget. This would also include what base styles ( k-widget, etc) are on each block. In particular - I'm trying to re-style your calendar widget and the element view in Chrome debugger tools has the data - but it's very hard to get a good overview in all that dense text :)

Extend Dataviz Diagram to implement a BPMN Editor using

It would be nice if the diagram control could support undobale properties load back from saved data. And also if shapes, connections could acquire this property (not only through diagram.addShape and diagram.addConnection).

Hi Team,

I'd like to request the Kendo UI Diagram to include a double click event in future releases similar to the click event.  

Thank you

I disable the zoom on a diagram by setting the zoom property to 0 and it works.

Unfortunately it crashes the pdf export with the following error:

This is a dojo where the issue reproduces: https://dojo.telerik.com/EveCAnAq

I did a quick investigation in the library and the culprit seems to be the first line of the below function. _zoom is either zero or undefined resulting in NAN. 

Add ability to define connection visual template option for the whole connection path. In this way the user can define custom connection types (like 'polyspline' ).

Someting like:

https://docs.telerik.com/devtools/winforms/controls/diagram/diagram-items/connections/connection-types 

Currently, the Diagram control does not register touch event as a click.  Therefore, selecting and dragging nodes in the diagram does not work.  It only pans the entire view.  These show up as Pan events only and no other events seem to fire.