missing image specified in chart.plotBackgroundImage causes phantom page to time out

[alexmiddeleer]

Happens to be for a bubble chart. Please let me know if you need any more information. I poked around for a while in highcharts-convert but didn't notice anything obviously amiss. This works fine in real browsers (Chrome, Firefox). I don't know if the problem is in Phantom or exporting-server/phantom/highcharts-convert.js

This config file fails, but succeeds when chart.plotBackgroundImage is removed. The image in question is missing, but I assume the page should not time out if it's missing, but rather show nothing or a broken image placeholder. Thanks :)

{
    "chartXFormat": "$",
    "chartYLabel": "A Y Label",
    "chartXLabel": "An X Label",
    "series": [
        {
            "data": [
                {
                    "marker": {
                        "fillColor": "#94B4D6"
                    },
                    "bubbleLabel": "DEMO-12",
                    "dataLabels": {
                        "enabled": true
                    },
                    "z": 25,
                    "tooltipName": "Sample Facility",
                    "y": 56.37,
                    "x": 15091
                },
                {
                    "bubbleLabel": "P",
                    "dataLabels": {
                        "enabled": true
                    },
                    "z": 25,
                    "y": 32.43,
                    "x": 16287
                }
            ]
        }
    ],
    "xAxis": {
        "plotLines": [
            {
                "width": 2,
                "value": 11608.5,
                "color": "gray"
            }
        ],
        "labels": {
        },
        "title": {
            "text": "A Title"
        },
        "gridLineWidth": 1
    },
    "plotOptions": {
        "bubble": {
            "maxSize": "10%",
            "dataLabels": {
                "style": "",
                "borderRadius": 0,
                "padding": 0,
                "color": "black",
                "backgroundColor": "rgba(225,225,225,0.00)",
                "enabled": false
            }
        }
    },
    "title": {
        "text": "A Title"
    },
    "colors": [
        "#CCCCCC"
    ],
    "yAxis": {
        "plotLines": [
            {
                "width": 2,
                "value": 54.655,
                "color": "gray"
            }
        ],
        "title": {
            "text": "A Title"
        },
        "labels": {
        }
    },
    "legend": {
        "enabled": false
    },
    "credits": {
        "enabled": false
    },
    "chart": {
        "plotBackgroundColor": {
            "stops": [
                [
                    0,
                    '#eaf2fd'
                ],
                [
                    1,
                    '#FFFFFF'
                ]
            ],
            "linearGradient": [
                0,
                0,
                0,
                600
            ]
        },
        "plotBackgroundImage": "/img/charts/arrow.gif",
        "height": 550,
        "width": 550,
        "animation": false,
        "zoomType": "xy",
        "defaultSeriesType": "bubble"
    }
}

[TorsteinHonsi]

When an image is undefined or unreachable, the PhantomJS script proceed instead of waiting for the image until timeout. We can implement this by adding an error event handler like this:

http://jsfiddle.net/highcharts/9nqB7/2/

[gvaartjes]

Sorry, but my implementation of the fix was done a kind of hasty. This is the corrected commit 7c722ca

[alexmiddeleer]

I am afraid I am now getting an error from phantom stdout: TypeError: 'undefined' is not an object (evaluating '1.Pointer.prototype') hightcharts-more.js:44 highcharts-more:50 I will switch to the unminified versions and see what line number it is.

Update: from source, the error is on Highcharts.Pointer.prototype on lines 1988 and 2439, respectively.

[gvaartjes]

Ok. Are you running the latest highcharts code from github?

[alexmiddeleer]

I apologize, I had swapped highcharts with highstock mistakenly. However, after I deleted everything in phantomjs and downloaded it from scratch, the timeout error still occurs (I verified that your patch was applied).

[gvaartjes]

Yes, I can confirm the timeout error still occurs and sometimes it finishes within the timeout. So, perhaps you should increase the config.TIMEOUT parameter on L.26. Please let me know if this makes it stable for you.

[alexmiddeleer]

It still times out after adding 10 seconds. Perhaps I need to modify my phantom settings.

[alexmiddeleer]

I tried adding the line page.settings.resourceTimeout = 500; on line 97, but still no luck. However, I then tried switching back to Highcharts 3.0 and the version of Highcharts-convert.js that has Highcharts JS v2.3.3 (2012-11-02) in its header, and it worked.

[gvaartjes]

The configuration I used was
highcharts-convert.js, highcharts.src.js, highcharts-more.src.js, all from GitHub
and
highcharts-convert.js (from GitHub), highcharts.src.js, highcharts-more.src.js, from code.highcharts.com (latest release)

With a short timeout setting it crashes for the first run on the timeout error, the second run passes due to caching og phantomjs