Question

因此，我的代码编译时没有错误，列表部分显示没有任何问题。然而，图表的代码没有显示任何内容（.script里面的部分，你看到var tp。） HTML输出只显示图表的任何输出。其他一切似乎都是有效的。

extends layout
doctye html
html(lang='en')
  head
    script(language='javascript',type='text/javascript',src='jquery.min.js')
    script(language='javascript',type='text/javascript',src='jquery.jqplot.min.js')
    link(rel='stylesheet',type='text/css',href='jquery.jqplot.css')

   div(id='chartdiv',style='height:400px;width:700px;')

  body
    script.
        var tp = [95,85,73,10,0,55,80,118,45,47,60,65,36,78,99];
        $.jqplot('chartdiv',  [[[0, 15],[10,78]],[[0, tp[0]],[1,tp[1]],[2,tp[2]],
        [3,tp[3]],[4,tp[4]],[5,tp[5]],[6,tp[6]],[7,tp[7]]]],
        { title:'Temperatures',
          axes:{xaxis:{label:'Time (seconds)', min:0, max:15, numberTicks:16}, 
          yaxis:{label:'Temperature (F)', min:0, max:120, numberTicks:13}},
      series:[{color:'#5FAB78'},{color:'#000077'}],
      legend:{show:true, labels:['Cats','Dogs']}
    });
  block content
    h1.
        User List
    ul
        each user, i in userlist.reverse()
            li
                <p> TIME #{user.wd1} WD #{user.wd2} WS #{user.wd3} WS1HR #{user.wd4}     
                    TEMP #{user.wd5} CHILL #{user.wd6} ALT #{user.wd7} 
                    HUM #{user.wd8} PRESS #{user.wd9} SOIL #{user.wd10} 


  meta(http-equiv='refresh', content='5')

Answer 1

你的代码中存在很多问题，看看哪些对我有用，然后我会查看问题列表：

extends layout
doctype html
html(lang='en')
  head
    script(language='javascript',type='text/javascript',src='jquery.min.js')
    script(language='javascript',type='text/javascript',src='jquery.jqplot.min.js')
    link(rel='stylesheet',type='text/css',href='jquery.jqplot.css')
  body
    script.
      $(document).ready(function(){
        var tp = [95,85,73,10,0,55,80,118,45,47,60,65,36,78,99];
        $.jqplot('chartdiv',  [[[0, 15],[10,78]],[[0, tp[0]],[1,tp[1]],[2,tp[2]],
        [3,tp[3]],[4,tp[4]],[5,tp[5]],[6,tp[6]],[7,tp[7]]]],
        { title:'Temperatures',
          axes:{xaxis:{label:'Time (seconds)', min:0, max:15, numberTicks:16}, 
          yaxis:{label:'Temperature (F)', min:0, max:120, numberTicks:13}},
          series:[{color:'#5FAB78'},{color:'#000077'}],
          legend:{show:true, labels:['Cats','Dogs']}
         });
      });
  block content
    div(id='chartdiv',style='height:400px;width:700px;')
    h1.
      User List
    ul
      each user, i in userlist.reverse()
        li
            <p> TIME #{user.wd1} WD #{user.wd2} WS #{user.wd3} WS1HR #{user.wd4}     
                TEMP #{user.wd5} CHILL #{user.wd6} ALT #{user.wd7} 
                HUM #{user.wd8} PRESS #{user.wd9} SOIL #{user.wd10} 

  meta(http-equiv='refresh', content='5')

您错过了doctype
您图表的div高于body标记。
您的脚本错误，您错过了以$(document).ready(function(){开头，然后以另一个});结束

使用上面的代码，如果你将* .js和* .css嵌入，你的图表应该显示！

翡翠新手。想知道为什么图表没有显示？

1 个答案: