Question

我想在JS Heat地图中显示数据，如下所示：

这是我收到的两种不同类型的数据：

我得到的数据如下：

public function index() {

        $regions = DB::table('locations')
            ->select('regionCode', DB::raw('count(id) as total'))
            ->groupBy('regionCode')
            ->get();

        $newRegions = [];

        foreach( $regions as $region ){
            $newRegions[$region->regionCode] = $region->total;
        }

        return view('admin.dashboard-v2', compact('newRegions'));
}

这就是我支持显示它的方式：

var map = AmCharts.makeChart( "chartdiv", {
  type: "map",
  "theme": "light",

  colorSteps: 10,

  dataProvider: {
    map: "usaLow",
    areas: [ {
      id: "US-AL",
      value: 4447100
    }, {
      id: "US-AK",
      value: 626932
    }, {
      id: "US-AZ",
      value: 5130632
    }, {
      id: "US-AR",
      value: 2673400
    }, {
      id: "US-CA",
      value: 33871648
    },.... and so on

我无法像上面那样显示它：如何将数据从数组显示到ChartJS脚本的'areas'部分？

我尝试了这个，但它不起作用：

areas: [ {
                    id: "US-{!! json_encode(array_keys($newRegions)) !!}",
                    value: {!! json_encode(array_values($newRegions)) !!}
                } ]

Answer 1

是一个非常常见的问题，将数据结构转换为特定的实现。 phpleague有很多很酷的套餐来帮助你解决这个问题。我最喜欢的一个是 http://fractal.thephpleague.com/

但是，我想向您展示如何将数组转换为所需结构

1）获取您需要转换的数据数组（您在上一张图片中显示的数据）

array:15[
0 => regioncode:"AL"
     total: 16]
]...

2）使用array_map函数

转换数组

 //http://php.net/manual/en/function.array-map.php  
  $transformedarray = array_map(function ($loopdata) { 

                    return [
                        "id" => "US-".$loopdata['regionCode'],
                        "value" => $loopdata['value']                    

                    ];

                }, $regions->toArray());

3） var_dump（$ transformedarray）o使用laravel responde返回此数组，以检查所需的结构是否与您需要的结构匹配。

4）使用此方法将此变量（数组）传递给视图

return view('admin.dashboard-v2')->with(['newarray' => $transformedarray]);

5）如果您正在使用BLADE，请尝试使用控制结构来循环数据 https://laravel.com/docs/5.0/templates

将此代码片段插入您需要在视图中填充数据的位置

areas: [ 
       @foreach ($newarray as $newarr)
    {
    id:{{ $newarr->id }},
    value:{{ $newarr->value }}
    },
       @endforeach

 ]

希望这有帮助

Answer 2

这就是我的做法：

$heatMap = DB::table('locations')
            ->select('regionCode', DB::raw('count(id) as total'))
            ->groupBy('regionCode')
            ->get();

$newHeatMap = [];


foreach( $heatMap as $regionH ){
   $newHeatMap[] = [ 'id' => 'US-' . $regionH->regionCode, 'value' => $regionH->total ];
}

return view('admin.dashboard-v2', compact('newHeatMap'));

然后在我的图表JS中

dataProvider: {
       map: "usaLow",
       areas:  {!! json_encode(array_values($newHeatMap)) !!}
},

如何在美国热图中显示数据 - Javascript - Laravel 5

2 个答案: