editable.rotateBoolean|Object(default: true)
Specifies whether the shapes can be rotated. Note that changing this setting after creating the diagram will have no effect.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
editable: {
rotate: true
},
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
]
});
</script>editable.rotate.fillObject
Specifies the fill settings of the rotation thumb.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
],
editable: {
rotate: {
fill: {
color: "yellow",
opacity: 0.8
}
}
}
});
</script>editable.rotate.fill.colorString
Specifies the fill color of the rotation thumb.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
],
editable: {
rotate: {
fill: {
color: "red"
}
}
}
});
</script>editable.rotate.fill.opacityNumber(default: 1)
Specifies the fill opacity of the rotation thumb.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
],
editable: {
rotate: {
fill: {
color: "blue",
opacity: 0.5
}
}
}
});
</script>editable.rotate.strokeObject
Specifies the stroke settings of the rotation thumb.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
],
editable: {
rotate: {
stroke: {
color: "green",
width: 3
}
}
}
});
</script>editable.rotate.stroke.colorString
Specifies the stroke color of the rotation thumb.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
],
editable: {
rotate: {
stroke: {
color: "orange"
}
}
}
});
</script>editable.rotate.stroke.widthNumber(default: 1)
Specifies the stroke thickness of the rotation thumb.
Example
<div id="diagram"></div>
<script>
$("#diagram").kendoDiagram({
shapes: [
{
id: "1",
content: {
text: "Rotatable Shape"
},
x: 100,
y: 100
}
],
editable: {
rotate: {
stroke: {
color: "purple",
width: 4
}
}
}
});
</script>In this article