Question

我使用Highcharts创建基于csv文件的热图。它不会以某种方式工作。它返回一个空白图表。我已经在下面描述了csv文件和htm编码。感谢任何帮助以使其发挥作用。

csv文件如下所示：

Tranche 1y 2y 3y
CDX24 100 200 300
CDX25 200 100 50

用于生成热图的htm编码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>CVA Credit Exposure</title>


        <!-- 1. Add these JavaScript inclusions in the head of your page -->
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script type="text/javascript" src="http://code.highcharts.com/modules/data.js"></script>
        <script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
        <script type="text/javascript" src="http://code.highcharts.com/modules/heatmap.js"></script>
        <script type="text/javascript" src="http://code.highcharts.com/modules/exporting.js"></script>

        <!-- 2. Add the JavaScript to initialize the chart on document ready -->
        <script type="text/javascript">

        var chart;
        $(document).ready(function() {

            $.get('CS01terms.csv', function(csv) {
                $('#CS01').highcharts({
                    chart: {
                        type: 'heatmap',
                    marginTop: 40,
                    marginBottom: 80,
                    plotBorderWidth: 1
                    },
                    data: {
                        csv: csv
                    },
                title: {
                    text: 'CS01 exposure',
                    align: 'left'
                },

                colorAxis: {
                    min: 0,
                    minColor: '#FFFFFF',
                    maxColor: Highcharts.getOptions().colors[0]
                },
                legend: {
                    align: 'right',
                    layout: 'vertical',
                    margin: 0,
                    verticalAlign: 'top',
                    y: 25,
                    symbolHeight: 280
                },

                tooltip: {
                    formatter: function () {
                    return '<b>' + this.series.xAxis.categories[this.point.x] + '</b> sold <br><b>' +
                    this.point.value + '</b> items on <br><b>' + this.series.yAxis.categories[this.point.y] + '</b>';
                    }
                }

                });
                });
            });




        </script>

    </head>
    <body>


        <!-- 3. Add the container -->
        <Table width="100%" cellspacing=0 cellpadding=0 border=0>
        <tr>
        <td> <div id="CS01" style="width: 600px; height: 400px; margin: 0 auto"></div> </td>

        </tr>   
        </table>
    </body>
</html>

使用highcharts创建具有csv文件的热图时出错

0 个答案: