Question

我正在尝试使用Dart（dartlang.org）向SVG元素添加<linearGradient>（使用大写字母G）。结果是<lineargradient>元素（小写g）浏览器（Firefox和Chromium）无法正确显示，它们需要大写字母G才能使linearGradient正常工作。

如何在不降低结果的情况下使用Dart添加html片段？
添加（SVG）片段是否有不同的功能我缺少？

到目前为止我的代码：

SvgSvgElement svg = new SvgSvgElement();

SvgElement defsElement = new SvgElement.tag('defs');
svg.append(defsElement);

var str = '''
    <linearGradient id="def_2" x1="2557" y1="5281" x2="2603" y2="5253" gradientUnits="userSpaceOnUse" spreadMethod="repeat">
    <stop offset="0" stop-color="#f32b2b" />
    <stop offset="0.75993413" stop-color="#fcc0c0" />
    <stop offset="1" stop-color="#df2323" />
    </linearGradient>
    ''';

Element element = new Element.html(
    str,
    validator: new NodeValidatorBuilder()
      ..allowElement('linearGradient', attributes: ['id', 'x1', 'y1', 'x2', 'y2', 'gradientUnits', 'spreadMethod'])
      ..allowElement('stop', attributes: ['offset', 'stop-color', 'stop-opacity'])
);

defsElement.append(element);

感谢您的帮助，
问候，
亨德里克·扬

Answer 1

经过多次试错后，我终于进行了试用并取得了成功。

似乎DocumentFragment.svg()构造函数是专门为此目的而制作的实现这一诀窍的代码是：

// make an element from the use string
DocumentFragment frag = new DocumentFragment.svg(str /*no validator here!*/);

// add to defs element
defsElement.append(frag);

Dart Element.html转换为小写（不应该）

1 个答案: