小编Chr*_*ris的帖子

我有一个参考图像,我想用SVG实现的效果.

在Photoshop中,可以通过使用100%不透明度并将混合模式设置为"倍增"来实现效果

颜色的十六进制值为:

红色:#EA312F,蓝色:#3A5BA6和重叠区域:#35111F

我已经尝试了许多使用SVG滤镜来实现类似效果的方法,但我很难理解混合模式如何计算值.

1. 原始Photoshop位图
2. SVG仅使用形状没有过滤器
3. SVG在垂直条上使用乘法滤波器
4. SVG在垂直条上使用乘法滤镜和不透明度

您可以在此JSBin http://jsbin.com/iPePuvoD/1/edit中查看每个SVG代码

我真的很难理解匹配垂直条蓝色和重叠区域颜色的最佳方法.

这些形状的每一个我也想利用动画库,如http://snapsvg.io/,所以我希望能单纯依靠过滤器,而不是裁剪或其它操作,以达到预期的效果-但我愿意接受建议.

实际上,最终尝试的SVG(4.)是这样的:

<svg viewBox="0 0 96 146" version="1.1" id="f-multiply-opacity" preserveAspectRatio="xMinYMin meet">
  <defs>
    <filter id="f_multiply" filterUnits="objectBoundingBox" x="0%" y="0%" width="100%" height="100%">
      <feBlend in="SourceGraphic" mode="multiply"/>
      <feBlend in="SourceGraphic" mode="multiply"/>
    </filter>
  </defs>
  <g id="f_shape">
    <rect x="0" y="0" width="96" height="32" fill="#EA312F" />
    <rect x="0" y="50" width="96" height="32" fill="#EA312F" />
    <rect x="0" y="50" width="32" height="96" opacity="0.8" fill="#3A5BA6" filter="url(#f_multiply)" />
  </g>
</svg>

非常感谢有关这方面的一些建议,我已经在SVG上找到了一些很好的资源,但是这个领域似乎仍然很难获得好的信息.

谢谢!

我正在尝试使用记录的model.reload()函数轮询更多数据

App.ModelViewRoute = Ember.Route.extend({
  actions: {
    reload: function() {
      this.get('model').reload();
    }
  }
});

但是我收到一条错误消息说......

undefined is not a function TypeError: undefined is not a function

有没有更好的方法来做到这一点,似乎我无法以这种方式从路线访问模型？

这是路由器

App.Router.map(function() {
  this.route('video', { path: '/videos/:video_id' });
});

这是路线

App.VideoRoute = Ember.Route.extend({
  model: function(params) {
    return this.store.find('video', params.video_id);
  },

  actions: {
    reloadModel: function() {
      // PROBLEM HERE
      // this.get('model').reload();
      Ember.Logger.log('reload called!');
    }
  }
});

这是模型

App.Video = DS.Model.extend({
   title: DS.attr('string'),
   status: DS.attr('string')
});

和模板

<script type="text/x-handlebars" data-template-name="application">
  <h1>Testing model reloading</h1>
  {{#link-to "video" 1}}view …

我正在尝试在Rails项目中使用Paperclip gem,因此遵循文档并首先使用Homebrew配方安装Imagemagick.

我在我的模型中添加了我的附件

has_attached_file :screenshot

这工作正常,文件上传按预期运行

然后我想为此添加缩略图,所以再次按照文档添加到模型中

  has_attached_file :screenshot, 
                :styles => { :medium => "300x300>",
                             :thumb => "100x100>" }

此时上传不再有效

我查看了开发日志并注意到了这一点:

[32mCommand[0m :: identify -format %wx%h '/var/folders/ky/r5gsdhbn6yggbglsg727cc900000gn/T/stream20120302-60051-eh17n7.png[0]'
[paperclip] An error was received while processing: #<Paperclip::NotIdentifiedByImageMagickError:     
/var/folders/ky/r5gsdhbn6yggbglsg727cc900000gn/T/stream20120302-60051-eh17n7.png is not recognized by the 'identify' command.>

在一些谷歌搜索之后,我认为将默认路径设置为环境变量可能是个问题

Paperclip.options[:command_path] = "/usr/local/bin/"

但我检查了这是正确的使用

which identify

它回归了这条道路

/usr/local/bin/identify

正如所料

然后我尝试从命令行运行识别作为测试并得到此错误

dyld: Library not loaded: /usr/X11/lib/libfreetype.6.dylib
  Referenced from: /usr/local/bin/identify
  Reason: Incompatible library version: identify requires version 14.0.0 or later, but libfreetype.6.dylib provides version 13.0.0
Trace/BPT trap: 5 …

我正努力在Ember控制器中链接承诺.

为了说明我在这里就JSBIN问题做了一个例子

此处还包括Ember代码:

App.IndexController = Ember.Controller.extend({
  result_of_request: 'nothing',

  first_request: function() {

    // create a promise which is immediately resolved
    var promise = new Ember.RSVP.Promise(function(resolve, reject){
      resolve("first resolved");
    });

    // once the promise has resolved it should call the next function?
    promise.then(function(data) {
      // does log the data (has resolved)...
      console.log("data is : " + data);

      // but neither this
      this.set("result_of_request", "first");

      // nor this work
      second_request();
    }); 
  }.property(),

   second_request: function() {
    console.log("second request");
  }.property()

});

任何意见,将不胜感激.

我觉得我已经很接近了，但遇到了困难，所以希望得到一些建议。

我的目标是能够使用 Chrome 运行我的系统测试并（截取屏幕截图）。

非 JS 测试通过使用:rack_test.

当由（我的 Chrome 设置）驱动时，我可以访问一条路径，截取显示此站点无法到达127.0.0.1 拒绝连接的:remote_browser屏幕截图。

version: \'3\'\n\nservices:\n\n  app: &app\n    build: .\n    tmpfs:\n      - /tmp\n\n  backend: &backend\n    <<: *app\n    stdin_open: true\n    tty: true\n    volumes:\n      - .:/usr/src/app:cached\n      - rails_cache:/usr/src/app/tmp/cache\n      - bundle:/usr/local/bundle\n      - node_modules:/app/node_modules\n      - packs:/app/public/packs\n    env_file:\n      - .env/development/database\n      - .env/development/web\n    environment:\n …