This is a migrated thread and some comments may be shown as answers.

Diagram Background Image

3 Answers 80 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Chance
Top achievements
Rank 1
Chance asked on 28 Apr 2015, 04:56 PM

I'm trying to apply a background image to the Diagram Control. 

I got it to work when viewing on the webpage by adding style="background-image: url('btest.png'); background-repeat: no-repeat; top: 0px;" to the RadDiagram control, but when I export the finished diagram to PDF or SVG the background image doesn't show.   Is there a different way I could add the background image to the diagram where it would work with the exporting tools?

 

 

 

 

 

3 Answers, 1 is accepted

Sort by
0
Ianko
Telerik team
answered on 01 May 2015, 06:40 AM
Hi Chance,

Using the markup element to add CSS would affect only the wrapper element in the DOM. Exporting the diagram includes only the SVG elements that are rendered, and this is the expected behavior.

Due to that, to actually export an image background to svg, you would need such an svg element in the main SVG layer. Adding such, is a custom solution and you should directly manipulate the DOM SVG elements. RadDiagram markup, or Kendo Diagram API does not expose options to easily do that. Therefore, it is up to plain JavaScript SVG manipulation to interact with the elements inside and add an SVG Image.

As this solution is a general knowledge matter, I suggest looking for help in public materials related to SVG, e.g., http://stackoverflow.com/questions/6701705/programmatically-creating-an-svg-image-element-with-javascript.

Regards,
Ianko
Telerik
0
Anitha
Top achievements
Rank 1
answered on 14 Apr 2018, 05:16 AM

HI Lanko,

 

Has this been addressed in the versions since 2015? I use 2018 Q1 version of the control and i am looking for a way to export the diagram with the background image.

 

Thank you!

0
Vessy
Telerik team
answered on 16 Apr 2018, 11:16 AM
Hi Anitha,

I have just answered your support ticket on the matter, for convenience will copy my answer here as well:

As discussed in this thread, exporting a background image added via CSS is still not available in the build in features of the diagram. As a possible option, you can submit a feature request for such funtionality in the Kendo User Voice portal so our developers will consider its implementation depending on the popularity of the item:
http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback?category_id=170307


Regards,
Vessy
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Diagram
Asked by
Chance
Top achievements
Rank 1
Answers by
Ianko
Telerik team
Anitha
Top achievements
Rank 1
Vessy
Telerik team
Share this question
or