added a range chart

Author: stephanrauh

.gitignore

@@ -3,4 +3,5 @@
 .settings
 typings/
 node_modules/
-**/node_modules/
+**/node_modules/
+**/.idea

charts/complexCharts/.gitignore

@@ -8,7 +8,7 @@
 /node_modules
 
 # IDEs and editors
-/.idea
+*/.idea/
 .project
 .classpath
 .c9/

charts/complexCharts/src/app/app.component.html

@@ -1,4 +1,4 @@
 <h1>
-  Consumption charts
+  Consumption charts!!
 </h1>
 <consumption></consumption>

charts/complexCharts/src/app/app.module.ts

@@ -6,17 +6,19 @@ import {FormsModule} from "@angular/forms";
 import {AppComponent} from "./app.component";
 import {ConsumptionComponent} from "./consumption/consumption.component";
 import {ConsumptionDataService} from "./services/consumption-data-service";
+import {LineRangeChartModule} from "./line-range-chart/line-range-chart.module";
 
 @NgModule({
   declarations: [
     AppComponent,
-    ConsumptionComponent
+    ConsumptionComponent,
   ],
   imports: [
     BrowserModule,
     FormsModule,
     HttpModule,
-    NgxChartsModule
+    NgxChartsModule,
+    LineRangeChartModule
   ],
   exports: [],
   providers: [ConsumptionDataService],

charts/complexCharts/src/app/common/SeriesEntry.ts

@@ -1,4 +1,4 @@
 export class SeriesEntry {
-  constructor(public name: string | Date | number, public value: number) {}
+  constructor(public name: string | Date | number, public value: number, public min ?:number, public max ?: number) {}
 }
 

charts/complexCharts/src/app/consumption/consumption.component.html

@@ -29,7 +29,7 @@
     </tr>
     <tr>
       <td><input type="radio" name="chartType" value="averageConsumptionBySpeed"
-                 (click)="onClickAverageConsumptionBySpeed(10, 'both', false)"> average consumption by speed
+                 (click)="onClickAverageConsumptionBySpeed(10, 'both', true)"> average consumption by speed
         (coarse-grained)
       </td>
       <td><input type="radio" name="chartType" value="averageConsumptionBySpeed"
@@ -43,7 +43,7 @@
     </tr>
     <tr>
       <td><input type="radio" name="chartType" value="averageConsumptionBySpeed"
-                 (click)="onClickAverageConsumptionBySpeed(5, 'both', false)"> average consumption by speed (medium)
+                 (click)="onClickAverageConsumptionBySpeed(5, 'both', true)"> average consumption by speed (medium)
       </td>
       <td><input type="radio" name="chartType" value="averageConsumptionBySpeed"
                  (click)="onClickAverageConsumptionBySpeed(5, 'civic', true)"> average consumption by speed (medium)
@@ -54,7 +54,7 @@
     </tr>
     <tr>
       <td><input type="radio" name="chartType" value="averageConsumptionBySpeed"
-                 (click)="onClickAverageConsumptionBySpeed(2, 'both', false)"> average consumption by speed
+                 (click)="onClickAverageConsumptionBySpeed(2, 'both', true)"> average consumption by speed
         (fine-grained)
       </td>
       <td><input type="radio" name="chartType" value="averageConsumptionBySpeed"
@@ -70,7 +70,7 @@
 </form>
 
 
-<ngx-charts-line-chart
+<ngx-charts-line-range-chart
   *ngIf="visible"
   [view]="view"
   class="chart-container"
@@ -88,8 +88,8 @@
   [yAxisLabel]="yAxisLabel"
   autoScale="true"
   timeline="true"
-  showGridLines="true"
+  showGridLines="false  "
   [curve]="curve"
   (select)="select($event)">
-</ngx-charts-line-chart>
+</ngx-charts-line-range-chart>
 

charts/complexCharts/src/app/line-range-chart/index.ts

@@ -0,0 +1,4 @@
+export * from './line-range-chart.module';
+export * from './line-range-chart.component';
+export * from './line-range.component';
+export * from './line-range-series.component';