将PHP函数回显到Highcharts Drilldown

时间:2016-03-31 04:21:52

标签: php highcharts

我有2个功能可以生成"向下钻取"高图表演示的数据。

如果我在highcharts javascript之外运行函数并使用然后手动将生成的数据(如下所示)插入到javascript中,图表工作正常:

    

$(function () {

Highcharts.theme = {

    chart: {
        height: 480,
        //margin: [0, 0, 0, 0],
        spacingTop: 30,
        spacingBottom: 20,
        spacingLeft: 0,
        spacingRight: 20,
        renderTo: 'this_week_chart',
        type: "line",
        style: {
            //fontFamily: "Open Sans"
            font: '"Open Sans","Source Sans Pro",Helvetica,sans-serif'  
        }
    }
};

Highcharts.setOptions(Highcharts.theme);

var chart = new Highcharts.Chart({

    series: [{
            type: "column",
            index: 0,
            name: "Total Sales Value (inc. tax)",
            data:
            [
{name: 'Monday', y: null, drilldown: 'Monday'},
{name: 'Tuesday',y: 890, drilldown: 'Tuesday'},
{name: 'Wednesday',y: 1150.5, drilldown: 'Wednesday'},
{name: 'Thursday',y: 1519.5, drilldown: 'Thursday'},
{name: 'Friday', y: null, drilldown: 'Friday'},
{name: 'Saturday', y: null, drilldown: 'Saturday'},
{name: 'Sunday', y: null, drilldown: 'Sunday'}
]
            }],

            drilldown: {
            series:
[
{name: 'Monday',id: 'Monday',data: []},
{name: 'Tuesday',id: 'Tuesday',data: [['17',67],['18',95.5],['19',185],['20',228],['21',209],['22',98],['23',7.5]]},
{name: 'Wednesday',id: 'Wednesday',data: [['17',26],['18',176.5],['19',135.5],['20',248],['21',215],['22',277],['23',72.5]]},
{name: 'Thursday',id: 'Thursday',data: [['0',null],['17',22],['18',111.5],['19',383],['20',211],['21',456.5],['22',157],['23',178.5]]},
{name: 'Friday',id: 'Friday',data: [['0',90],['17',158],['18',203],['19',324.5],['20',509],['21',290.5],['22',5],['23',27.5]]},
{name: 'Saturday',id: 'Saturday',data: [['1',69]]},
{name: 'Sunday',id: 'Sunday',data: []}
]
                    },
    tooltip: {
        borderRadius: 5,
        shared: true
    },
            legend: {
            enabled: false
        },
    plotOptions: {
        arearange: {
            tooltip: {
                followPointer: true
            }
        },
        series: {
            dataLabels: {
                style: {
                    fontWeight: "normal",
                    fontSize: "10"
                }
            }
        },
        column: {
            dataLabels: {
                format: '${y:,.0f}',
                enabled: true,
            }
        }
    },
    yAxis: {
        labels: {
        format: '${value:,.0f}'
        }
    },
    xAxis: {
        type: "datetime",
        dateTimeLabelFormats: {
            day: '%a, %b %e'
        }
    }
        });
        });
    </script>

如果我将数据作为变量插入(如下所示),则代码不再有效:

</script>
    <script type="text/javascript">

            $(function () {

    Highcharts.theme = {

        chart: {
            height: 480,
            //margin: [0, 0, 0, 0],
            spacingTop: 30,
            spacingBottom: 20,
            spacingLeft: 0,
            spacingRight: 20,
            renderTo: 'this_week_chart',
            type: "line",
            style: {
                //fontFamily: "Open Sans"
                font: '"Open Sans","Source Sans Pro",Helvetica,sans-serif'  
            }
        }
    };

    Highcharts.setOptions(Highcharts.theme);

    var chart = new Highcharts.Chart({

        series: [{
                type: "column",
                index: 0,
                name: "Total Sales Value (inc. tax)",
                data:

<?php produce_HC_simple_drill_top($HC_SERIES_BY_DAY, "DAY", "TOTAL_SALES");?>

                }],

                drilldown: {
                series:

<?php produce_HC_simple_drill_bottom_hour($HC_SERIES_BY_DAY,"DAY","TOTAL_SALES", "SALE_HOUR", "TOTAL_SALES", $This_wk_starts, $This_wk_ends); ?>


                        },
        tooltip: {
            borderRadius: 5,
            shared: true
        },
                legend: {
                enabled: false
            },
        plotOptions: {
            arearange: {
                tooltip: {
                    followPointer: true
                }
            },
            series: {
                dataLabels: {
                    style: {
                        fontWeight: "normal",
                        fontSize: "10"
                    }
                }
            },
            column: {
                dataLabels: {
                    format: '${y:,.0f}',
                    enabled: true,
                }
            }
        },
        yAxis: {
            labels: {
            format: '${value:,.0f}'
            }
        },
        xAxis: {
            type: "datetime",
            dateTimeLabelFormats: {
                day: '%a, %b %e'
            }
        }
            });
            });
        </script>

这没有任何意义,因为我之前没有使用下钻来将PHP生成的数据插入到高级图表中,一切正常。我根本无法弄清楚这里有什么问题,有人可以帮忙吗?

0 个答案:

没有答案