我写了这段代码,其中包含一个多行字符串的文件(字符串var),每行包含许多用tab分隔的字段。 似乎javascript无法将行和字段分开>>当我试图打印字段时没有出现
怎么了?
<!DOCTYPE html>
<html lang="en">
<head>
<meta content="text/html; charset=windows-1252" http-equiv="content-type">
<script src="Scribl.min.js"></script>
<script>
function draw(canvasName) {
// Get Canvas and Create Chart
var canvas = document.getElementById(canvasName);
// Create Chart
chart = new Scribl(canvas, 500);
var file = '##gff-version 3 \n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD gene 61571 62909 . + . ID=Aspfo1_0027407;Note=Protein of unknown function\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD mRNA 61571 62909 . + . ID=Aspfo1_0027407-T;Parent=Aspfo1_0027407;Note=Protein of unknown function\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD exon 61571 61698 . + . ID=Aspfo1_0027407-T-E1;Parent=Aspfo1_0027407-T\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD exon 61801 61858 . + . ID=Aspfo1_0027407-T-E2;Parent=Aspfo1_0027407-T\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD exon 62049 62909 . + . ID=Aspfo1_0027407-T-E3;Parent=Aspfo1_0027407-T\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD CDS 61571 61698 . + 0 ID=Aspfo1_0027407-P;Parent=Aspfo1_0027407-T;parent_feature_type=ORF\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD CDS 61801 61858 . + 0 ID=Aspfo1_0027407-P;Parent=Aspfo1_0027407-T;parent_feature_type=ORF\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD CDS 62049 62909 . + 2 ID=Aspfo1_0027407-P;Parent=Aspfo1_0027407-T;parent_feature_type=ORF\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD gene 192322 193023 . - . ID=Aspfo1_0027447;Note=Protein of unknown function\n'+
'scaffold_1_A_acidus_CBS_106_47 AspGD mRNA 192322 193023 . - . ID=Aspfo1_0027447-T;Parent=Aspfo1_0027447;Note=Protein of unknown function\n';
document.getElementById("demo").innerHTML=file;
//gff3(file,chart);
var lines = file.split("\n"); // array has the file lines, each lin has a feature >> we can pars each line now to extraxt the needed info
var features = [];
var max = undefined;
var min = undefined;
var version = undefined;
// parse genes
numFeatures = lines.length
for( var j=0; j < numFeatures; j++ ) {
if( lines[j] == "" ) break;
if( lines[j] == "##" ) continue;
// if it start of ## means extra info that provide meta-information about the document as a whole doc such as version //pragmas or meta-data
var fields = lines[j].split(" ");//tab-delimited : parsers must split on tabs, not spaces.
//Fields are: <seqname/id> <source> <feature/type> <start> <end> <score> <strand> <frame> [attributes] [comments]
if( fields[2] != "gene" ) continue;
if (type == "gene"){// it is gene so draw it // else it is exone itron etc
var seqid = fields[0];
var source = fields[1];
var type = fields[2];
var start = parseInt(fields[3]);
var end = parseInt(fields[4]);
var score = fields[5];
var strand = fields[6];
var phase = fields[7];
var attributes = fields[8].split(";");
var geneID = attributes[0];
var GeneNama = attributes[1];
chart.addGene( start , end, strand);
}
}
// Draw Chart
chart.draw();
// Create image of chart1
var img = chart.canvas.toDataURL("image/png");
// Add link to download image
//document.getElementById('export').href = img;
}
</script>
</head>
<body onload="draw('canvas')"> <canvas id="canvas" width="750" height="330"></canvas>
<p id="demo">hi</p>
</body>
</html>
答案 0 :(得分:1)
空白崩溃。但是添加这个CSS:
#demo {white-space:pre-wrap}
和魔术! :d
答案 1 :(得分:0)
这些不是标签,但将var fields = lines[j].split(" ");
更改为var fields = lines[j].split(/\s+/);
应该可以解决问题。