jessicasmith26

Members
  • Content count

    1
  • Joined

  • Last visited

About jessicasmith26

  • Rank
    Forum Newbie
  • Birthday 08/26/1991

Contact Methods

  • Website URL
    https://sisgain.com
  • Skype
    spectrum.specialist

Profile Information

  • Gender
    Female
  • Location
    New York City
  • Interests
    coding, reading blogs
  1. Heatmap gradient start and end color range

    Hi Mennims The startValue and endValue properties are used to define the range start and end value. The minColor and maxColor properties represent the colors of given range. It’s possible to set the cell color for the value not in the given range using the fillColor property. In Fixed type, the minColor value is used for cell color. import { HeatMap, Legend } from '@syncfusion/ej2-heatmap'; HeatMap.Inject(Legend); let heatmapData: any [] = [ [73, 39, 26, 39, 94, 1], [93, 58, 53, 38, 26, 68], [99, 28, 22, 4, 66, 90], [14, 26, 97, 69, 69, 3], [7, 46, 47, 47, 88, 6], [41, 55, 73, 23, 3, 79], [56, 69, 21, 86, 3, 33], [45, 7, 53, 81, 95, 79], [60, 77, 74, 68, 88, 51], [25, 25, 10, 12, 78, 14], [25, 56, 55, 58, 12, 82], [74, 33, 88, 23, 86, 59]]; let heatmap: HeatMap = new HeatMap({ titleSettings: { text: 'Sales Revenue per Employee (in 1000 US$)', textStyle: { size: '15px', fontWeight: '500', fontStyle: 'Normal', fontFamily: 'Segoe UI' } }, xAxis: { labels: ['Nancy', 'Andrew', 'Janet', 'Margaret', 'Steven', 'Michael', 'Robert', 'Laura', 'Anne', 'Paul', 'Karin', 'Mario'], }, yAxis: { labels: ['Mon', 'Tues', 'Wed', 'Thurs', 'Fri', 'Sat'], }, paletteSettings: { palette: [ { startValue:1, endValue:30, minColor: '#C2E7EC', maxColor: '#AEDFE6' }, { startValue:30, endValue:60, minColor: '#9AD7E0', maxColor: '#72C7D4' }, { startValue:60, endValue:90, minColor: '#5EBFCE', maxColor: '#4AB7C8' } ], type: "Gradient" }, dataSource: heatmapData, legendSettings: { visible: true, } }); heatmap.appendTo('#element');