ember-nf-graph是EmberJS的可组合图形组件库。ember-nf-graph是一个基于组件的DSL，可以在Ember应用中创建图形。
基础代码示例：
export default Ember.Route.extend({ model() { return { myLineData: [ { x: 0, y: 12 }, { x: 1, y: 32 }, { x: 2, y: 42 }, // ... ], myAreaData: [ { x: 0, y: 43 }, { x: 1, y: 54 }, { x: 2, y: 13 }, // ... ] }; }});{{#nf-graph width=500 height=300}} {{#nf-graph-content}} <!-- add a line --> {{nf-line data=model.myLineData}} <!-- add an area --> {{nf-area data=model.myAreaData}} <!-- mix in any SVG element you want --> <circle cx="40" cy="40" r="10"></circle> {{/nf-graph-content}} <!-- axis ticks are templateable as well --> {{#nf-y-axis as |tick|}} <text>{{tick.value}}</text> {{/nf-y-axis}} {{#nf-x-axis as |tick|}} <text>{{tick.value}}</text> {{/nf-x-axis}}{{/nf-graph}}
评论