| Specifies the width of the heat map |
Property: width
<ej-heatmap id="HeatMap" width="810px">
</ej-heatmap> |
Property: width
<ejs-heatmap id='heatmap-container' width="300px">` |
| Specifies the height of the heat map |
Property: height
<ej-heatmap id="HeatMap" height="810px">
</ej-heatmap> |
Property: height
<ejs-heatmap id='heatmap-container' height="300px">
</ejs-heatmap> |
| Enables or disables tooltip of heat map |
Property: showtooltip
<ej-heatmap id="HeatMap" showTooltip="true">
</ej-heatmap> |
Property: showTooltip
<ejs-heatmap id='heatmap-container' showTooltip = "true">
</ejs-heatmap> |
| Defines the tooltip that should be shown when the mouse hovers over cells. |
Property: toolTipSettings.templateId
<ej-heatmap id="HeatMap">
<e-heatmap-tooltip-settings template-id="mouseovertoolTipId">
</e-heatmap-tooltip-settings>
</ej-heatmap> |
Property: tooltipRender
<ejs-heatmap id='heatmap-container' tooltipRender="window.ontooltipRender">
</ejs-heatmap>
window.ontooltipRender = function (args) { } |
| Specifies the source data of the heat map. |
Property: itemsSource
<ej-heatmap id="HeatMap" items-source="ViewBag.itemsource">
</ej-heatmap>
ViewBag.itemsource = [] |
Property: dataSource
<ejs-heatmap id='heatmap-container' dataSource="ViewBag.dataSource">
</ejs-heatmap>
ViewBag.dataSource = [] |
| Specifies whether the cell content can be visible or not. |
Property: heatmapCell.showContent
<ej-heatmap id="HeatMap" heat-map-cell="ViewBag.heatmapCell">
</ej-heatmap>
ViewBag.heatmapCell = new { showContent: “Hidden” } |
Property: cellSettings.showLabel
<ejs-heatmap id='heatmap-container'>
<e-heatmap-cellsettings showLabel="true"></e-heatmap-cellsettings>
</ejs-heatmap> |
| Specifies the color of the heat map column data. |
Property: colorMappingCollection.color
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping color="#8ec8f8">
</e-color-mapping>
</ej-heatmap> |
Property: paletteSettings.palette.color
<ejs-heatmap id='heatmap-container'>
<e-heatmap-palettesettings type="Fixed" emptyPointColor="white">
<e-palettes>
<e-palette color="rgb(238,238,238)">
</e-palette>
</e-palettes>
</e-heatmap-palettesettings>
</ejs-heatmap> |
| Specifies the color values of the heat map column data. |
Property: colorMappingCollection.value
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping value="0">
</e-color-mapping>
</ej-heatmap> |
Property: paletteSettings.palette.value
<ejs-heatmap id='heatmap-container'>
<e-heatmap-palettesettings type="Fixed" emptyPointColor="white">
<e-palettes>
<e-palette value="0">
</e-palette>
</e-palettes>
</e-heatmap-palettesettings>
</ejs-heatmap> |
| Specifies the label text of the heat map color. |
Property: colorMappingCollection.label.text
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping>
<e-label text="0">
</e-label>
</e-color-mapping>
</ej-heatmap> |
Property: paletteSettings.palette.label
<ejs-heatmap id='heatmap-container'>
<e-heatmap-palettesettings type="Fixed" emptyPointColor="white">
<e-palettes>
<e-palette label="No contributions">
</e-palette>
</e-palettes>
</e-heatmap-palettesettings>
</ejs-heatmap> |
| Specifies the style of the heat map color label. |
Property: colorMappingCollection.label.bold
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping>
<e-label bold="true">
</e-label>
</e-color-mapping>
</ej-heatmap> |
Property: legendSettings.textStyle.fontStyle
<e-heatmap-legendsettings textStyle="ViewBag.legendSettings">
</e-heatmap-legendsettings>
ViewBag.legendSettings = new {textStyle: { fontStyle:‘bold’ }} |
| Specifies the font size of the heat map label. |
Property: colorMappingCollection.label.fontSize
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping>
<e-label font-size="16">
</e-label>
</e-color-mapping>
</ej-heatmap> |
Property: legendSettings.textStyle.size
<e-heatmap-legendsettings textStyle="ViewBag.legendSettings">
</e-heatmap-legendsettings>
ViewBag.legendSettings = new {textStyle: { size: 18 }} |
| Specifies the font family of the heat map label. |
Property: colorMappingCollection.label.fontFamily
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping>
<e-label font-family="Arial">
</e-label>
</e-color-mapping>
</ej-heatmap> |
Property: legendSettings.textStyle.fontFamily
<e-heatmap-legendsettings textStyle="ViewBag.legendSettings">
</e-heatmap-legendsettings>
ViewBag.legendSettings = new {textStyle: { fontFamily: ‘Arial’ }} |
| Specifies the font color of the heat map label. |
Property: colorMappingCollection.label.fontColor
<ej-heatmap id="HeatMap">
<e-colorMappingCollection>
<e-color-mapping>
<e-label font-color="red">
</e-label>
</e-color-mapping>
</ej-heatmap> |
Property: legendSettings.textStyle.color
<e-heatmap-legendsettings textStyle="ViewBag.legendSettings">
</e-heatmap-legendsettings>
ViewBag.legendSettings = new {textStyle: { color: ‘red’ }} |
| Specifies the mapping name of the column. |
Property: itemsMapping.column.propertyName
<ej-heatmap items-mapping="ViewBag.itemsmapping">
</ej-heatmap>
ViewBag.itemsmapping = new {column: { “propertyName”: “ProductName” }} |
Property: dataSource.yDataMapping
<ejs-heatmap id='heatmap-container' dataSource="ViewBag.dataSource">
</ejs-heatmap>
ViewBag.dataSource = new {data: heatmapData,yDataMapping: ‘columnid’} |
| Specifies the mapping name of the row. |
Property: itemsMapping.row.propertyName
<ej-heatmap items-mapping="ViewBag.itemsmapping">
</ej-heatmap>
ViewBag.itemsMapping = new {row: { “displayName”: “Product Name” }} |
Property: dataSource.xDataMapping
<ejs-heatmap id='heatmap-container' dataSource="ViewBag.dataSource">
</ejs-heatmap>
ViewBag.dataSource = new {data: heatmapData,xDataMapping: ‘rowid’} |
| Specifies the mapping name of the row. |
Property: itemsMapping.value.displayName
<ej-heatmap items-mapping="ViewBag.itemsmapping">
</ej-heatmap>
ViewBag.itemsMapping = new {value: { “displayName”: “Product Name” }} |
Property: dataSource.valueMapping
<ejs-heatmap id='heatmap-container' dataSource="ViewBag.dataSource">
</ejs-heatmap>
ViewBag.dataSource = new {data: heatmapData,valueMapping: ‘value’} |