├── .gitignore ├── AspNetCoreRealTimeChart.sln └── AspNetCoreRealTimeChart ├── .bowerrc ├── AspNetCoreRealTimeChart.csproj ├── Controllers ├── ApiController.cs └── HomeController.cs ├── Extensions ├── TemperatureSocketManager.cs └── TemperatureSocketMiddleware.cs ├── Program.cs ├── Properties └── launchSettings.json ├── Startup.cs ├── Views ├── Home │ └── Index.cshtml ├── Shared │ ├── Error.cshtml │ ├── _Layout.cshtml │ └── _ValidationScriptsPartial.cshtml ├── _ViewImports.cshtml └── _ViewStart.cshtml ├── appsettings.Development.json ├── appsettings.json ├── bower.json ├── bundleconfig.json └── wwwroot ├── css ├── site.css └── site.min.css ├── favicon.ico ├── images ├── banner1.svg ├── banner2.svg ├── banner3.svg └── banner4.svg └── js ├── data-view-model.js └── line-chart-binding.js /.gitignore: -------------------------------------------------------------------------------- 1 | ## Ignore Visual Studio temporary files, build results, and 2 | ## files generated by popular Visual Studio add-ons. 3 | 4 | # User-specific files 5 | *.suo 6 | *.user 7 | *.userosscache 8 | *.sln.docstates 9 | 10 | # User-specific files (MonoDevelop/Xamarin Studio) 11 | *.userprefs 12 | 13 | # Build results 14 | [Dd]ebug/ 15 | [Dd]ebugPublic/ 16 | [Rr]elease/ 17 | [Rr]eleases/ 18 | x64/ 19 | x86/ 20 | bld/ 21 | [Bb]in/ 22 | [Oo]bj/ 23 | [Ll]og/ 24 | 25 | # Visual Studio 2015 cache/options directory 26 | .vs/ 27 | # Uncomment if you have tasks that create the project's static files in wwwroot 28 | #wwwroot/ 29 | 30 | # MSTest test Results 31 | [Tt]est[Rr]esult*/ 32 | [Bb]uild[Ll]og.* 33 | 34 | # NUNIT 35 | *.VisualState.xml 36 | TestResult.xml 37 | 38 | # Build Results of an ATL Project 39 | [Dd]ebugPS/ 40 | [Rr]eleasePS/ 41 | dlldata.c 42 | 43 | # DNX 44 | project.lock.json 45 | project.fragment.lock.json 46 | artifacts/ 47 | 48 | *_i.c 49 | *_p.c 50 | *_i.h 51 | *.ilk 52 | *.meta 53 | *.obj 54 | *.pch 55 | *.pdb 56 | *.pgc 57 | *.pgd 58 | *.rsp 59 | *.sbr 60 | *.tlb 61 | *.tli 62 | *.tlh 63 | *.tmp 64 | *.tmp_proj 65 | *.log 66 | *.vspscc 67 | *.vssscc 68 | .builds 69 | *.pidb 70 | *.svclog 71 | *.scc 72 | 73 | # Chutzpah Test files 74 | _Chutzpah* 75 | 76 | # Visual C++ cache files 77 | ipch/ 78 | *.aps 79 | *.ncb 80 | *.opendb 81 | *.opensdf 82 | *.sdf 83 | *.cachefile 84 | *.VC.db 85 | *.VC.VC.opendb 86 | 87 | # Visual Studio profiler 88 | *.psess 89 | *.vsp 90 | *.vspx 91 | *.sap 92 | 93 | # TFS 2012 Local Workspace 94 | $tf/ 95 | 96 | # Guidance Automation Toolkit 97 | *.gpState 98 | 99 | # ReSharper is a .NET coding add-in 100 | _ReSharper*/ 101 | *.[Rr]e[Ss]harper 102 | *.DotSettings.user 103 | 104 | # JustCode is a .NET coding add-in 105 | .JustCode 106 | 107 | # TeamCity is a build add-in 108 | _TeamCity* 109 | 110 | # DotCover is a Code Coverage Tool 111 | *.dotCover 112 | 113 | # NCrunch 114 | _NCrunch_* 115 | .*crunch*.local.xml 116 | nCrunchTemp_* 117 | 118 | # MightyMoose 119 | *.mm.* 120 | AutoTest.Net/ 121 | 122 | # Web workbench (sass) 123 | .sass-cache/ 124 | 125 | # Installshield output folder 126 | [Ee]xpress/ 127 | 128 | # DocProject is a documentation generator add-in 129 | DocProject/buildhelp/ 130 | DocProject/Help/*.HxT 131 | DocProject/Help/*.HxC 132 | DocProject/Help/*.hhc 133 | DocProject/Help/*.hhk 134 | DocProject/Help/*.hhp 135 | DocProject/Help/Html2 136 | DocProject/Help/html 137 | 138 | # Click-Once directory 139 | publish/ 140 | 141 | # Publish Web Output 142 | *.[Pp]ublish.xml 143 | *.azurePubxml 144 | # TODO: Comment the next line if you want to checkin your web deploy settings 145 | # but database connection strings (with potential passwords) will be unencrypted 146 | #*.pubxml 147 | *.publishproj 148 | 149 | # Microsoft Azure Web App publish settings. Comment the next line if you want to 150 | # checkin your Azure Web App publish settings, but sensitive information contained 151 | # in these scripts will be unencrypted 152 | PublishScripts/ 153 | 154 | # NuGet Packages 155 | *.nupkg 156 | # The packages folder can be ignored because of Package Restore 157 | **/packages/* 158 | # except build/, which is used as an MSBuild target. 159 | !**/packages/build/ 160 | # Uncomment if necessary however generally it will be regenerated when needed 161 | #!**/packages/repositories.config 162 | # NuGet v3's project.json files produces more ignoreable files 163 | *.nuget.props 164 | *.nuget.targets 165 | 166 | # Microsoft Azure Build Output 167 | csx/ 168 | *.build.csdef 169 | 170 | # Microsoft Azure Emulator 171 | ecf/ 172 | rcf/ 173 | 174 | # Windows Store app package directories and files 175 | AppPackages/ 176 | BundleArtifacts/ 177 | Package.StoreAssociation.xml 178 | _pkginfo.txt 179 | 180 | # Visual Studio cache files 181 | # files ending in .cache can be ignored 182 | *.[Cc]ache 183 | # but keep track of directories ending in .cache 184 | !*.[Cc]ache/ 185 | 186 | # Others 187 | ClientBin/ 188 | ~$* 189 | *~ 190 | *.dbmdl 191 | *.dbproj.schemaview 192 | *.jfm 193 | *.pfx 194 | *.publishsettings 195 | node_modules/ 196 | orleans.codegen.cs 197 | 198 | # Since there are multiple workflows, uncomment next line to ignore bower_components 199 | # (https://github.com/github/gitignore/pull/1529#issuecomment-104372622) 200 | #bower_components/ 201 | 202 | # RIA/Silverlight projects 203 | Generated_Code/ 204 | 205 | # Backup & report files from converting an old project file 206 | # to a newer Visual Studio version. Backup files are not needed, 207 | # because we have git ;-) 208 | _UpgradeReport_Files/ 209 | Backup*/ 210 | UpgradeLog*.XML 211 | UpgradeLog*.htm 212 | 213 | # SQL Server files 214 | *.mdf 215 | *.ldf 216 | 217 | # Business Intelligence projects 218 | *.rdl.data 219 | *.bim.layout 220 | *.bim_*.settings 221 | 222 | # Microsoft Fakes 223 | FakesAssemblies/ 224 | 225 | # GhostDoc plugin setting file 226 | *.GhostDoc.xml 227 | 228 | # Node.js Tools for Visual Studio 229 | .ntvs_analysis.dat 230 | 231 | # Visual Studio 6 build log 232 | *.plg 233 | 234 | # Visual Studio 6 workspace options file 235 | *.opt 236 | 237 | # Visual Studio LightSwitch build output 238 | **/*.HTMLClient/GeneratedArtifacts 239 | **/*.DesktopClient/GeneratedArtifacts 240 | **/*.DesktopClient/ModelManifest.xml 241 | **/*.Server/GeneratedArtifacts 242 | **/*.Server/ModelManifest.xml 243 | _Pvt_Extensions 244 | 245 | # Paket dependency manager 246 | .paket/paket.exe 247 | paket-files/ 248 | 249 | # FAKE - F# Make 250 | .fake/ 251 | 252 | # JetBrains Rider 253 | .idea/ 254 | *.sln.iml 255 | 256 | # CodeRush 257 | .cr/ 258 | 259 | # Python Tools for Visual Studio (PTVS) 260 | __pycache__/ 261 | *.pyc -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart.sln: -------------------------------------------------------------------------------- 1 |  2 | Microsoft Visual Studio Solution File, Format Version 12.00 3 | # Visual Studio 15 4 | VisualStudioVersion = 15.0.26228.9 5 | MinimumVisualStudioVersion = 10.0.40219.1 6 | Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "AspNetCoreRealTimeChart", "AspNetCoreRealTimeChart\AspNetCoreRealTimeChart.csproj", "{6CB4922A-EF86-4BFE-8F77-86F96D45C2A4}" 7 | EndProject 8 | Global 9 | GlobalSection(SolutionConfigurationPlatforms) = preSolution 10 | Debug|Any CPU = Debug|Any CPU 11 | Release|Any CPU = Release|Any CPU 12 | EndGlobalSection 13 | GlobalSection(ProjectConfigurationPlatforms) = postSolution 14 | {6CB4922A-EF86-4BFE-8F77-86F96D45C2A4}.Debug|Any CPU.ActiveCfg = Debug|Any CPU 15 | {6CB4922A-EF86-4BFE-8F77-86F96D45C2A4}.Debug|Any CPU.Build.0 = Debug|Any CPU 16 | {6CB4922A-EF86-4BFE-8F77-86F96D45C2A4}.Release|Any CPU.ActiveCfg = Release|Any CPU 17 | {6CB4922A-EF86-4BFE-8F77-86F96D45C2A4}.Release|Any CPU.Build.0 = Release|Any CPU 18 | EndGlobalSection 19 | GlobalSection(SolutionProperties) = preSolution 20 | HideSolutionNode = FALSE 21 | EndGlobalSection 22 | EndGlobal 23 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/.bowerrc: -------------------------------------------------------------------------------- 1 | { 2 | "directory": "wwwroot/lib" 3 | } 4 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/AspNetCoreRealTimeChart.csproj: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | netcoreapp2.0 5 | 6 | 7 | 8 | $(PackageTargetFallback);portable-net45+win8+wp8+wpa81; 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Controllers/ApiController.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Threading.Tasks; 3 | using AspNetCoreRealTimeChart.Extensions; 4 | using Microsoft.AspNetCore.Mvc; 5 | using Newtonsoft.Json; 6 | 7 | namespace AspNetCoreRealTimeChart.Controllers 8 | { 9 | public class ApiController : Controller 10 | { 11 | private readonly TemperatureSocketManager _socketManager; 12 | 13 | public ApiController(TemperatureSocketManager socketManager) 14 | { 15 | _socketManager = socketManager; 16 | } 17 | 18 | public async Task Report(double liquidTemp) 19 | { 20 | var reading = new 21 | { 22 | Date = DateTime.Now, 23 | LiquidTemp = liquidTemp 24 | }; 25 | 26 | await _socketManager.SendMessageToAllAsync(JsonConvert.SerializeObject(reading)); 27 | } 28 | 29 | public async Task Generate() 30 | { 31 | var rnd = new Random(); 32 | 33 | for(var i = 0; i < 100; i++) 34 | { 35 | await Report(rnd.Next(23, 35)); 36 | await Task.Delay(5000); 37 | } 38 | } 39 | } 40 | } -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Controllers/HomeController.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.AspNetCore.Mvc; 2 | 3 | namespace AspNetCoreRealTimeChart.Controllers 4 | { 5 | public class HomeController : Controller 6 | { 7 | public IActionResult Index() 8 | { 9 | return View(); 10 | } 11 | 12 | public IActionResult Error() 13 | { 14 | return View(); 15 | } 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Extensions/TemperatureSocketManager.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Collections.Concurrent; 3 | using System.Linq; 4 | using System.Net.WebSockets; 5 | using System.Text; 6 | using System.Threading; 7 | using System.Threading.Tasks; 8 | 9 | namespace AspNetCoreRealTimeChart.Extensions 10 | { 11 | public class TemperatureSocketManager 12 | { 13 | private static ConcurrentDictionary _sockets = new ConcurrentDictionary(); 14 | 15 | public WebSocket GetSocketById(string id) 16 | { 17 | return _sockets.FirstOrDefault(p => p.Key == id).Value; 18 | } 19 | 20 | public ConcurrentDictionary GetAll() 21 | { 22 | return _sockets; 23 | } 24 | 25 | public string GetId(WebSocket socket) 26 | { 27 | return _sockets.FirstOrDefault(p => p.Value == socket).Key; 28 | } 29 | public string AddSocket(WebSocket socket) 30 | { 31 | var id = CreateConnectionId(); 32 | _sockets.TryAdd(CreateConnectionId(), socket); 33 | 34 | return id; 35 | } 36 | 37 | public async Task RemoveSocket(string id) 38 | { 39 | WebSocket socket; 40 | _sockets.TryRemove(id, out socket); 41 | 42 | await socket.CloseAsync(closeStatus: WebSocketCloseStatus.NormalClosure, 43 | statusDescription: "Closed by the WebSocketManager", 44 | cancellationToken: CancellationToken.None); 45 | } 46 | 47 | private string CreateConnectionId() 48 | { 49 | return Guid.NewGuid().ToString(); 50 | } 51 | 52 | public async Task SendMessageToAllAsync(string message) 53 | { 54 | foreach (var pair in _sockets) 55 | { 56 | if (pair.Value.State == WebSocketState.Open) 57 | await SendMessageAsync(pair.Value, message); 58 | } 59 | } 60 | 61 | private async Task SendMessageAsync(WebSocket socket, string message) 62 | { 63 | if (socket.State != WebSocketState.Open) 64 | return; 65 | 66 | await socket.SendAsync(buffer: new ArraySegment(array: Encoding.ASCII.GetBytes(message), 67 | offset: 0, 68 | count: message.Length), 69 | messageType: WebSocketMessageType.Text, 70 | endOfMessage: true, 71 | cancellationToken: CancellationToken.None); 72 | } 73 | } 74 | 75 | } 76 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Extensions/TemperatureSocketMiddleware.cs: -------------------------------------------------------------------------------- 1 | using System; 2 | using System.Net.WebSockets; 3 | using System.Threading; 4 | using System.Threading.Tasks; 5 | using Microsoft.AspNetCore.Http; 6 | 7 | namespace AspNetCoreRealTimeChart.Extensions 8 | { 9 | public class TemperatureSocketMiddleware 10 | { 11 | private readonly RequestDelegate _next; 12 | private readonly TemperatureSocketManager _socketManager; 13 | 14 | public TemperatureSocketMiddleware(RequestDelegate next, 15 | TemperatureSocketManager socketManager) 16 | { 17 | _next = next; 18 | _socketManager = socketManager; 19 | } 20 | 21 | public async Task Invoke(HttpContext context) 22 | { 23 | if (!context.WebSockets.IsWebSocketRequest) 24 | { 25 | await _next.Invoke(context); 26 | return; 27 | } 28 | 29 | var socket = await context.WebSockets.AcceptWebSocketAsync(); 30 | var id = _socketManager.AddSocket(socket); 31 | 32 | await Receive(socket, async (result, buffer) => 33 | { 34 | if (result.MessageType == WebSocketMessageType.Close) 35 | { 36 | await _socketManager.RemoveSocket(id); 37 | return; 38 | } 39 | }); 40 | } 41 | 42 | private async Task Receive(WebSocket socket, Action handleMessage) 43 | { 44 | var buffer = new byte[1024 * 4]; 45 | 46 | while (socket.State == WebSocketState.Open) 47 | { 48 | var result = await socket.ReceiveAsync(buffer: new ArraySegment(buffer), 49 | cancellationToken: CancellationToken.None); 50 | 51 | handleMessage(result, buffer); 52 | } 53 | } 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Program.cs: -------------------------------------------------------------------------------- 1 | using System.IO; 2 | using Microsoft.AspNetCore.Hosting; 3 | 4 | namespace AspNetCoreRealTimeChart 5 | { 6 | public class Program 7 | { 8 | public static void Main(string[] args) 9 | { 10 | var host = new WebHostBuilder() 11 | .UseKestrel() 12 | .UseContentRoot(Directory.GetCurrentDirectory()) 13 | .UseIISIntegration() 14 | .UseStartup() 15 | .Build(); 16 | 17 | host.Run(); 18 | } 19 | } 20 | } 21 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Properties/launchSettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "iisSettings": { 3 | "windowsAuthentication": false, 4 | "anonymousAuthentication": true, 5 | "iisExpress": { 6 | "applicationUrl": "http://localhost:21585/", 7 | "sslPort": 0 8 | } 9 | }, 10 | "profiles": { 11 | "IIS Express": { 12 | "commandName": "IISExpress", 13 | "launchBrowser": true, 14 | "environmentVariables": { 15 | "ASPNETCORE_ENVIRONMENT": "Development" 16 | } 17 | }, 18 | "AspNetCoreRealTimeChart": { 19 | "commandName": "Project", 20 | "launchBrowser": true, 21 | "environmentVariables": { 22 | "ASPNETCORE_ENVIRONMENT": "Development" 23 | }, 24 | "applicationUrl": "http://localhost:21586" 25 | } 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Startup.cs: -------------------------------------------------------------------------------- 1 | using AspNetCoreRealTimeChart.Extensions; 2 | using Microsoft.AspNetCore.Builder; 3 | using Microsoft.AspNetCore.Hosting; 4 | using Microsoft.Extensions.Configuration; 5 | using Microsoft.Extensions.DependencyInjection; 6 | using Microsoft.Extensions.Logging; 7 | 8 | namespace AspNetCoreRealTimeChart 9 | { 10 | public class Startup 11 | { 12 | public Startup(IHostingEnvironment env) 13 | { 14 | var builder = new ConfigurationBuilder() 15 | .SetBasePath(env.ContentRootPath) 16 | .AddJsonFile("appsettings.json", optional: false, reloadOnChange: true) 17 | .AddJsonFile($"appsettings.{env.EnvironmentName}.json", optional: true) 18 | .AddEnvironmentVariables(); 19 | Configuration = builder.Build(); 20 | } 21 | 22 | public IConfigurationRoot Configuration { get; } 23 | 24 | // This method gets called by the runtime. Use this method to add services to the container. 25 | public void ConfigureServices(IServiceCollection services) 26 | { 27 | services.AddMvc(); 28 | services.AddSingleton(); 29 | } 30 | 31 | // This method gets called by the runtime. Use this method to configure the HTTP request pipeline. 32 | public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory) 33 | { 34 | loggerFactory.AddConsole(Configuration.GetSection("Logging")); 35 | loggerFactory.AddDebug(); 36 | 37 | if (env.IsDevelopment()) 38 | { 39 | app.UseDeveloperExceptionPage(); 40 | app.UseBrowserLink(); 41 | } 42 | else 43 | { 44 | app.UseExceptionHandler("/Home/Error"); 45 | } 46 | 47 | app.UseStaticFiles(); 48 | app.UseWebSockets(); 49 | app.UseMiddleware(); 50 | 51 | app.UseMvc(routes => 52 | { 53 | routes.MapRoute( 54 | name: "default", 55 | template: "{controller=Home}/{action=Index}/{id?}"); 56 | }); 57 | } 58 | } 59 | } 60 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Views/Home/Index.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "Home Page"; 3 | } 4 |
5 |
6 |
7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 |
#TimeTemperature
23 |
24 |
25 | 26 | @section Scripts { 27 | 28 | 29 | 30 | 51 | } -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Views/Shared/Error.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | ViewData["Title"] = "Error"; 3 | } 4 | 5 |

Error.

6 |

An error occurred while processing your request.

7 | 8 |

Development Mode

9 |

10 | Swapping to Development environment will display more detailed information about the error that occurred. 11 |

12 |

13 | Development environment should not be enabled in deployed applications, as it can result in sensitive information from exceptions being displayed to end users. For local debugging, development environment can be enabled by setting the ASPNETCORE_ENVIRONMENT environment variable to Development, and restarting the application. 14 |

15 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Views/Shared/_Layout.cshtml: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | @ViewData["Title"] - AspNetCoreRealTimeChart 7 | 8 | 9 | 10 | 11 | 12 | 30 |
31 | @RenderBody() 32 |
33 |
34 |

© 2017 - AspNetCoreRealTimeChart

35 |
36 |
37 | 38 | 39 | 40 | 41 | 42 | @RenderSection("Scripts", required: false) 43 | 44 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Views/Shared/_ValidationScriptsPartial.cshtml: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 12 | 18 | 19 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Views/_ViewImports.cshtml: -------------------------------------------------------------------------------- 1 | @using AspNetCoreRealTimeChart 2 | @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 3 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/Views/_ViewStart.cshtml: -------------------------------------------------------------------------------- 1 | @{ 2 | Layout = "_Layout"; 3 | } 4 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/appsettings.Development.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Debug", 6 | "System": "Information", 7 | "Microsoft": "Information" 8 | } 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/appsettings.json: -------------------------------------------------------------------------------- 1 | { 2 | "Logging": { 3 | "IncludeScopes": false, 4 | "LogLevel": { 5 | "Default": "Warning" 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "asp.net", 3 | "private": true, 4 | "dependencies": {} 5 | } 6 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/bundleconfig.json: -------------------------------------------------------------------------------- 1 | // Configure bundling and minification for the project. 2 | // More info at https://go.microsoft.com/fwlink/?LinkId=808241 3 | [ 4 | { 5 | "outputFileName": "wwwroot/css/site.min.css", 6 | // An array of relative input file paths. Globbing patterns supported 7 | "inputFiles": [ 8 | "wwwroot/css/site.css" 9 | ] 10 | }, 11 | { 12 | "outputFileName": "wwwroot/js/site.min.js", 13 | "inputFiles": [ 14 | "wwwroot/js/site.js" 15 | ], 16 | // Optionally specify minification options 17 | "minify": { 18 | "enabled": true, 19 | "renameLocals": true 20 | }, 21 | // Optionally generate .map file 22 | "sourceMap": false 23 | } 24 | ] 25 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/css/site.css: -------------------------------------------------------------------------------- 1 | body { 2 | padding-top: 50px; 3 | padding-bottom: 20px; 4 | } 5 | 6 | /* Wrapping element */ 7 | /* Set some basic padding to keep content from hitting the edges */ 8 | .body-content { 9 | padding-left: 15px; 10 | padding-right: 15px; 11 | } 12 | 13 | /* Set widths on the form inputs since otherwise they're 100% wide */ 14 | input, 15 | select, 16 | textarea { 17 | max-width: 280px; 18 | } 19 | 20 | /* Carousel */ 21 | .carousel-caption p { 22 | font-size: 20px; 23 | line-height: 1.4; 24 | } 25 | 26 | /* Make .svg files in the carousel display properly in older browsers */ 27 | .carousel-inner .item img[src$=".svg"] { 28 | width: 100%; 29 | } 30 | 31 | /* Hide/rearrange for smaller screens */ 32 | @media screen and (max-width: 767px) { 33 | /* Hide captions */ 34 | .carousel-caption { 35 | display: none; 36 | } 37 | } 38 | 39 | .bigChart { 40 | height: 500px; 41 | } 42 | 43 | .line { 44 | fill: none; 45 | stroke: steelblue; 46 | stroke-width: 1.5px; 47 | } 48 | 49 | .axis path, 50 | .axis line { 51 | fill: none; 52 | stroke: #000; 53 | shape-rendering: crispEdges; 54 | } -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/css/site.min.css: -------------------------------------------------------------------------------- 1 | body{padding-top:50px;padding-bottom:20px}.body-content{padding-left:15px;padding-right:15px}input,select,textarea{max-width:280px}.carousel-caption p{font-size:20px;line-height:1.4}.carousel-inner .item img[src$=".svg"]{width:100%}@media screen and (max-width:767px){.carousel-caption{display:none}} -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/gpeipman/AspNetCoreRealTimeChart/a0668287429b3e7d997ecdad45ea1e6479191049/AspNetCoreRealTimeChart/wwwroot/favicon.ico -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/images/banner1.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/images/banner2.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/images/banner3.svg: -------------------------------------------------------------------------------- 1 | banner3b -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/images/banner4.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/js/data-view-model.js: -------------------------------------------------------------------------------- 1 | /*global ko, setInterval*/ 2 | 3 | var D3KD = this.D3KD || {}; 4 | 5 | (function (namespace) { 6 | "use strict"; 7 | namespace.dataViewModel = function () { 8 | var self = this; 9 | 10 | self.lineChartData = ko.observableArray(); 11 | self.addDataPoint = function (point) { 12 | if (self.lineChartData().length >= 10) { 13 | self.lineChartData.shift(); 14 | } 15 | 16 | self.lineChartData.push(point); 17 | }; 18 | }; 19 | }(D3KD)); -------------------------------------------------------------------------------- /AspNetCoreRealTimeChart/wwwroot/js/line-chart-binding.js: -------------------------------------------------------------------------------- 1 | /*global ko, d3*/ 2 | 3 | ko.bindingHandlers.lineChart = { 4 | init: function (element) { 5 | "use strict"; 6 | 7 | var margin = { top: 20, right: 20, bottom: 30, left: 50 }, 8 | elementWidth = parseInt(d3.select(element).style("width"), 10), 9 | elementHeight = parseInt(d3.select(element).style("height"), 10), 10 | width = elementWidth - margin.left - margin.right, 11 | height = elementHeight - margin.top - margin.bottom, 12 | 13 | svg = d3.select(element).append("svg") 14 | .attr("width", width + margin.left + margin.right) 15 | .attr("height", height + margin.top + margin.bottom) 16 | .append("g") 17 | .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); 18 | 19 | svg.append("g") 20 | .attr("class", "x axis") 21 | .attr("transform", "translate(0," + height + ")"); 22 | 23 | svg.append("g") 24 | .attr("class", "y axis") 25 | .append("text") 26 | .attr("transform", "rotate(-90)") 27 | .attr("y", 6) 28 | .attr("dy", ".71em") 29 | .style("text-anchor", "end") 30 | .text("Temperature"); 31 | 32 | svg.append("path") 33 | .attr("class", "line data"); 34 | 35 | }, 36 | update: function (element, valueAccessor) { 37 | "use strict"; 38 | 39 | var margin = { top: 20, right: 20, bottom: 30, left: 50 }, 40 | elementWidth = parseInt(d3.select(element).style("width"), 10), 41 | elementHeight = parseInt(d3.select(element).style("height"), 10), 42 | width = elementWidth - margin.left - margin.right, 43 | height = elementHeight - margin.top - margin.bottom, 44 | 45 | // set the time it takes for the animation to take. 46 | animationDuration = 750, 47 | 48 | x = d3.time.scale() 49 | .range([0, width]), 50 | 51 | y = d3.scale.linear() 52 | .range([height, 0]), 53 | 54 | xAxis = d3.svg.axis() 55 | .scale(x) 56 | .orient("bottom"), 57 | 58 | yAxis = d3.svg.axis() 59 | .scale(y) 60 | .orient("left"), 61 | 62 | // define the graph line 63 | line = d3.svg.line() 64 | .x(function (d) { return x(d.Date); }) 65 | .y(function (d) { return y(d.LiquidTemp); }), 66 | 67 | svg = d3.select(element).select("svg g"), 68 | 69 | // parse data from the data-view-model 70 | data = ko.unwrap(valueAccessor()); 71 | 72 | // define the domain of the graph. max and min of the dimensions 73 | x.domain(d3.extent(data, function (d) { return d.Date; })); 74 | y.domain([0, d3.max(data, function (d) { return d.LiquidTemp; })]); 75 | 76 | svg.select("g.x.axis") 77 | .transition() 78 | .duration(animationDuration) 79 | .call(xAxis); 80 | 81 | svg.select("g.y.axis") 82 | .transition() 83 | .duration(animationDuration) 84 | .call(yAxis); 85 | 86 | // add the line to the canvas 87 | svg.select("path.line.data") 88 | .datum(data) 89 | .transition() 90 | .duration(animationDuration) 91 | .attr("d", line); 92 | } 93 | }; 94 | --------------------------------------------------------------------------------