Highchart示例在ASP.NET中显示空白

来源：互联网发布：python量化策略回测编辑：程序博客网时间：2024/05/29 15:53

问题描述：Highchart官方示例在网页中可以直接打开
但是将网页中的内容复制到ASP.NET中，却显示空白

已经解决

解决办法：以一个例子进行解释

请注意红色标注部分！！！！

Highchart官方示例：

<!DOCTYPE HTML><html>   <head>      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">      <title>Highcharts Example</title>      <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>      <style type="text/css">${demo.css}      </style>      <script type="text/javascript">$(function () {    $(document).ready(function () {        Highcharts.setOptions({            global: {                useUTC: false            }        });        $('#container').highcharts({            chart: {                type: 'spline',                animation: Highcharts.svg, // don't animate in old IE                marginRight: 10,                events: {                    load: function () {                        // set up the updating of the chart each second                        var series = this.series[0];                        setInterval(function () {                            var x = (new Date()).getTime(), // current time                                y = Math.random();                            series.addPoint([x, y], true, true);                        }, 1000);                },                plotLines: [{                    value: 0,                    width: 1,                    color: '#808080'                }]            },            tooltip: {                formatter: function () {                    return '<b>' + this.series.name + '</b><br/>' +                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +                        Highcharts.numberFormat(this.y, 2);                }            },            legend: {                enabled: false            },            exporting: {                enabled: false            },            series: [{                name: 'Random data',                data: (function () {                    // generate an array of random data                    var data = [],                        time = (new Date()).getTime(),                        i;                    for (i = -19; i <= 0; i += 1) {                        data.push({                            x: time + i * 1000,                            y: Math.random()                        });                    }                    return data;                }())            }]        });    });});      </script>   </head>   <body><script src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script><script src="http://cdn.hcharts.cn/highcharts/modules/exporting.js"></script><div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>   </body></html>

更改为：

<!DOCTYPE HTML><html>   <head>      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">      <title>Highcharts Example</title>      <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>      <style type="text/css">${demo.css}      </style>      <script type="text/javascript">$(function () {    $(document).ready(function () {        Highcharts.setOptions({            global: {                useUTC: false            }        });         var charts6 = new Highcharts.Chart({            chart: {

                renderTo: "container",           // type: 'line',                         //指定图表的类型，默认是折线图（line）            reflow: true,                type: 'spline',                animation: Highcharts.svg, // don't animate in old IE                marginRight: 10,                events: {                    load: function () {                        // set up the updating of the chart each second                        var series = this.series[0];                        setInterval(function () {                            var x = (new Date()).getTime(), // current time                                y = Math.random();                            series.addPoint([x, y], true, true);                        }, 1000);                },                plotLines: [{                    value: 0,                    width: 1,                    color: '#808080'                }]            },            tooltip: {                formatter: function () {                    return '<b>' + this.series.name + '</b><br/>' +                        Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' +                        Highcharts.numberFormat(this.y, 2);                }            },            legend: {                enabled: false            },            exporting: {                enabled: false            },            series: [{                name: 'Random data',                data: (function () {                    // generate an array of random data                    var data = [],                        time = (new Date()).getTime(),                        i;                    for (i = -19; i <= 0; i += 1) {                        data.push({                            x: time + i * 1000,                            y: Math.random()                        });                    }                    return data;                }())            }]        });    });});      </script>   </head>   <body><script src="http://cdn.hcharts.cn/highcharts/highcharts.js"></script><script src="http://cdn.hcharts.cn/highcharts/modules/exporting.js"></script><div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>   </body></html>

0 0

Highchart示例在ASP.NET中显示空白

问题描述：Highchart官方示例在网页中可以直接打开 但是将网页中的内容复制到ASP.NET中，却显示空白

请注意红色标注部分！！！！

问题描述：Highchart官方示例在网页中可以直接打开
但是将网页中的内容复制到ASP.NET中，却显示空白