Question

我目前正在尝试使Datatables和Sparklines软件包一起工作，如下所示：

(This stuff is all written in R however)

我意识到我的问题类似于this one ...但是，即使查看了一些代码并将其改编成我自己的代码，我也只能渲染其中一个或另一个。从我在图表上的服务器或在缺少所有数据的情况下呈现的迷你图-永远不会在一起...

这是代码

<table id="table_id" class="display">
    <thead>
        <tr>
            <th>Table Name</th>
            <th>Column Name</th>
            <th>Rule</th>
            <th>Current</th>
            <th>Minimum</th>
            <th>Maximun</th>
            <th>Median</th>
            <th>Mean</th>
            <th>Sparkline</th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

上面的HTML和下面的JS。

<script>

    $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
    CURRENT_JOB = "{{ job_requested }}";
    data = {{ data|safe}}



$(function() {

       $('.js-typeahead').typeahead({
         order: "asc",
         source: {
           groupName: {
             // Array of Objects / Strings
             data: {{jobs|safe}}
           }
         },
         callback: {
           onInit: function() {
                $('#table_id').DataTable({
                   data:{{ data|safe}},
                    columns: [
                        {data: 'table_name'},
                        {data: 'col_name'},
                        {data: 'rule'},
                        {data: 'current'},
                        {data: 'min'},
                        {data: 'max'},
                        {data: 'median'},
                        {data: 'mean'},
                    ],
                    "aoColumnDefs": [
                    {
                        "aTargets": [8],
                        "mRender": function (data, type, full) {
                             // since data is an array of values [1,2,3,4]
                            data = data.toString()
                            return '<span class="spark">' + data + '</span>'
                        }
                    }
                ],
               "drawCallback": (oSettings) => {
                   console.log('callback')
                  $('.spark:not(:has(canvas))').sparkline('html', {
                      type: 'line',
                      minSpotColor: 'red',
                      maxSpotColor: 'green',
                      spotColor: false
                  });
              }
               });
           }
         }
       });


   });

有人知道我在做什么错吗？我需要columns: []将JSON数据指向表中的右列，但我还需要将数据对象中的键之一指向迷你图本身，然后调用.sparkline()

我从服务器获取的数据对象结构也看起来像这样：

 data = { 
      'table_name': cow,
      'col_name' : cow_col,
      'rule' : cow_col,
      ..etc, etc..
      'data4spark: [1,2,3,4]

   }

我非常感谢任何人的反馈/帮助！谢谢！ ❤️

Answer 1

知道了。每次我发布stackoverflow问题时总是会发生这种情况，但是如果我不这样发布，我想我会呆几天。

无论如何，在阅读了几个小时的文档后-include_once('connection.php'); if(isset($_POST['submit0'])) { $rfid = $_POST['rfid']; $time = date("H:i:s"); $sql = mysqli_query($conn, "SELECT * FROM stud LEFT JOIN student_att on stud.rfid_num = student_att.rfid_num WHERE stud.rfid_num = '$rfid' "); $count = mysqli_num_rows($sql); if($count == 0) { header("location:notexist.php"); } else { while($row = mysqli_fetch_array($sql)) { $rfid = $row['rfid_num']; $id = $row['id']; $name0 = $row['name']; $course0 = $row['course']; $image = $row['image']; echo $rfid; echo $id; echo $name0; echo $course0; if(empty($row['timein'])) { $InsertSql = "INSERT INTO student_att (rfid_num,id,name,course,image,timein) VALUES ('$rfid','$id','$name0','$course0','$image','$time')"; $res = mysqli_query($conn, $InsertSql); header("location:index111.php"); } else { if(empty($row['timeout'])) { header("location:logout.php"); } } } } }是一个选择器，可以选择表中的整行（如果已在HTML中已创建），并且这在我上面的代码中是错误的。aoColumnDefs是您在列的索引中传递的参数，而aTargets是您在将所有内容吐出之前直接调用的回调函数。屏幕（它可以预先修改该特定列的数据）

区别在于，我使用mRender将代码发送到HTML，然后我将整个col定位到标签上并将标签发送过来

发布我的代码，希望这可以节省一些时间

columns

让数据表和迷你图一起玩吗？

1 个答案: