question

JeswaniHiteshNaviMumbai-3505 avatar image
0 Votes"
JeswaniHiteshNaviMumbai-3505 asked YihuiSun-MSFT answered

Add secondary yaxis in web.helpers.chart

Hi, Is there a way to add secondary yaxis in Chart class of system.web.helper.chart? My current code: string temp = @"<Chart> <ChartAreas> <ChartArea Name=""Default"" Template=""All""> <AxisY> <LabelStyle Font=""Verdana, 12px"" /> </AxisY> <AxisY> <LabelStyle Font=""Verdana, 12px"" /> </AxisY> <AxisX LineColor=""64, 64, 64, 64"" Interval=""1""> <LabelStyle Font=""Verdana, 12px"" /> </AxisX> </ChartArea> </ChartAreas> </Chart>"; var myChart = new Chart(width:1200, height: 300,theme:temp).AddTitle("Test Graph").AddLegend();

dotnet-aspnet-general
· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Adding right tags/teams to assist

0 Votes 0 ·

1 Answer

YihuiSun-MSFT avatar image
0 Votes"
YihuiSun-MSFT answered

Hi @JeswaniHiteshNaviMumbai-3505,

Is there a way to add secondary yaxis in Chart class of system.web.helper.chart?

You need to specify a name for each AxisY or AxisX. I wrote an example, you can refer to it.

Model

         public class ChartTestModel
         {
             public int test1 { get; set; }
             public int test2 { get; set; }
             public int test3 { get; set; }
         }

Controller

     public class ChartTestController : Controller
     {
         public ActionResult Index()
         {
             Random random = new Random();
             List<ChartTestModel> test = new List<ChartTestModel>();
             for(int i = 1; i < 6; i++)
             {
                 test.Add(new ChartTestModel { test2 = random.Next(20, 90), test3= random.Next(50, 100), test1= i });
             }
             string temp = @"<Chart> 
                                 <ChartAreas> 
                                     <ChartArea Name=""Default"" _Template_=""All"">
                                          <AxisY Name=""FirstY""> 
                                             <LabelStyle Font=""Verdana, 12px"" /> 
                                         </AxisY> 
                                          <AxisY Name=""SecondY""> 
                                             <LabelStyle Font=""Verdana, 12px"" /> 
                                         </AxisY> 
                                         <AxisX Name=""FirstX"" LineColor=""64, 64, 64, 64"" Interval=""1""> 
                                             <LabelStyle Font=""Verdana, 12px"" /> 
                                         </AxisX>
                                     </ChartArea> 
                                 </ChartAreas> 
                             </Chart>";
             var myChart = new Chart(width: 1200, height: 300, theme: temp).AddTitle("Test").AddLegend();
             var bytes = new Chart(width: 850, height: 400, theme: temp)
             .AddSeries(
                         xValue: test.Select(m => m.test1).ToArray(),xField: "FirstX",
                         yValues: test.Select(m => m.test2).ToArray(),yFields: "FirstY"
                       )
             .AddSeries(
                         xValue: test.Select(m => m.test1).ToArray(), xField: "FirstX",
                         yValues: test.Select(m => m.test3).ToArray(), yFields: "SecondY"
                       )
             .GetBytes("png");
             return File(bytes, "image/png");
         }

Result

81769-result.png


If the answer is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.
Best Regards,
YihuiSun


result.png (14.3 KiB)
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.