Example of undefined in React HeatMap Chart Component

All Controls
/
Heatmap-chart
/
ArrayCell

This sample visualizes the percentage growth rate of individuals using the internet in a country compared to the overall population to the country.

More Details...

Percentage of Individuals Using Internet by CountryChinaAustraliaMexicoCanadaBrazilUSAUKGermanyRussiaFranceJapan200020052010201120122013201475.5 %85 %65 %87.5 %75.5 %87.36 %91.75 %80.5 %70.52 %83.75 %90.58 %35.5 %65 %50.75 %85.8 %65 %84.2 %89.5 %76.5 %67.97 %81.92 %75.5 %59.75 %80 %40.75 %55 %45.5 %79.3 %88.5 %45.15 %63.8 %81.44 %50.5 %39.5 %75.5 %35.5 %50 %35.5 %50.75 %79.5 %42.35 %49 %77.82 %45.05 %25.5 %29.5 %30.05 %45.3 %35.5 %45.5 %75 %25.5 %43 %77.28 %40.5 %14.5 %35.5 %18.5 %20.5 %20.75 %20.75 %70 %20.75 %15.23 %42.87 %35.5 %10.75 %20.75 %6 %30.5 %10.5 %45.5 %26.82 %15.75 %1.98 %14.31 %25.5 %
Description

In this example, you can see how to bind two-dimensional array object as datasource for heatmap and configure the Heatmap using the data adaptor support.

Tooltip is enabled in this example, to see the tooltip in action, hover a point or tap on a point in touch enabled devices.



Injecting Module

Heatmap component features are segregated into individual feature-wise modules. To use data adaptor support, we need to inject Adaptor module using Heatmap.Inject(Adaptor) method and to use a tooltip, inject the Tooltip module using the Heatmap.Inject(Tooltip) method.