jqwidgets-framework/demos/Angular/src/heatmap/opposedaxis/app.component.html

jQWidgets is an advanced Angular, Vue, Blazor, React, Web Components, jquery, ASP .NET MVC, Custom Elements and HTML5 UI framework.

<div class="container">
  <div id="heatmap">
    <jqxHeatMap #myHeatMap [xAxis]="xAxis" [yAxis]="yAxis" [source]="data"
      [title]="'Car sales revenue per employee(in 1000 &euro;)'">
    </jqxHeatMap>
  </div>

  <div id="options">
    <jqxCheckBox #myCheckBoxXAxis (onChange)="changeXAxisPosition($event)" [checked]="true">
      Change X-Axis Position
    </jqxCheckBox>
    <jqxCheckBox #myCheckBoxYAxis (onChange)="changeYAxisPosition($event)" [checked]="true">
      Change Y-Axis Position
    </jqxCheckBox>
  </div>
</div>