Javascript 如何在DC.js图表中加载非常大的文件？

我有一个.csv文件，其中包含来自新西兰地震的数据

我有01张地图，03张图表和01张表格，上面有这些数据。除以每震级事件数、每深度事件数（km）和每小时事件数

.csv文件有15441行，并且给出了一个错误，说明超出了

最大调用堆栈大小

。这很奇怪，因为我使用DC.js和crossfilter，理论上这个库用于处理数百万数据

附件是您给出的错误图像：

如果我从这个文件中取出10000行，代码正常工作，但问题是我需要整个文件。"/

我把我的代码放在这里，因为.csv文件非常大，我无法在Stackblitz、CodePen、Plunker、JSFIDLE等上模拟它。我道歉

我正在尝试的代码如下链接所示：

Sequences.csv文件（如果可以下载）位于以下位置：

这是我的密码，谢谢你

var震级图=直流柱状图（“#柱状图”）；
var depthChart=dc.条形图（“#barDepthChart”）；
var timeChart=dc.lineChart（“#lineTimeChart”）；
var dataTable=dc.dataTable（'#myTable'）；
var markers=d3.map（）；
var markerLayer=L.layerGroup（）；
变量idDimension，idGrouping；
VarMap=L.map（'map'）.setView（[-41.05172.93]，5）；
L.tileLayer（'http://{s}.tile.osm.org/{z}/{x}/{y}.png'{
属性：“©；参与者”，
最大缩放：17
}).addTo（地图）；
map.on（'moveend'，updateFilters）；
var url='1〕https://gist.githubusercontent.com/bernalvinicius/64aa48728dc717c71906742ca2833d17/raw/5244a987b974e8352809dc16e98926e2c6889ba1/earthquakes.csv';    
d3.csv（url）。然后（函数（数据）{
data.forEach（函数（d）{
d、 dtg=d.origintime.substr（0,19）；
d、 纬度=+d纬度；
d、 长=+d.经度；
d、 mag=d3.精度圆（+d.震级，1）；
d、 深度=d3.精密圆形（+d.深度，0）；
变量大小=d.mag*10000；
变量圆=L圆（[d.lat，d.long]，d.mag*5000{
颜色：“#fd8d3c”，
体重：2，
填充颜色：“#fecc5c”，
填充不透明度：0.5
});
圆圈（“幅值：+d.mag+”
时间：+d.dtg）；
circle.publicid=d.publicid；
标记集（d.publicid，圆圈）；
});
控制台日志（数据）；
var myCrossfilter=交叉过滤器（数据）；
idDimension=myCrossfilter.dimension（函数（d）{
返回d.publicid；
});
idGrouping=idDimension.group（函数（id）{
返回id；
});
var dateDimension=myCrossfilter.dimension（函数（d）{
返回d.dtg；
});
var magdimmension=myCrossfilter.dimension（函数（d）{
返回d.mag；
});
var magDimensionCount=magDimension.group（）；
var depthDimension=myCrossfilter.dimension（函数（d）{
返回d.depth；
});
var depthDimensionCount=depthDimension.group（）；
var hourDimension=myCrossfilter.dimension（函数d）{
返回d3时间小时（d.dtg）；
});
var hourDimensionCount=hourDimension.group（）；
震级图
.宽度（480）
.身高（150）
.margins（{顶部：10，右侧：10，底部：20，左侧：40}）
.尺寸（magDimension）
.组（磁计数）
.过渡期（500）
.centerBar（正确）
.gap（56）
.x（d3.scaleLinear（）.domain（[0,8]））
.弹性（真实）
.on（“过滤”，功能（图表，过滤器）{
updateMarkers（）；
});
深度图
.宽度（600）
.身高（150）
.margins（{顶部：10，右侧：10，底部：20，左侧：40}）
.尺寸（深度尺寸）
.组（深度维度计数）
.过渡期（500）
.centerBar（正确）
.差距（1）
.x（d3.scaleLinear（）.domain（[01100]））
.弹性（真实）
.on（“过滤”，功能（图表，过滤器）{
updateMarkers（）；
});
时间图表。宽度（960）
.身高（150）
.过渡期（500）
.margins（{顶部：10，右侧：10，底部：20，左侧：40}）
.尺寸（小时尺寸）
.组（小时维度计数）
.brushOn（错）
.弹性（真实）
.x（d3.scaleTime（）.domain（d3.extent（数据，函数（d）{return d.dtg；}））；
数据表
.宽度（960）
.高度（800）
.dimension（日期维度）
.小组（职能（d）{
返回“地震表”；
})
.尺寸（10）
.栏目([
函数（d）{return d.dtg；}，
函数（d）{return d.mag；}，
函数（d）{返回d.depth；}，
函数（d）{返回d.lat；}，
函数（d）{返回d.long；}]）
.sortBy（函数（d）{return d.dtg；}）
.顺序（d3.升序）；
dc.renderAll（）；
updateMarkers（）；
});
函数updateMarkers（）{
var id=idGrouping.all（）；
var todisplay=新数组（ids.length）；
var-mc=0；
对于（变量i=0；i0）{
todisplay[mc]=markers.get（tId.key）；
mc=mc+1；
}
}
todisplay.length=mc；
markerLayer.clearLayers（）；
if（map.hasLayer（markerLayer））{
地图移除层（markerLayer）；
}
markerLayer=L.layerGroup（todisplay）.addTo（map）；
}
函数updateFilters（）{
var id=idGrouping.all（）；
var visibleMarkers=新数组（id.length）；
var-cout=0；
markerLayer.eachLayer（函数（层）{
if（map.getBounds（）.contains（layer.getLatLng（）））{
visibleMarkers[cout]=layer.publicid；
cout++；
}
});
markerLayer.length=cout；
idDimension.filterFunction（函数（d）{
返回visibleMarkers.indexOf（d）>-1；
});
dc.redrawAll（）；
}

#地图{
宽度：650px；
高度：450px；
}
地震数据