1

NVD3 包括十几种做图表的方法，大约是。压缩前 500KB。我想找到修剪这个文件的方法，特别是因为我们只使用折线图和条形图。

构建模块化 NVD3 库的推荐方法是什么？

4

2 回答 2

5

我已经修改了grunt 文件，注释掉了所有不需要的内容：

src: [
   'src/intro.js',
   'src/core.js',
   'src/interactiveLayer.js',
   'src/tooltip.js',
   'src/utils.js',
   'src/models/axis.js',
   // 'src/models/historicalBar.js',
   // 'src/models/bullet.js',
   // 'src/models/bulletChart.js',
   // 'src/models/cumulativeLineChart.js',
   // 'src/models/discreteBar.js',
   // 'src/models/discreteBarChart.js',
   // 'src/models/distribution.js',
   'src/models/historicalBar.js',
   // 'src/models/historicalBarChart.js',
   // 'src/models/indentedTree.js',
   'src/models/legend.js',
   'src/models/line.js',
   // 'src/models/lineChart.js',
   'src/models/linePlusBarChart.js',
   // 'src/models/lineWithFocusChart.js',
   // 'src/models/linePlusBarWithFocusChart.js',
   // 'src/models/multiBar.js',
   // 'src/models/multiBarChart.js',
   // 'src/models/multiBarHorizontal.js',
   // 'src/models/multiBarHorizontalChart.js',
   // 'src/models/multiChart.js',
   // 'src/models/ohlcBar.js',
   // 'src/models/pie.js',
   // 'src/models/pieChart.js',
   'src/models/scatter.js',
   // 'src/models/scatterChart.js',
   // 'src/models/scatterPlusLineChart.js',
   // 'src/models/sparkline.js',
   // 'src/models/sparklinePlus.js',
   // 'src/models/stackedArea.js',
   // 'src/models/stackedAreaChart.js',
   'src/outro.js'
   ]

这可行，但基于模块（browserify，AMD...）的更好的解决方案将是首选。

于 2013-10-17T09:50:10.317 回答
1

所以在 v1.8.2 更新后，gruntfile 做了一点改动。您将不再看到 js 文件列表。而不是它，你会看到'src/models/*.js',

我正在按照所选答案创建自定义构建。因此，为了创建它，我浏览了每个图表模块并注意他们正在使用的模型。后来我将这些添加js-files到concat.js.src对象中Gruntfile.js。这是最常见的 LineChart 的示例：

concat: {
    ...
    js: {
        options: {
            ...
        },
        src: [
        'src/core.js',
        'src/dom.js',
        'src/interactiveLayer.js',
        'src/tooltip.js',
        'src/utils.js',
        //Include all files in src/models
        // 'src/models/*.js',
        // example to exclude files: '!src/models/excludeMe*'
        'src/models/axis.js',
        'src/models/legend.js',
        'src/models/line.js',
        'src/models/lineChart.js',
        'src/models/scatter.js',
        ],
        ...
    }
},
于 2016-03-03T03:40:45.120 回答