Here you go, this shows how to display the MIDI data in a panel. I think there is also an example in the HISE docs under MIDI somewhere. My version tries to scale the MIDI data to fill the whole panel, so it should resize the notes depending on how far they are from each other (in pitch, not time) in the MIDI sequence. But this will give you full customization over how the notes are displayed using the paint routine.
HiseSnippet 2161.3ocyXr1Siqb0AVu8RZ2pck5O.28CW4rKXrSBPPnaK4II.IjMIvBrZ6dGrmDOA+B6IgXp1+a89s9mX+OTU0uVs8L1N1NA1GBcuR0BgxbdMmWy4bloqqsJ1yy1kKS1A9NXtL+A999VT8p5HhEWqZbYdFuIQiTi34Xf74p36f77vZbYxr5ALRxr1S3B99W+0JHCjkJNADG2Y1DU7wDSBMAZ28OhXXz.ogGPLSQcw8aoZaU01vdBnNqxKy4fTuFMB2AwHaEdtlHOctLuheq7ETKpsiV97as61pnsw6NDMbnRAshE2tztJE1EUrz1X4s3x7z5ZDpsaeJhh83x7jJ1Z980su0JbCNi3Qtx.yVnv0G14PvMrMzXlHCJWUchgV249IONPJcS7ZqF509S7sAmTL7Du2yCPHjvQZGXlUVT8VcA0S4KodOfJsRJU52MOPFnRPPC6FnJ+Q91sp0RHDhxBJR0IttXKZe7MSvKFA2OB0.WHVjNXerssScKDndZoAyj9U.o8cvKhHyp+JYqbLypAw.GX2yW.TyrQHIoFhh3x7K7JEkkrFr8QkpdlgzfxkkZN3MC1or6A8lluzoiJciZgdFyTFapqzSIemJ96RuZ5VH7YCqV6ldkjNpvssJ29jQUuzsf9M61svwimT.4zz8rxkt8xV0FI207jy6ocadK+iOt01GNQu9QmJcv0GUs.tu6fxGWVhVc312VrRkgRim52s7j1Tc+yaWpfhtdiYRJCqTS+zRSd6fZ05LE0ubkaLeaeyR9ac4EmvwrpvLeS9MO0C65sI10B6Q2rF16ZpsylkmnQrE5iLc.mwlsa2ci5P.0hRPFdavbLazEhDaHmeiZtSLgETJHAfRHMHj71cyuQcMy7anjuzUNlRvIcHcfcrrOYjEhNwE19m1YhYED35iilOe+N1lD.OKcKAXMr0CAlko.QcWZ5BCgoOKjgL.a5Xm.3m2m6KEb+O7J6TJJ3pzn7fAPv0+1K6VwpUOIxXylG1cbkZijp8lxUtqRCpaO8qqn16v1EGewEiLO+5lXkxyFbxzCnie8YM145hnS8OeZs7mK4TW8L+AdzqTPZZmMXX4AjyObl132bwzxM0O4rCNxWt904ct4z563Qk6T+5S6d9AUbtRRZx3Vuw6tdac2wutSy23IctTEqwC0mpcEA45WuUKKsNRSpNEO97AVGHeSsi6fGnXHe4cVGRt7Hc8iv488l42bxc8lVR+j7EOb3NSu9tNct6vCqlJev92z7glDml1NE1nTg++Ii3u8ea7uW4eLXetTk4dRXYtWv2W0k3PSvvRU987sr.iaHBJlktPWHsbqbwZ7UsAJrnRlnqwMbgEwbHVPVdcg7xx41KaVnkjGUXJxUf4lhJdJ7SBAcIkFgoIUYEeY5BruD3NgYGKiOzNoOJHf46OHhp1fcZAKDe4RzwDR1kfI4gocg9Kzd1SnDKr3vIVpThsk3nbY+6YEfuQRCgVrkMLDo5DO1VH9xqFE1Z8k4.YxHJ3eatoPeUjAVfpiCrPAM3Hl.0VfIg.nNHKrQ.wLCwxlBMzAq5mR6PXaQG.SOrJEYMxHfDw2AtQ3u45vaIZTcwbI.ZhIizoh4dejFwjOjtvDDHdk76jBLZVDX4E09SrL7EbXAerVnNSFxTaWr.wKwhBHGvH9mSq0Du5lNTewbB+3OFaYRFXqQTcg+hfbt.1B8orug1tBhL5DHVwzmKFcBgo8VvgkqvtflyV7Nk2uWjxO+KwhaifTJXoXDn0SwejKJloX+QHSnYhQf9BL8w3eE+Cv6UEYnNw.5HKnEkX5fbghLvIAurKaH8fH6B6nx5w5wFyMiTaYPdOK4ILNCbtbfeQZQSQDC1DE8gA+XaTZl2LzwGpCuVPYIdY3h2lXErz5KIzTbk1MTyEcafH7dbgZPDAdg3Lszp1rt1dyi9xueu6g21kLBpQZzILrkJQ4djdK6DzbBxuDAKqQ8vlHmfSvWH3X6QXkHBOXSCfNOh6xboOPlqqIxfbGVKT8EWVMSh3PrINzbec1et4mVduRPLcvciTwubeEqJNSDJy.x7cLW65A6v5g9l0SInGv+4oizruMM2rToPID9qukTV1IGm4r.hQrZzgkaSUAlPwlKUCNgAVoKnftEbwi3hnhysUnajjbtuSMQ.ZKX.8E9hZj7rxkaD7kaOgknRCjxWQMTjjC928Jr7wEJJGnKNQWEHI4iXoQTYCCDWVeNMg4HK0PoaBx.9gxzuZ4lI6k86wemO1gGZgGyZalZuWWXgExRx2uI07XvGYsjSqoPSdKv4LvtKKiVbot0fKlUmMjF1wuv1ooE.n68vNrN5mXM2VgaPBmlDotSvgRHhBgfMIa1487ErCNCdB3bfd+qkEhCKiZ3vGDGa9CWaCCXtkGBMajO2uFihVAsXVGhiFfRNmPXvrEun2S+9tnmZ33PoHz1pkEgdhCNZ8W+V4bQySA+5zVAWS.l2KBFPmC1kRXpSlZ3oDUb3viqwGM6b.sQCgwkIKM.6ylOZIykywFD9E7KEc4lkdDV+zKBpjvkgOy5Y33zCRhXq9m.p4ihAj+zrYy9YF4IIqLne5Se5WVDZdFXNtO+QFXJdFMg3OCegurx8lN947ss0XM3W7MIXubSDBHltvDxrofsfbP+Et792+CUH+0u792oJ9B9tDpp9Cqiq7.5H6s.9MPGiddmmwWe3P37ahB9D9Fm+XeKmuw1GNV+HXHFWBjdwCMa6CQZULql.jI5wRiVgkwGtVlsl4A5iszBVvRHhPpvVmIBoxbjblHUW6OnFdRl8PJ+P.DPmrBth4Z7sYqET3BNcm1OydMvOnptnntGi4erLV3wxXwGKia8XYb6GKi67XYrz2lQVwoxSn1lgGa33Z2sd3qljI945xrJ2+CqyWNGC
Content.makeFrontInterface(300, 200);
const var MIDIPlayer1 = Synth.getMidiPlayer("MIDI Player1");
const var pnl_MidiDisplay = Content.getComponent("pnl_MidiDisplay");
pnl_MidiDisplay.setPaintRoutine(function(g)
{
g.fillAll(this.get("bgColour"));
// Scale the MIDI data to fill the panel
var noteList = MIDIPlayer1.getNoteRectangleList([0, 0, this.getWidth(), this.getHeight()]);
var minNote = 127;
var maxNote = 0;
// Only proceed fill if there is MIDI data
if (!MIDIPlayer1.isEmpty() && noteList.length > 0)
{
for (note in noteList)
{
var noteNumber = note[1];
minNote = Math.min(minNote, noteNumber);
maxNote = Math.max(maxNote, noteNumber);
}
// Calculate display parameters
var noteRange = Math.max(1, maxNote - minNote);
var panelHeight = this.getHeight();
var availableSpace = panelHeight / (noteRange + 1);
var noteHeight = Math.max(8, availableSpace);
// Draw notes
for (note in noteList)
{
// Note data
var xPos = note[0];
var originalNoteNum = note[1];
var width = note[2];
// Remap the Y position to fit the display range
var normalizedPos = (originalNoteNum - minNote) / noteRange;
var yPos = normalizedPos * (panelHeight - noteHeight);
var noteRect = [xPos, yPos, width, noteHeight];
var shadowRect = [xPos + 1, yPos + 1, width, noteHeight];
// Draw note
g.setColour(this.get("itemColour"));
g.fillRoundedRectangle(noteRect, 2.0);
// Draw note outline
g.setColour(0xAAFFFFFF);
g.drawRoundedRectangle(noteRect, 1.0, 1.0);
}
}
// Draw playback position indicator
var playbackPos = MIDIPlayer1.getPlaybackPosition() * this.getWidth();
g.setColour(this.get("itemColour2"));
g.drawLine(playbackPos, playbackPos, 0.0, this.getHeight(), 2.0);
});
MIDIPlayer1.connectToPanel(pnl_MidiDisplay); // Connect to panel
MIDIPlayer1.setRepaintOnPositionChange(true); // Repaint Panel
