使用 jQuery 的艺术字样式文本效果答案

【问题标题】：WordArt Style Text effects using jQuery使用 jQuery 的艺术字样式文本效果
【发布时间】：2015-03-16 19:58:06
【问题描述】：

我正在使用 jQuery 开发一个自定义设计工具，类似于 http://www.design.neato.com/Designer.aspx?PaperId=2001 提供的工具

我的要求是使用 jQuery 为 Text 提供各种效果（类似于 Microsoft Word 中的 Wordart）。我找到了一个库 fabric.js，但它不能满足我的要求。输入文本后，我需要应用各种样式以及放置在表单上的控件的半径。是否有任何库可以帮助我实现上述功能？有人可以推荐吗？

【问题讨论】：

标签： jquery fabricjs

【解决方案1】：

看看这个：http://jsfiddle.net/e8hZy/146/

更多演示在这里：http://fabricjs.com/demos/

更多有关fabric.js文字效果的信息，请阅读：http://fabricjs.com/fabric-intro-part-2/#text

样品：

var shadowText1 = new fabric.Text("I'm a text with shadow", {
  shadow: 'rgba(0,0,0,0.3) 5px 5px 5px'
});
var shadowText2 = new fabric.Text("And another shadow", {
  shadow: 'rgba(0,0,0,0.2) 0 0 5px'
});
var shadowText3 = new fabric.Text("Lorem ipsum dolor sit", {
  shadow: 'green -5px -5px 3px'
});
var italicText = new fabric.Text("A very fancy italic text", {
  fontStyle: 'italic',
  fontFamily: 'Delicious'
});
var anotherItalicText = new fabric.Text("another italic text", {
  fontStyle: 'italic',
  fontFamily: 'Hoefler Text'
});
var textWithStroke = new fabric.Text("Text with a stroke", {
  stroke: '#ff1318',
  strokeWidth: 1
});
var loremIpsumDolor = new fabric.Text("Lorem ipsum dolor", {
  fontFamily: 'Impact',
  stroke: '#c3bfbf',
  strokeWidth: 3
});

希望对你有所帮助。

【讨论】：