We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

How to export 3 circular gauge in 1 png file

Thread ID:

Created:

Updated:

Platform:

Replies:

118663 Mar 30,2015 03:24 PM Oct 3,2016 08:16 AM ASP.NET Web Forms (Classic) 8
loading
Tags: CircularGauge
Roimer Machacón Otero
Asked On March 30, 2015 03:24 PM

Hi, we´re using a Circular gauge

http://asp.syncfusion.com/demos/web/circulargauge/default.aspx

Now in a html page we've 3 different circular gauges, but need export to png file the 3. Using the example in this page: http://asp.syncfusion.com/demos/web/circulargauge/exportimage.aspx is for export 1 circular gauge but need export the 3.

Exist a form of make this? Can export in a png file the 3 circular gauges? Or export 3 png files in zipo or rar?

Sarath Kumar P K [Syncfusion]
Replied On March 31, 2015 08:55 AM

Hi Nestor,

Thanks for using Syncfusion products.

We have prepared a sample based on your requirement (“Need to export three gauges in single png file”) and it can be downloaded from the following location.

http://www.syncfusion.com/downloads/support/forum/118663/Gauge1886507481.zip

In the above sample, we have used one button to trigger the export action and within that method (“buttonclickevent) we have processed to get all the required gauge canvas elements and render it into one new canvas element. By using that canvas element we can export three gauges in a single png file. Please refer the following code snippets that will help you to meet your requirement.

<code>

//To get all the canvas elements

var canvas1 = $('canvas');

var b_canvas = new Array();

for (var l = 0; canvas1[l] != null; l++) {

b_canvas[l] = canvas1[l];

}

//create a temporary canvas to store the combined canvas element.

var buffer = document.createElement("canvas");

buffer.width = 0;

buffer.height = 0;

//Draw the canvas

for (var j = 0; j < b_canvas.length; j++) {

buffer_context.drawImage(b_canvas[j], 0, yPosition, b_canvas[j].width, b_canvas[j].height);

yPosition += b_canvas[j].height;

}

//Method to export all gauges in single file

exportImage(buffer, "myImage", "png");

</code>

Please let us know if it helps and if you need any further assistance on this.

Note : We have confirmed your requirement is related to the “EJWEB (new ASP.NET)” based on the link mentioned in your update. Hence, we have prepared the sample in the ASP.NET platform and attached above. Kindly let us know if you have any concerns on platform selection while creating the incident, we will provide you the details on this.

Regards,

Sarath Kumar P K


Roimer Machacón Otero
Replied On March 31, 2015 10:09 AM

Thanks, Sarath Kumar P K, this example work correctly

Roimer Machacón Otero
Replied On March 31, 2015 03:32 PM

Now, I've another question. Exist a form of create the RangeCollection of a circular gauge in code behind vb.net.

We're need that the number of ranges in the circular gauges can be defined by the user depending of a value brought of the database.

Example the return value of the database is 4, now the circular gauge have 4 ranges

Sarath Kumar P K [Syncfusion]
Replied On April 1, 2015 09:30 AM

Hi Nestor,

Thanks for your update.

We have prepared a sample based on your requirement (“Dynamically adding ranges based on the database value”), which can be downloaded from the following location.

http://www.syncfusion.com/downloads/support/forum/118663/DynamicRangeGauge-304242992.zip

In above sample, we have used the below code snippets:
<code>

conn.Open()

Dim command As New SqlCommand("Select RangesCount From GaugeRange", conn)

' Get the range count value from the database

adapter1.SelectCommand = command

adapter1.Fill(drugs)

For j = 0 To drugs.Tables(0).Rows.Count - 1

val = drugs.Tables(0).Rows(j)("RangesCount")

Next
Dim db As Int32 = val
--------------------
--------------------

For i = 0 To db - 1 Step i + 1

Dim gauge As CircularGauge = New CircularGauge()

Dim ra As CircularRanges = New CircularRanges()

ra.StartValue = min ' Here we are setting the Start value of ranges.

ra.EndValue = diff ' Here we are setting the End value of ranges.

ra.DistanceFromScale = -30

If i = 0 Then

color = "red"

ElseIf i = 1 Then

color = "blue"

ElseIf i = 2 Then

color = "green"

Else

color = "grey"

End If

ra.BackgroundColor = color

ra.Border.Color = "yellow"

Me.CircularGauge1.Scales(0).Ranges.Add(ra) ' Here we are adding the ranges collection to circular gauge.

min = diff

diff += temp

Next

</code>

Please let us know if it helps and if you need any further assistance on this.

Regards,
Sarath Kumar P K


Roimer Machacón Otero
Replied On April 1, 2015 12:04 PM

Thanks, Sarath Kumar P K, the example work correctly

Sarath Kumar P K [Syncfusion]
Replied On April 2, 2015 08:23 AM

Hi Nestor,

Thanks for your update.

We are glad that the provided sample meets your requirement. Please let us know if you need any further assistance.

Regards,
Sarath Kumar P K

Roimer Machacón Otero
Replied On September 30, 2016 05:28 PM

Hi, updating to the new version, this solution not work correctly. The chart isn't downloaded

Dharanidharan Dharmasivam [Syncfusion]
Replied On October 3, 2016 08:16 AM


Thanks for your update. 
We have tried to replicate the reported issue with the current version (14.3.0.49) in firefox and chrome browsers, and we are able to download all the 3 gauges without any issue.  

Since we cannot replicate this issue at our end, kindly revert us with following details, so that we can provide the solution sooner. 

·       By modifying the attached sample or provide us with your sample with replication steps, 
·       Specify the browser with version. 
 
For your reference we have attached the sample. Kindly find the sample from below link, 
  
Thanks, 
Dharani. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;