質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.77%

文ごとにハイライトが出来ない

解決済

回答 1

投稿

  • 評価
  • クリップ 1
  • VIEW 491

syen2501

score 38

文ごとにハイライトを行うプログラムを書いているのですが、
どうしても、最初の文だけがハイライトで表示され、しかも間違った部分をハイライトしてしまいます。
原因が分からないので、少しでも教えて頂けると幸いです。
※JSONファイルの「=>」の右側を取得し、ハイライトするプログラムを下記に記載しています。
dependencyRelationListとCountは今回は使っていませんので、空が入ります。

<実行結果>
イメージ説明
※結果としては、「初期 と (初期 の二つをハイライトしたい。

'use strict';
import * as vscode from 'vscode';
import * as fs from 'fs';


export function activate(context: vscode.ExtensionContext) {
    console.log('Congratulations, your extension "semieditor" is now active!');

    const readsemiJson = JSON.parse(fs.readFileSync('C:\\Users\\specification\\src\\sample.json','utf8'));

    context.subscriptions.push(vscode.commands.registerCommand('extension.color', () => {
        vscode.window.showInformationMessage("Color Range Word");
        // 特定の単語に色付け
        const timeWordList = readsemiJson.時間;


        const timeWords: vscode.DecorationOptions[] = [];
        const dependencyRelationWords: vscode.DecorationOptions[] = [];

        var timeCount = 0;

        //child -> parent(値域) semiについて
        function fromObjecttoRange(WordList: any,foundWordList: vscode.DecorationOptions[],dependencyRelationList: vscode.DecorationOptions[],Count: number){
            const activeEditor = vscode.window.activeTextEditor;
            const text = activeEditor.document.getText(); //ドキュメント取得

            // // 取得したテキストを改行ごと(文章)に分割する
            // const sentence = text.match(/[^\r\n]*(\r\n|\r|\n|$)/g);
            var textArray = text.split(/\r\n|\r|\n/);

            if(WordList === timeWordList){
                for(var i = 0; i < readsemiJson['時間'].length; i++){
                    console.log(readsemiJson['時間'][i]);
                    const word = readsemiJson['時間'][i].split('=>');
                    // const parentword = word[0];
                    const rangeword = word[1];
                    for(var j = 0; j < textArray.length; j++){
                        console.log(textArray[j]);
                        if(textArray[j].indexOf(rangeword)){
                            const startPos = activeEditor.document.positionAt(textArray[j].indexOf(rangeword));
                            const endPos = activeEditor.document.positionAt(textArray[j].indexOf(rangeword) + rangeword.length);
                            // console.log(startPos, endPos);
                            const decoration = { range: new vscode.Range(startPos, endPos) };
                            foundWordList.push(decoration);
                        }
                    }
                }
                return {foundWordList,dependencyRelationList,Count};
            }
        }
        function decorateWord() {
            const activeEditor = vscode.window.activeTextEditor;
            // const text = activeEditor.document.getText(); //ドキュメント取得

            //時間
            fromObjecttoRange(timeWordList,timeWords,dependencyRelationWords,timeCount);

            activeEditor.setDecorations(timeMarkerDecoration,timeWords);
        }
        decorateWord();
    }));

        //時間に色付け
        const timeMarkerDecoration = vscode.window.createTextEditorDecorationType({
            'borderWidth': '1px',
            'borderRadius': '2px',
            'borderStyle': 'solid',
            // 'backgroundColor': 'rgba(255, 0, 0, 0.3)',
            'backgroundColor': 'rgba(128, 128, 0, 0.3)',
            // 'color':'red'
            'color':'orange'
        });
}    
{
    "時間": [
        "なし=>(初期",
        "なし=>「初期"
    ]
}
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

0

このへんを参考にすると

Positionインスタンス生成時に渡す数値は、行・桁関係ない先頭からの文字数のようです。

とあり、提示のロジックでは、改行で分割したあと、その行内ポジションでrangeを作っているので、例えばどこかの行の先頭に「初期や(初期があると、最初の行の先頭の#に色がつくのではないでしょうか?

対策としては、テキストの先頭からのオフセットを保持し、jのforループの最後で現在の行の長さをオフセットに加算、次の行に進んだときのstartPos endPosを求めるときにオフセットを組み込むとよいのではないかと想像します。
またこのさい、改行文字そのもの(\rや\n、\r\n)が何文字とカウントされるかによって、オフセットをtextArray[j]のlengthより1または2文字増やす必要があるかもしれないと思います。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2019/04/11 10:57

    回答ありがとうございます。
    ちなみになのですが、テキストの先頭からのオフセットを保持というのはどうやってやるんでしょうか?
    文を読み込む際に、文の長さを変数で保持しfor文でループする際に加算するということで良いのでしょうか?

    キャンセル

  • 2019/04/11 11:05

    それでいいと思います。
    iのforのはじめあたりで、ゼロで初期化して、startPos=offSet+indexOfの値、としておいてjのループの最後でlengthを足す、感じかと。

    キャンセル

  • 2019/04/11 12:33

    回答ありがとうございます。
    textArrayで改行で分割した後だと改行が記載されなくなるので改行での判定が出来ないのですが、
    分割する前で判定を行うしかないのでしょうか?

    キャンセル

  • 2019/04/15 22:58

    var textArray = text.split(/(\r\n|\r|\n)/);
    ↑のところで、正規表現に()を含めると、splitに使った改行コードをtextArrayに含めることができます。例えばこの場合
    > textArray = ["●#電源…判定する", "\r\n", ...];
    のようになります(splitなので、偶数番目(インデクスが奇数の場所)に、正規表現でマッチした()で囲まれた部分が入ります)
    なので、かなりイヤーなコードになってしまいますが、処理をかならず2個ずつ操作していけば、分割後の判定も可能になります
    ```
    //for(var j = 0; j < textArray.length; j++){
    for(var j = 0; j < textArray.length; j+=2){ //2個ずつやる。でtextArray[j]が本文テキストで、textArray[j+1]が改行コード。そのlengthをオフセットに加算する
    ```

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.77%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る