Watch videos with subtitles in your language, upload your videos, create your own subtitles! Click here to learn more on "how to Dotsub"

How Do I: Introducing the New Chart Control in Visual Studio 2010

0 (0 Likes / 0 Dislikes)
  • Embed Video

  • Embed normal player Copy to Clipboard
  • Embed a smaller player Copy to Clipboard
  • Advanced Embedding Options
  • Embed Video With Transcription

  • Embed with transcription beside video Copy to Clipboard
  • Embed with transcription below video Copy to Clipboard
  • Embed transcript

  • Embed transcript in:
    Copy to Clipboard
  • Invite a user to Dotsub
[Microsoft ASP.NET -] Hi, Microsoft developers. My name's Max Adams. There's some early excitement brewing around the imminent release of Visual Studio 2010 and the (inaudible) version 4.5. And rightly so, I might add, as it introduces a lot of really cool and useful tools, like abstractions to make concurrent programming or parallelism a breeze and awesome new features in terms of C#, VB.NET, and the highly exciting— to me, anyway—F#, a truly functional language. A ton of updates to all 9 controls and 7 new ones are also being introduced, like the ASP.NET Web Charting control. This control is set to make dashboards and charting in a browser an absolute breeze. With this Web Charting control, in terms of the visually stunning charts for statistical or financial analysis, it's easy to create. Let's have a look how it can do this. First off, I'm going to create a new project in my Microsoft Visual Studio 2010. New Project. And I'm going to create Visual Basic, ASP.NET Web Application. We'll see that the ASP.NET Web Application has a bunch of stuff, and it's also the Welcome to ASP.NET, etc., etc. I'm going to get rid of everything that's in there and go to a split screen so I can see both my code and the design page. I'll put back all this stuff. Get rid of it in the design— And I'm going to go to my toolbox. And go to the Data tab. We'll grab the Chart control. Stick it on the form. Move to my (inaudible) command window so I can see it better. Output window. All right. Here you can visually see the Chart control. And here's the basic markup for it. And so we can add to this markup and create some static data for it. In my <series>, I'm going to put a series of points. And I want to put asp:DataPoint. The AxisLabel can be "Product 1". And its Yvalues will be "123". Then I'm going to create 4 data points on this one. AxisLabel="Product 2". YValues="456." Under Product 3— And one more. All right, so that's given it some data insert into the chart. Next thing I want to put in is in the chart areas. In ChartArea1, I'm going to make AxisY logarithmic. And I'll put some legends in there as well, which is (inaudible). Name it Legend1. Its title is Product Sales. Right, so I'm going to synchronize the views. And there we have some static data. I can run the application itself. And there's my ASP.NET application with a static-data chart control on it, with just a little bit of markup. Let's change the markup slightly. And we'll put in some 3D into the markup of this. So under the Chart Area, I'm going to give it Area3DStyle. And for instance, I'll make the rotation 10. I'll make that Perspective. Also 10. I'm going to say Enable3D. The inclination I'll make 15. IsRightAngleAxes False. The width of the wall 0. And is it clustered? No. And this following that (inaudible). I've got something wrong in there. Oh, of course. (inaudible) malformed. Area3DStyle. Something quite simple. Synchronize the views, and there we have the 3D column graph. Very easy to change what type of graph it is. Look in there, within the markup itself. Of course, it's also very easy to change what type of chart you're dealing with. In the Series area, we can say ChartType equal to any number of—we can have a— for instance, a bar chart. Change this bar. I've always liked pie charts, myself. synchronize the views, and you've got a pie chart. Of course, likely you'll be—you won't be statically creating this type of chart. You'll want to use some sort of data source. That's also very easy to do. Click on the Chart Tasks. And create a new data source. So I'm going to choose my data source. It's SqlDataSource3. And I'll configure that data source. The AdventureWorks connection string, which is to my SQL library. I'm going to create a custom SQL statement. I'll use Query Builder. I'm going to go look for a SalesPerson or Sales— yeah, there's a SalesPerson. Table. I'm going to select all the columns from that table. And then back. Let's do Create. It's coming through fine. And change my Xvalue member to SalesPersonID. And Yvalue member to SalesYTD. (inaudible) Put that in my chart. And run that. Here we have the connection running, connecting to the data source. Apply with the Salesman code. And how much each sold. Many types of charts you can use here. The charts are—as much as 35 different types of charts which one can use. And I'll go the chart there. It'll say there are about 35 different types of charts you can use, including all sorts of 3D ones. As I've shown, you can do 3D chart areas. And there's also many types of data sources you can use. (inaudible) new data source. Use Access databases, relational databases, Entity for objects, LINQ for SQL, Site Maps, or even XML files, if you're getting the data from a web service. You can also attach any type of list collection programmatically. This has been a quick lap around the new Web Charting control for ASP.NET in the .NET Framework 4.0. It's as simple as pie to use and create really great-looking visuals in ASP.NET applications. I hope this has been useful to you. My name is Max Adams. And I'll see you next time. Cheers. [Microsoft ASP.NET -]

Video Details

Duration: 13 minutes and 15 seconds
Country: United States
Language: English
License: All rights reserved
Genre: None
Views: 6
Posted by: neudesicasp on Sep 6, 2013

There is a lot of excitement around the imminent release of Microsoft Visual Studio 2010 and the .NET Framework 4.0. Amongst many new features is the ASP.NET Web Charting Control. In this video, Max Adams introduces the control and demonstrates just how easy it actually is to create visually appealing statistical or financial analysis tools in a browser using the Chart control.

Caption and Translate

    Sign In/Register for Dotsub to translate this video.