| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <!-- | 2 <!-- |
| 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. | 3 Copyright (c) 2014 The Chromium Authors. All rights reserved. |
| 4 Use of this source code is governed by a BSD-style license that can be | 4 Use of this source code is governed by a BSD-style license that can be |
| 5 found in the LICENSE file. | 5 found in the LICENSE file. |
| 6 --> | 6 --> |
| 7 | 7 |
| 8 <link rel="import" href="/tracing/ui/base/chart_base_2d_brushable_x.html"> | 8 <link rel="import" href="/tracing/ui/base/chart_base_2d_brushable_x.html"> |
| 9 | 9 |
| 10 <link rel="stylesheet" href="/tracing/ui/base/line_chart.css"> | 10 <link rel="stylesheet" href="/tracing/ui/base/line_chart.css"> |
| (...skipping 21 matching lines...) Expand all Loading... |
| 32 return fieldName != 'x'; | 32 return fieldName != 'x'; |
| 33 }, | 33 }, |
| 34 | 34 |
| 35 getXForDatum_: function(datum, index) { | 35 getXForDatum_: function(datum, index) { |
| 36 return datum.x; | 36 return datum.x; |
| 37 }, | 37 }, |
| 38 | 38 |
| 39 updateDataContents_: function(dataSel) { | 39 updateDataContents_: function(dataSel) { |
| 40 dataSel.selectAll('*').remove(); | 40 dataSel.selectAll('*').remove(); |
| 41 var dataBySeriesKey = this.getDataBySeriesKey_(); | 41 var dataBySeriesKey = this.getDataBySeriesKey_(); |
| 42 var pathsSel = dataSel.selectAll('path').data(this.seriesKeys_); | 42 var seriesKeys = [...this.seriesByKey_.keys()]; |
| 43 var pathsSel = dataSel.selectAll('path').data(seriesKeys); |
| 43 pathsSel.enter() | 44 pathsSel.enter() |
| 44 .append('path') | 45 .append('path') |
| 45 .attr('class', 'line') | 46 .attr('class', 'line') |
| 46 .style('stroke', function(key) { | 47 .style('stroke', function(key) { |
| 47 return tr.ui.b.getColorOfKey(key); | 48 return tr.ui.b.getColorOfKey(key); |
| 48 }) | 49 }) |
| 49 .attr('d', function(key) { | 50 .attr('d', function(key) { |
| 50 var line = d3.svg.line() | 51 var line = d3.svg.line() |
| 51 .x(function(d) { return this.xScale_(d.x); }.bind(this)) | 52 .x(function(d) { return this.xScale_(d.x); }.bind(this)) |
| 52 .y(function(d) { return this.yScale_(d[key]); }.bind(this)); | 53 .y(function(d) { return this.yScale_(d[key]); }.bind(this)); |
| 53 return line(dataBySeriesKey[key]); | 54 return line(dataBySeriesKey[key]); |
| 54 }.bind(this)); | 55 }.bind(this)); |
| 55 pathsSel.exit().remove(); | 56 pathsSel.exit().remove(); |
| 56 } | 57 } |
| 57 }; | 58 }; |
| 58 | 59 |
| 59 return { | 60 return { |
| 60 LineChart: LineChart | 61 LineChart: LineChart |
| 61 }; | 62 }; |
| 62 }); | 63 }); |
| 63 </script> | 64 </script> |
| OLD | NEW |