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 |