将两个 javascripts 合并为一个 foreach

merge two javascripts into one foreach

我的 laravel blade 视图中有 javascript。我想知道我是否可以将这两个脚本合并为一个。 每个 bootstrap 选项卡中的脚本显示图表。

首先是脚本:

var chart1 = AmCharts.makeChart( "chart_visits", {
        "dataProvider": [
            @foreach($results as $result)
                {
                    "date": "{{ date('Y-m-d', strtotime($result->time)) }}",
                    "value": '{{ $result->stats->visits }}'
                },
            @endforeach
        ]
    } );

第二个脚本:

var chart1 = AmCharts.makeChart( "chart_visits", {
        "dataProvider": [
            @foreach($results as $result)
                {
                    "date": "{{ date('Y-m-d', strtotime($result->time)) }}",
                    "value": '{{ $result->stats->bounceRate }}'
                },
            @endforeach
        ]
    } );

这是我的观点:

<ul class="nav nav-tabs">
    <li>
        <a href="#bounce" data-toggle="tab"> Bounce rate </a>
    </li>
    <li class="active">
        <a href="#visits" data-toggle="tab"> Visits </a>
    </li>
</ul>

.

<div class="tab-content">
    <div class="tab-pane active" id="visits">
        <div class="chartdiv" id="chart_visits"></div>
    </div>

    <div class="tab-pane" id="bounce">
        <div class="chartdiv" id="chart_bounce"></div>
    </div>
</div>

如果我理解正确的话,最简单的方法就是从对象集合创建普通数组并对其进行迭代。类似于:

var chart1 = AmCharts.makeChart( "chart_visits", {
    "dataProvider": [
        @foreach($results as $result)
        {
            "date": "{{ date('Y-m-d', strtotime($result['date'])) }}",
            "value": "{{ $result['value'] }}"
        },
        @endforeach
    ]
} );

正确答案是jquery函数extend

两个都一样的脚本,我不想干:

var config = {
            "type": "serial",
            "theme": "light",
            "marginRight": 40,
            "marginTop": 60,
            "marginLeft": 40,
            "autoMarginOffset": 0,
            "dataDateFormat": "YYYY-MM-DD",
        };

将在两个脚本中扩展重复值的第一个脚本:

AmCharts.makeChart( "chart_leads", jQuery.extend({}, config, {
            "dataProvider": [
                    @foreach($results as $result)
                {
                    "date": "{{ date('Y-m-d', strtotime($result->time)) }}",
                    "value": '{{ $result->stats->leads }}'
                },
                @endforeach
            ]
        } ));

将在两个脚本中扩展重复值的第二个脚本:

AmCharts.makeChart( "chart_visits", jQuery.extend({}, config, {
            "dataProvider": [
                    @foreach($results as $result)
                {
                    "date": "{{ date('Y-m-d', strtotime($result->time)) }}",
                    "value": '{{ $result->stats->visits }}'
                },
                @endforeach
            ]
        } ));