CODEWITHSUNDEEP
javascriptjqueryangularjshighcharts
muhammad umar farooq frank
muhammad umar farooq frank

Reputation: 251

Highcharts ng heatmap draw line instead of boxes

Highcharts ng heatmap draw line instead of boxes

    $scope.chartConfig = {
"chart": {
    "type": "heatmap"
},
"credits": {
    "enabled": false
},
"size": {
    "height": 1000
},
"title": {
    "text": ""
},
"xAxis": {
    "categories": ["23-02-2005", "24-02-2005", "27-02-2005", "28-02-2005", "01-03-2005", "02-03-2005"]
},
"yAxis": {
    "categories": ["Bond2Y", "Bond3Y"],
    "title": null
},

"series": [{
    "name": "Trades Data",
    "borderWidth": 1,
    "data": [
        [0, 0, 0.7642386249005615],
        [0, 1, 0.5010608923969173],
        [1, 0, 0.5009742082142428],
        [1, 1, 0.9114076033035807]
    ],
    "dataLabels": {
        "enabled": false,
        "color": "#000000"
    }
}]

}

Angular Highcharts

When i place these config with JQuery Its works fi

jQuery Highcharts

Is this is the highcharts-ng issue ?

Upvotes: 0

Views: 317

Answers (1)

David R
David R

Reputation: 15639

When I checked your fiddle I had observed that you have not included the heatmap.js library.

Also, You need to move your chart and colorAxis inside the options block.

Check the below working fiddle link in which you can see the square blocks identical to your jQuery example.

Working Fiddle: http://jsfiddle.net/y9wjy0kz/10/

Hope this helps!

Upvotes: 1

Related Questions