Question

我几天来一直在努力解决这个问题。我试图找到这样做的方法，我想改变代码，所以它有一个＆＃34;包装＆＃34;函数并将字符串作为输入进行解析，以便它可以更改。例如。

var call = function(year)
  ($.get('Veidilands.csv', function(data) {
            // Split the lines
            var lines = data.split('\n');

            $.each(lines, function(lineNo, line) {
                var items = line.split(';');

              //Declare the year, search for entries only for that year
                var STRINGTOPARSEWITH = line.indexOf(year);    


                // header line containes categories
                if (lineNo == 0) {
                    $.each(items, function(itemNo, item) {
                        if (itemNo > 1) options.xAxis.categories.push(item);

                    });
                }

                // the rest of the lines contain data with their name in the first position
                else if(lineNo != 0 && STRINGTOPARSEWITH == 0  )  {

会变成

($.get('Veidilands.csv', function(data) {
            // Split the lines
            var lines = data.split('\n');

            $.each(lines, function(lineNo, line) {
                var items = line.split(';');

                var STRINGTOPARSEWITH = line.indexOf('2000');    




                // header line containes categories
                if (lineNo == 0) {
                    $.each(items, function(itemNo, item) {
                        if (itemNo > 1) options.xAxis.categories.push(item);

                    });
                }

                // the rest of the lines contain data with their name in the first position
                else if(lineNo != 0 && STRINGTOPARSEWITH == 0

除此之外，我将如何将其实现到html文件中。我现在有很多图表输出到同一个容器但是这一年只有这个微小的差异而且我重复使用了很多我认为可以更好地使用的代码。如果只是在点击时更改年份字符串的某种功能会更好吗？处理此问题的最佳方法是什么，我该怎么做。非常感谢你提前。

以下是我的代码http://jsfiddle.net/9Anu8/的链接。正如您所看到的，重用如此多的代码会变得非常笨重和低效。我非常感谢您提供的任何提示。

Answer 1

好的只是跟进我的评论。（这绝对不是一个完整的答案，而是指向正确的方向）。例如，您可以使用这样的函数：

function display_chart_options(main_title,yaxis_title) {
    return {
        chart: {
            renderTo: 'container'
            /*type: ''*/
        },
        title: {
            text: main_title
        },
        xAxis: {
            categories: []
        },
        yAxis: {
            title: {
                text: yaxis_title
            },
            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        legend: {

            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            y: 15,
            borderWidth: 0,
            itemStyle: {

               color: '#333',
               fontSize: '15px',

            },
            navigation: {
            activeColor: '#3E576F',
            animation: true,
            arrowSize: 12,
            inactiveColor: '#CCC',

            style: {
               fontWeight: 'bold',
               color: '#333',
               fontSize: '15px',

            }
         }
        },
        tooltip: {
            shared: true,
            crosshairs: true
        },

        plotOptions: {
            series: {

                marker: {
                    lineWidth: 1
                }
            }
        },
        series: []

    };
}

然后在你的点击处理程序中：

$( "#klikk1" ).click(function() {
    var options = display_chart_options('Veiði','Fjöldi');
    $.get('prof4.csv', function(data) {
        // Split the lines
        var lines = data.split('\n');
        $.each(lines, function(lineNo, line) {
            var items = line.split(';');


            // header line containes categories
            if (lineNo == 0) {
                $.each(items, function(itemNo, item) {
                    if (itemNo > 0) options.xAxis.categories.push(item);

                });
            }

            // the rest of the lines contain data with their name in the first position
            else if(lineNo != 0 && items != null )  {
                var series = { 
                    data: [],
                    visible:false,
                   /* type: 'line'*/

                }
                $.each(items, function(itemNo, item) {
                    if (itemNo == 0) {
                        series.name = item;     
                    }
                    else if(itemNo !=0)  {
                        series.data.push({
                            y: parseFloat(item),

                        });
                    }


                });


                options.series.push(series);

            }

        });

        var chart = new Highcharts.Chart(options);
    });
});

通过更改解析字符串，在同一页面上多次重用高级图表

1 个答案: