1

我在 javascript 中构建了一个文本编辑器,它将键盘书写的文本作为输入,并输出相同的段落,但每个单词的样式都根据其编写方式而定。我的文本编辑器导出一个 CSV 文件,其中每一行都是一个单词,其特定的样式值包括:字体大小、单词跟踪、两个单词之间的间距以及单词的颜色。

效果可以看这里

现在我想使用basil.js库将此 csv 文件导入 InDesign ,这样我就可以创建一个文本框,其中包含 csv 文件中的一段单词和样式。

可以在此处查看 csv 文件:

word,spacing,size,tracking,color
"Hello,",0,16,0,90
this,70,16,0.22,90
is,0,16,7,0
a,0,16,0,90
test,0,24,3.98,90
to,0,16,5.06,90
show,0,16,-1.56,90
what,42.84,16,-0.6,90
i,0,16,0,90
mean,0,16,-0.79,90

我设法导入了 csv,为每个单词创建了一个段落,并使字体大小样式适用于每个作品。但我无法使跟踪属性工作。另外,我真的不知道如何通过 basil.js 在段落中的两个单词之间创建增加的空格(在 texteditor 中它使用了左填充 css)。另外我不知道如何更改每个单词的颜色。

这可能与 basil.js 吗?

我当前的代码如下所示:

#includepath "~/Documents/;%USERPROFILE%Documents";
#include "basiljs/bundle/basil.js";


function draw(){

   b.clear(b.doc());

   //import csv file
   var data = b.CSV.decode( b.loadString("mycsv.csv"));

   //paragraph placeholder
   var paragraph = ""; 

   //parse to right data type,
   for (var i = 0; i < data.length; i++) {
     data[i].spacing = parseInt(data[i].spacing);
     data[i].size = parseInt(data[i].size);
     data[i].tracking = parseInt(data[i].tracking);
     data[i].color = parseInt(data[i].color);
     // data[i].word is already a string at it should

     //Add each word in the csv row to create a paragraph
     paragraph +=  data[i].word + " ";
  };

      //create a textframe element for the paragraph   
      var tf = b.text(paragraph, 36, 36, 500, b.height);
      var myWords = b.words(tf);

      // iterate through each word and  apply the specific styling for the
      specific word. 

      for(var i = 0; i < myWords.length; i++){  

             var size_ =  data[i].size; // font size
             var tracking_ = data[i].tracking; //word tracking
             var color_ = data[i].color;    // font color 
             var spacing_ = data[i].spacing;

            // this one works
            myWords[i].pointSize = size_; 

            //I'ld like to change tracking for each word - but this dosnt work
            myWords[i].tracking = tracking_; 

           //myWords[i].color = rgb(color_); - How can I apply a specific color to a specific word in the paragraph
           // myWords[i].word_spacing =  - I would like to increase the spacing between specific pairs of words. How can this be done?   

       }
}

b.go();
4

1 回答 1

1

追踪

我认为您的跟踪确实有效,但是您从 csv 获得的值太小而无法引起注意。合法跟踪值的范围从-100010000,因此我会将您的值乘以 100 或乘以 1000 以查看效果。

颜色

要改变一个词的颜色,你需要改变它的fillColor属性。要创建有效的 InDesign 颜色,您可以使用 basil 函数b.color(r, g, b)。所以要把一个词涂成红色,你可以这样做

myWords[i].fillColor = b.color(255, 0, 0);

字空间

要将空格更改为单词,您实际上需要定位两个单词之间的空格字符串并更改其kerningValue属性。为此,您可以使用 分隔所有字符中的文本b.characters(text),就像您已经对单词所做的那样。然后你需要遍历字符,看看它是否是一个空格,如果是,你可以改变它的字距值。

var chars = b.characters(tf);

for (var i = 0; i < chars.length; i++) {
  if(chars[i].contents === " ") {
    chars[i].kerningValue = 400;
  }
}
于 2017-09-06T18:18:38.673 回答