在Highslide (Highcharts)中使用Ajax处理maincontentText

Question

首先，谢谢你的帮助!

基本上，我使用Highcharts中的Hililide来显示一些图片，当有人点击线形图中的数据点时。下面是代码:

hs.htmlExpand(null, 
                {                       
                    pageOrigin: 
                    {
                        x: this.pageX,
                        y: this.pageY
                    },
                    headingText: "<p style='margin: 0 auto;'> Weight: " + this.y,
                    maincontentText: "<p class='pictures'></p>" +
                        $.ajax
                ({
                    type: "post",
                    url: "pictures.php",
                    data: 
                    {
                        "date" : this.Pictures
                    },
                    success: function(result)
                    {
                        $('.pictures').html(result); 
                    }
                }),
                    width: 700, 
                    height: 600
                });                     

现在，Hililide正确显示图片，但它也在Hililide弹出框的末尾输出"[Object Object]"。如果我将php页面更改为"echo 'test';"，它将显示单词"test"，然后显示[Object对象]。

关于如何摆脱这个[Object Object]块有什么想法吗?

谢谢!

Answer 1

您的ajax似乎返回一个json对象。您需要解析该对象以格式化您想要显示的结果，或者返回HTML…

编辑::

仔细一想，这似乎更像是你如何指定主要内容的问题。

使用HTML结尾的+作为主要内容，您将ajax调用作为内容包含在内。

我会指定html元素在你的maincontent，但删除ajax的onAfterExpand调用代替。

http://hililide.com/ref/hs.Expander.prototype.onAfterExpand

Answer 2

有趣的是，我不能使用这个解决方案，直到我看到你的其他问题，因为使用onAfterExpand对我来说是不清楚和不寻常的。所以我找到了Ajax, Highcharts和Hililide的另一个工作组合:)plotopoptions .spline.point.events:

click: function (e) {
    var curobj = this;
    $.ajax({
        url: "/path/to/test.html",
        dataType: "html",
        success: function(data){
            hs.htmlExpand(null, {
                pageOrigin: {
                    x: e.pageX || e.clientX,
                    y: e.pageY || e.clientY
                },
                headingText: curobj.series.name,
                maincontentText: data,
                width: 300
            });
        }
    });
}