blob: c183ac1dbf07cffc5d46666a10a626a308c8f6d2 [file] [log] [blame]
<!--
~ Copyright 2019-present Open Networking Foundation
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
~ You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->
<svg:g *ngFor="let pt of gridPointsHoriz" xmlns:svg="http://www.w3.org/2000/svg"
[attr.transform]="'translate(' + horizCentreOffset + ',' + vertCentreOffset + '), ' +
'scale(' + gridScaleX + ',' + gridScaleY +')'">
<svg:desc>Vertical grid lines</svg:desc>
<svg:rect id="gridRectVert" class="gridrect"
[ngStyle]="{'stroke': gridcolor, 'stroke-width': 1/gridScaleX }"
[attr.width]="spacing"
[attr.height]="vertUpperLimit-vertLowerLimit"
[attr.x]="pt"
[attr.y]="vertLowerLimit">
</svg:rect>
<svg:text id="gridTextVert" class="gridtext"
[ngStyle]="{'stroke': gridcolor, 'font-size': 100/gridScaleX+'%', 'stroke-width': 1/gridScaleX }"
[attr.x]="pt"
[attr.y]="(vertUpperLimit - vertLowerLimit)/2">{{pt}}</svg:text>
</svg:g>
<svg:g *ngFor="let pt of gridPointsVert" xmlns:svg="http://www.w3.org/2000/svg"
[attr.transform]="'translate(' + horizCentreOffset + ',' + vertCentreOffset + '), ' +
'scale(' + gridScaleX + ',' + gridScaleY + ')'">
<svg:desc>Horizontal grid lines</svg:desc>
<svg:rect id="gridRectHoriz" class="gridrect"
[ngStyle]="{'stroke': gridcolor, 'stroke-width': 1/gridScaleY }"
[attr.width]="horizUpperLimit-horizLowerLimit"
[attr.height]="spacing"
[attr.x]="horizLowerLimit"
[attr.y]="pt">
</svg:rect>
<svg:text id="gridTextHoriz" class="gridtext"
[ngStyle]="{'stroke': gridcolor, 'font-size': 100/gridScaleY+'%', 'stroke-width': 1/gridScaleY }"
[attr.x]="(horizUpperLimit - horizLowerLimit)/2"
[attr.y]="invertVertical ? -pt : pt">{{pt}}</svg:text>
</svg:g>