これは正規表現に関する質問です。
助けてくれてありがとう。正規表現は間違いなく私の強みではないので、しばらくお待ちください!
完全に背景として...質問する理由は、RegExを使用してSVGパスデータセグメントに似た文字列を解析したいからです。セグメントとそのセグメント属性の両方を解析する以前の回答を探しましたが、後者を適切に処理するものは見つかりませんでした。
解析する必要がある文字列の例を次に示します。
M-11.11,-22
L.33-44
ac55 66
h77
M88 .99
Z
次のように、文字列を配列に解析する必要があります。
["M", -11.11, -22]
["L", .33, -44]
["ac", 55, 66]
["h", 77]
["M", 88, .99]
["Z"]
これまでのところ、この回答でこのコードを見つけました: Parsing SVG "path" elements with C# - are there libraries out there to do this? 投稿はC#ですが、正規表現はjavascriptで役立ちました:
var argsRX = /[\s,]|(?=-)/;
var args = segment.split(argsRX);
これが私が得るものです:
[ "M", -11.11, -22, <empty element> ]
[ "L.33", -44, <empty>, <empty> ]
[ "ac55", <empty>, <empty>, <empty>, 66 <empty> ]
[ "h77", <empty>, <empty>
[ "M88", .99, <empty>, <empty> ]
[ "Z", <empty> ]
この正規表現を使用する際の問題:
- 不要な空の配列要素が、各文字列の配列の最後に配置されています。
- 複数のスペースが区切り文字である場合、余分なスペースごとに不要な空の配列要素が作成されます。
- 開始文字の直後に数字が続く場合、その数字は文字に付加されますが、別の配列要素になる必要があります。
着信文字列のより完全な定義を次に示します。
- 各文字列は 1 つ以上の文字 (大文字と小文字が混在) で始まります。
- 次はゼロ以上の数字です。
- 数値にはマイナス記号が含まれる場合があります (常に先行します)。
- 数値には、数値のどこかに小数点がある場合があります (末尾を除く)。
- 可能な区切り文字は、コンマ、スペース、スペース、マイナス記号です。
- 前後にスペースを含むコンマも区切り文字として使用できます。
- マイナス記号はデリミタですが、番号と共に残す必要があります。
- 開始文字の直後に数字が続く場合があり (スペースなし)、その数字は分離する必要があります。
これが私が使用しているテストコードです:
<!doctype html>
<html>
<head>
<link rel="stylesheet" type="text/css" media="all" href="css/reset.css" /> <!-- reset css -->
<script type="text/javascript" src="http://code.jquery.com/jquery.min.js"></script>
<style>
body{ background-color: ivory; }
</style>
<script>
$(function(){
var pathData = "M-11.11,-22 L.33-44 ac55 66 h77 M88 .99 Z"
// separate pathData into segments
var segmentRX = /[a-z]+[^a-z]*/ig;
var segments = pathData.match(segmentRX);
for(var i=0;i<segments.length;i++){
var segment=segments[i];
//console.log(segment);
var argsRX = /[\s,]|(?=-)/;
var args = segment.split(argsRX);
for(var j=0;j<args.length;j++){
var arg=args[j];
console.log(arg.length+": "+arg);
}
}
}); // end $(function(){});
</script>
</head>
<body>
</body>
</html>