简体   繁体   English

意外令牌{在javascript中

[英]unexpected token { in javascript

I am trying to display charts on the web using Django and highcharts. 我正在尝试使用Django和highcharts在网络上显示图表。

I have passed the JSON-fomatted object as my_data from Python file into the HTML file. 我已经将JSON格式的对象作为my_data从Python文件传递到HTML文件。 In order to fit the data into highchart models, I have to do some modifications inside JavaScript (pair date object with value). 为了使数据适合高图表模型,我必须在JavaScript(将日期对象与值配对)内进行一些修改。

I'm totally new to JavaScript and HTML,the chart is not shown. 我对JavaScript和HTML完全陌生,未显示图表。

Below is my code in HTML: 下面是我的HTML代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Example</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://code.highcharts.com/stock/highstock.js"></script>
    <script src="https://code.highcharts.com/stock/modules/exporting.js"></script>

    <script type="text/javascript" src="http://ajax.cdnjs.com/ajax/libs/json2/20110223/json2.js"></script>
    <script type="text/javascript">
    var obj = {{ my_data | safe }};
    function parseDate(s) {
        var b = s.split(/\D+/);
        return new Date(Date.UTC(2016, --b[1], b[2]));
    };
    var lst = [];
    var date;
    for (date in obj) {
        var day_record = [parseDate(date['time']), date['pnl']];
        lst.push(day_record);
    };
    var result = lst.sort();

        $('#container').highcharts('StockChart', {
            rangeSelector: {
                selected: 1
            },
            title: {
                text: 'accumulated pnl'
            },
            series: [{
                name: 'pnl',
                data: result
            }]
        });
    </script>
</head>

<body>
    <h1> Accumulated pnl over time </h1>
    <hr>
    <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
</body>
</html>

my_data can be displayed on the web as something like this: my_data可以这样在网络上显示:

[{"pnl": -4214918.830000036, "time": "2016-03-23 00:00:00"}, {"pnl": -5223615.250000035, "time": "2016-03-28 00:00:00"}, {"pnl": 23250409.1, "time": "2016-01-20 00:00:00"}, {"pnl": 12716814.320000006, "time": "2016-02-25 00:00:00"}, {"pnl": -9925980.870001037, "time": "2016-04-06 00:00:00"}]

I have tried the code through the console, and got the following error. 我已经通过控制台尝试了代码,并收到以下错误。

VM683:1 Uncaught SyntaxError: Unexpected token {
    at Object.InjectedScript._evaluateOn (<anonymous>:145:167)
    at Object.InjectedScript._evaluateAndWrap (<anonymous>:137:25)
    at Object.InjectedScript.evaluate (<anonymous>:118:14)

I would really appreciate it if someone could offer me some advice! 如果有人可以给我一些建议,我将不胜感激!

check this and compare with your code: 检查一下并与您的代码进行比较:

var obj = {{my_data|safe}};
function parseDate(s) {
  var b = s.split(/\D+/);
  return new Date(Date.UTC(2016, --b[1], b[2]));
};

var lst = [];
var date;
for(date in obj){
  var day_record = [parseDate(date['time']), date['pnl']];
  lst.push(day_record);
};
var result = lst.sort();

You have a $ wrong positioned symbol... 您的$定位符号错误...

EDIT 编辑

Also no clue why you are using jQuery to call the last part, i think only need to do the highcharts part: 也不知道为什么使用jQuery来调用最后一部分,我认为只需要做highcharts部分:

$('#container').highcharts('StockChart', {
  rangeSelector : {
    selected : 1
  },

  title : {
    text : 'accumulated pnl'
  },

  series : [
    {
      name : 'pnl',
      data : result
    }]
  });

That should work aswell 那也应该工作

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM