1/* 2 * Copyright (C) 2022 Huawei Device Co., Ltd. 3 * Licensed under the Apache License, Version 2.0 (the "License"); 4 * you may not use this file except in compliance with the License. 5 * You may obtain a copy of the License at 6 * 7 * http://www.apache.org/licenses/LICENSE-2.0 8 * 9 * Unless required by applicable law or agreed to in writing, software 10 * distributed under the License is distributed on an "AS IS" BASIS, 11 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 12 * See the License for the specific language governing permissions and 13 * limitations under the License. 14 */ 15 16import { Graph } from './Graph'; 17import { Rect } from './Rect'; 18import { ns2s, TimerShaftElement } from '../TimerShaftElement'; 19 20export class TimeRuler extends Graph { 21 totalNS: number; 22 private stepSmall: number; 23 private step: number; 24 private stepNS: number; 25 26 constructor(timerShaftEL: TimerShaftElement, frame: Rect, totalNS: number = 10_000_000_000) { 27 super(timerShaftEL.canvas, timerShaftEL.ctx!, frame); 28 this.totalNS = totalNS; 29 this.step = this.frame.width / 10; 30 this.stepSmall = this.frame.width / 100; 31 this.stepNS = this.totalNS / 10; 32 } 33 34 draw(): void { 35 this.stepSmall = this.frame.width / 100; 36 this.step = this.frame.width / 10; 37 this.stepNS = this.totalNS / 10; 38 this.context2D.clearRect(this.frame.x, this.frame.y, this.frame.width, this.frame.height); 39 this.context2D.beginPath(); 40 this.context2D.lineWidth = 1; 41 this.context2D.strokeStyle = '#999'; 42 for (let index = 0; index <= 10; index++) { 43 let x = Math.floor(index * this.step) + this.frame.x; 44 this.context2D.moveTo(x, 0); 45 this.context2D.lineTo(x, this.frame.height); 46 if (index === 10) { 47 break; 48 } 49 for (let innerIndex = 1; innerIndex < 10; innerIndex++) { 50 this.context2D.moveTo(x + Math.floor(innerIndex * this.stepSmall), 0); 51 this.context2D.lineTo(x + Math.floor(innerIndex * this.stepSmall), this.frame.height / 4); 52 } 53 this.context2D.fillStyle = '#999'; 54 this.context2D.fillText(`${ns2s(index * this.stepNS)}`, x + 5, this.frame.height - 1); 55 } 56 this.context2D.stroke(); 57 this.context2D.closePath(); 58 } 59} 60