Matti,
Thanks for the quick reply.
Please find the chart configuration below. I revised the example that you provided in the other charts post and only left the map stuff that’s custom.
I reduced the
HighchartPluginResources
and
HighchartsPluginScriptLoader
to only add scripts to generate map heat charts:
@Source("com/mindspark/apn/vcs/web/client/world-map-shapes.js")
TextResource worldMapShapes();
@Source("com/mindspark/apn/vcs/web/client/map.src.js")
TextResource mapSrcJs();
and
inject(HighchartPluginResources.INSTANCE.worldMapShapes().getText());
inject(HighchartPluginResources.INSTANCE.mapSrcJs().getText());
Everything else is loaded as specified in
HighchartResources
.
The following is the configuration that I use:
{
"chart": {
"type": "line",
"spacingRight": 25,
"zoomType": "x"
},
"title": {
"floating": true,
"text": ""
},
"xAxis": {
"type": "datetime",
"startOnTick": false,
"showFirstLabel": true,
"showLastLabel": true,
"dateTimeLabelFormats": {
"second": " ",
"minute": " ",
"hour": " ",
"day": "%b %e",
"week": "%b %e",
"month": "%b %e"
},
"endOnTick": false,
"axisIndex": 0
},
"yAxis": [
{
"labels": {
"_fn_formatter": "function() {return \u0027$\u0027 + $wnd.Highcharts.numberFormat(this.value, 0, \u0027,\u0027);}"
},
"title": {
"text": ""
},
"showFirstLabel": true,
"showLastLabel": true,
"minPadding": 0.0,
"axisIndex": 0
},
{
"labels": {
"_fn_formatter": "function() {return \u0027\u0027 + $wnd.Highcharts.numberFormat(this.value, 0, \u0027,\u0027);}"
},
"title": {
"text": " ",
"style": {}
},
"showFirstLabel": true,
"showLastLabel": true,
"opposite": true,
"minPadding": 0.0,
"axisIndex": 1
}
],
"tooltip": {
"_fn_formatter": "function() { var unit\u003d\u0027\u0027; if(this.series.name \u003d\u003d \u0027Totals\u0027) unit\u003d\u0027$\u0027; return unit + \u0027\u0027+ $wnd.Highcharts.numberFormat(this.y, 0) +\u0027\u003c/b\u003e\u003cbr/\u003e\u0027+ $wnd.Highcharts.dateFormat(\u0027%A, %b %e, %Y\u0027, this.x);}"
},
"legend": {
"layout": "horizontal",
"align": "center",
"verticalAlign": "bottom",
"floating": false,
"enabled": false
},
"credits": {
"enabled": false
},
"series": [
{
"data": [
{
"y": 5833.448421534268,
"x": 1370995200000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 5747.082095542318,
"x": 1371081600000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 5536.116469663475,
"x": 1371168000000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 5190.219700764622,
"x": 1371254400000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 5756.474382025763,
"x": 1371340800000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 5940.68886995518,
"x": 1371427200000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 5792.404670910532,
"x": 1371513600000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 6098.552992630286,
"x": 1371600000000,
"marker": {
"enabled": false
},
"customized": true
}
],
"name": "Totals",
"visible": true,
"yAxis": 0,
"color": "#5FADDA",
"type": "line"
},
{
"data": [
{
"y": 0.0,
"x": 1370995200000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 0.0,
"x": 1371081600000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 0.0,
"x": 1371168000000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 0.0,
"x": 1371254400000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 0.0,
"x": 1371340800000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 0.0,
"x": 1371427200000,
"marker": {
"enabled": false
},
"customized": true
},
{
"y": 0.0,
"x": 1371513600000,
"marker": {
"enabled": false
},
"customized": true
}
],
"name": "Fake",
"visible": false,
"yAxis": 1,
"color": "#F29408",
"type": "line"
}
],
"exporting": {
"enabled": false
}
}
Interestingly, if I plugin this configuration into
http://export.highcharts.com/demo
, it generates the image correctly.
Thank you,
AT.