Draw marker events on Timeline flame chart

Source/devtools/front_end/components/TimelineGrid.js

 /*
  * Copyright (C) 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2008, 2009 Anthony Ricaud <rik@webkit.org>
  * Copyright (C) 2009 Google Inc. All rights reserved.
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
  * 1.  Redistributions of source code must retain the above copyright
@@ skipping 137 matching lines @@
         }
         context.moveTo(position, 0);
         context.lineTo(position, height);
         context.stroke();
         lastTime = time;
         lastPosition = position;
     }
     context.restore();
 },
 
+/**
+ * @param {!Object} canvas
+ * @param {!WebInspector.TimelineGrid.Calculator} calculator
+ * @param {?Array.<!WebInspector.FlameChartDataProvider.Marker>} markers
+ */
+WebInspector.TimelineGrid.drawTimelineMarkers = function(canvas, calculator, markers)
+{
+    var context = canvas.getContext("2d");
+    context.save();
+    var ratio = window.devicePixelRatio;
+    context.scale(ratio, ratio);
+    var height = WebInspector.FlameChart.DividersBarHeight - 1;
+    context.lineWidth = 2;

[alph, 2014/07/21 12:05:30]

it should depend on devicePixelRatio

[yurys, 2014/07/21 13:49:47]

There is already a call to context.scale above.

+    context.translate(0.5, 0.5);

[alph, 2014/07/21 12:05:30]

You need to translate by 0.5 iff lineWidth is odd.

[yurys, 2014/07/21 13:49:47]

Done.

+    for (var i = 0; i < markers.length; ++i) {
+        var marker = markers[i];
+        var position = calculator.computePosition(marker.timestamp);
+        context.strokeStyle = marker.color;
+        context.beginPath();
+        context.moveTo(position, 0);
+        context.lineTo(position, height);
+        context.stroke();
+    }
+    context.restore();
+},
+
+
 WebInspector.TimelineGrid.prototype = {
     get dividersElement()
     {
         return this._dividersElement;
     },
 
     get dividersLabelBarElement()
     {
         return this._dividersLabelBarElement;
     },
@@ skipping 176 matching lines @@
 
     /** @return {number} */
     zeroTime: function() { },
 
     /** @return {number} */
     maximumBoundary: function() { },
 
     /** @return {number} */
     boundarySpan: function() { }
 }