Shape Template
Use the following properties to create a shape template:
- The customShapeTemplate property defines a common template for all shapes in the UI component.
- The template property defines a template for an individual shape.
index.js
- $(function() {
- var diagram = $("#diagram").dxDiagram({
- customShapeTemplate: function(item, $container) {
- var employee = item.dataItem;
- var $content = $("<svg class='template'>" +
- "<text class='template-name' x='50%' y='20%'>" + (employee ? employee.Full_Name : "Employee's Name") + "</text>" +
- "<text class='template-title' x='50%' y='45%'>" + (employee ? employee.Title : "Employee's Title") + "</text>" +
- "<text class='template-button' id='employee-edit' x='40%' y='85%'>Edit</text>" +
- "<text class='template-button' id='employee-delete' x='62%' y='85%'>Delete</text>" +
- "</svg >");
- $container.append($content);
- $content.find("#employee-edit").click(function() { editEmployee(employee); });
- $content.find("#employee-delete").click(function() { deleteEmployee(employee); });
- },
- ...
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.