首页 \ 问答 \ 在同一html页面中使用不同数据复制图表/图形(Duplicate charts/graphics with different data in the same html page)

在同一html页面中使用不同数据复制图表/图形(Duplicate charts/graphics with different data in the same html page)

 这是在网页上显示图表的HTML：  
<div class="chart" id="p1">
<canvas id="c1" width="560" height="260" style="width: 560px; height: 260px;"></canvas>
</div>
 
 这就是生成图表的原因：  
<script>
    var c1 = document.getElementById('c1');
    var parent = document.getElementById('p1');
    c1.width = parent.offsetWidth - 40;
    c1.height = parent.offsetHeight - 40;
    var data1 = {
        labels: [
            'Seg',
            'Ter',
            'Qua',
            'Qui',
            'Sex',
            'Sab',
            'Dom'
        ],
        datasets: [{
                fillColor: 'rgba(255,255,255,.1)',
                strokeColor: 'rgba(255,255,255,1)',
                pointColor: '#123',
                pointStrokeColor: 'rgba(255,255,255,1)',
                data: [
                    190,
                    200,
                    235,
                    390,
                    290,
                    250,
                    250
                ]
            }]
    };
    var options1 = {
        scaleFontColor: 'rgba(255,255,255,1)',
        scaleLineColor: 'rgba(255,255,255,1)',
        scaleGridLineColor: 'transparent',
        bezierCurve: false,
        scaleOverride: true,
        scaleSteps: 10,
        scaleStepWidth: 100,
        scaleStartValue: 0
    };
    new Chart(c1.getContext('2d')).Line(data1, options1);
        //@ sourceURL=pen.js
</script>
 
 我想在同一网站页面中制作具有不同值的其他图表...我已经尝试复制代码并更改id =“c1”e id =“p1”但没有... 

This is the HTML that display the chart on webpage: 
<div class="chart" id="p1">
<canvas id="c1" width="560" height="260" style="width: 560px; height: 260px;"></canvas>
</div>
 
and this is the that generate the chart: 
<script>
    var c1 = document.getElementById('c1');
    var parent = document.getElementById('p1');
    c1.width = parent.offsetWidth - 40;
    c1.height = parent.offsetHeight - 40;
    var data1 = {
        labels: [
            'Seg',
            'Ter',
            'Qua',
            'Qui',
            'Sex',
            'Sab',
            'Dom'
        ],
        datasets: [{
                fillColor: 'rgba(255,255,255,.1)',
                strokeColor: 'rgba(255,255,255,1)',
                pointColor: '#123',
                pointStrokeColor: 'rgba(255,255,255,1)',
                data: [
                    190,
                    200,
                    235,
                    390,
                    290,
                    250,
                    250
                ]
            }]
    };
    var options1 = {
        scaleFontColor: 'rgba(255,255,255,1)',
        scaleLineColor: 'rgba(255,255,255,1)',
        scaleGridLineColor: 'transparent',
        bezierCurve: false,
        scaleOverride: true,
        scaleSteps: 10,
        scaleStepWidth: 100,
        scaleStartValue: 0
    };
    new Chart(c1.getContext('2d')).Line(data1, options1);
        //@ sourceURL=pen.js
</script>
 
i want to make other charts with different values in the same website page... i already tried duplicate the codes and change id="c1" e id="p1" but nothing...

原文：https://stackoverflow.com/questions/29150278

更新时间：2023-07-29 16:07

最满意答案

 有许多可能性可以避免这个问题：在评论中已经提到了延迟或撤消增量。 JVM有很多技巧，其中一些适用：  
 
  当obj.doSomething(m_someVar)是非虚方法调用（ private或final方法，或从不重写的方法）时，它可能需要显式空检查（*），因为没有SEGV，但NPE必须在通话前被抛出。 我假设该方法没有内联，否则应该在内联后应用此分析。  
  当obj.doSomething(m_someVar)是一个虚方法调用时，你必须做“方法调度”，即像obj.getClass().getPointerToMethod("doSomething(int)") ，以确定具体方法是什么呼叫。 我写了“类似的东西”，因为这样做非常费时并且尽可能地进行优化。 如果obj恰好为null ，则此调度可以移动到增量之上，并且它本身将抛出NPE。  
  如果你很幸运，那么调度可能看起来像if (obj.getClass() != MyClass.class) uncommon_trap(); ，这是最简单的情况（称为“单态调用站点”），但即使这涉及解除引用obj ，你再次得到一个NPE为null 。  
 
 
 （*）null检查可能看起来像obj.getClass() ，它在汇编程序中是从相对于obj指针的固定偏移量加载的单个指令。 当obj == null ，会触发未映射的页面。 

There are many possibilities ho to avoid the problem: Delaying or undoing the increment was already mentioned in a comment. The JVM has a big bag of tricks and some of them applies: 
 
 When obj.doSomething(m_someVar) is a non-virtual method call (a private or final method, or a never overridden method), then it probably requires an explicit null check(*) as there would be no SEGV, but the NPE must be thrown before the call. I'm assuming the method was not inlined, as otherwise this analysis should be applied after inlining. 
 When obj.doSomething(m_someVar) is a virtual method call, then you have to do "method dispatch", i.e., something like obj.getClass().getPointerToMethod("doSomething(int)") in order to determine what concrete method to call. I wrote "something like" as doing this literally is very time-consuming and gets optimized away as much as possible. This dispatch can be moved above the increment and it itself will throw an NPE, if obj happens to be null. 
 When you're lucky, then the dispatch may look like if (obj.getClass() != MyClass.class) uncommon_trap();, which is the simplest case (called "monomorphic call site"), but even this involves dereferencing obj and you again get an NPE for null. 
 
 
(*) A null check may look like obj.getClass() which in assembler is a single instruction loading from a fixed offset relative to the obj pointer. When obj == null then an unmapped page ist hit.

在同一html页面中使用不同数据复制图表/图形(Duplicate charts/graphics with different data in the same html page)

最满意答案

相关问答

Java：死码消除(Java: Dead code elimination)[2023-10-02]

Java：检查null或允许异常处理(Java: check for null or allow exception handling)[2022-08-09]

如何编写Java以允许SSE使用和边界检查消除（或其他高级优化）？(How can I code Java to allow SSE use and bounds-check elimination (or other advanced optimizations)?)[2023-05-09]

检查是不好的做法！（x == null）(is it bad practice to check !(x == null))[2024-02-03]

Java Null检查消除可能导致错误的代码？(Java Null check elimination can cause bad code?)[2022-08-12]

Java null检查(Java null check)[2022-06-07]

检查日期范围内是否也处理空值Java的日期(Check if date between date range that also handle null values Java)[2023-10-03]

Java死去代码......这个代码有被优化掉的风险吗？(Java dead code elimination… is this code at risk of being optimized out?)[2020-01-27]

Java null检查性能(Java null check performance)[2023-04-20]

Java检查null练习(Java check for null practise)[2024-02-14]

相关文章

最新问答