小编Mat*_*ood的帖子

将复杂的svg形状转换为圆形抽象

SVG很丑,请查看我的:

JSFIDDLE LINK

HTML:

<svg version="1.1" class="overlap-svg" id="alaska"></svg>
<svg version="1.1" class="overlap-svg" id="grid"></svg>
Run Code Online (Sandbox Code Playgroud)

CSS:

.overlap-svg {
    position: absolute;
    left:0;
    top: 0;
}
Run Code Online (Sandbox Code Playgroud)

题:

如果我们重叠这两个svgs,JS的功能是什么才能突出显示其中包含阿拉斯加(红色)部分的svg圈?

有关详细信息,请查看以下说明


  1. 假设你的形状像阿拉斯加的轮廓一样复杂.

在此输入图像描述

  1. 让我们说你有另一个圈子的svg:

在此输入图像描述


我该如何改变这个:

在此输入图像描述

进入这样的事情:

在此输入图像描述

如果阿拉斯加(红色)的任何部分位于圆圈区域内,则圆圈应填充为红色.

请再次查看我上面的JSFiddle链接.

html javascript css svg

11
推荐指数
1
解决办法
350
查看次数

Jenkin的构建在npm install上失败了

我正在建立一个拥有jenkins for CI的ubuntu服务器.

当我尝试运行构建时,我会失败

问题: 如何npm install从我的詹金斯工作中完成工作?

构建1:

[morningharwood] $ /bin/sh -xe /tmp/hudson8925730298288495807.sh
+ pwd
/var/lib/jenkins/workspace/morningharwood
+ ls
bower.json
client
e2e
Gruntfile.js
karma.conf.js
package.json
protractor.conf.js
server
+ npm install
/tmp/hudson8925730298288495807.sh: 5: /tmp/hudson8925730298288495807.sh: npm: not found
Build step 'Execute shell' marked build as failure
Finished: FAILURE
Run Code Online (Sandbox Code Playgroud)

詹金建立 在此输入图像描述

更新:

~$ pwd
/home/ubuntu

ls -a


.   .bash_history  .bashrc  .config    .gem    .gnupg  .node-gyp  .nvm      .rbenv  .ssh  .viminfo
..  .bash_logout   .cache   .dotfiles  .gemrc  .local  .npm       .profile  .rvm    .vim
Run Code Online (Sandbox Code Playgroud)

现在我看到了 .npm

+ /home/ubuntu/.npm/npm install …
Run Code Online (Sandbox Code Playgroud)

javascript java node.js npm jenkins

10
推荐指数
1
解决办法
3万
查看次数

如何在没有外部缓存的情况下将"this"传递给Promise?

我有一个名为LangDataService.isDataReadyPromise wawiting 的变量.一旦解决了一些逻辑就会发生.我怎么能把它传递给Promise?

LangDataService.isDataReady.then(function () {
    this.modalOn()
});
Run Code Online (Sandbox Code Playgroud)

我知道我可以缓存,var self_ = this;但我对其他选择感到好奇吗?

javascript caching asynchronous this promise

10
推荐指数
1
解决办法
3602
查看次数

usemin on grunt Build不会将bower组件正确构建到dist目录中

在Grunt构建中,如何捕获bower_components的正确路径,以在dist文件夹中创建一个完整的bower组件的vendor.js文件.我已经指出了原因,Grunt build的usemin正在从错误的文件夹..adding app文件夹前缀构建vendor.js.

如何删除此app前缀,以便grunt构建正确构建我的bower组件?

Grunt Build:但是在构建时它正在制作一个0kb的供应商文件,因为bower_components位于app上方的目录中 在此输入图像描述

正如您所看到的,我的bower_components位于我的app文件夹之外

在此输入图像描述

Usemin:

  <!-- build:js scripts/vendor.js -->
    <!-- bower:js -->
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-resource/angular-resource.js"></script>
    <script src="bower_components/angular-cookies/angular-cookies.js"></script>
    <script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
    <script src="bower_components/angular-animate/angular-animate.js"></script>
    <script src="bower_components/angular-touch/angular-touch.js"></script>
    <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
    <!-- endbower -->
    <!-- endbuild -->

        <!-- build:js({.tmp,app}) scripts/scripts.js -->
        <script src="scripts/app.js"></script>
        <script src="scripts/controllers/main.js"></script>
        <script src="scripts/controllers/about.js"></script>
        <script src="scripts/controllers/categories.js"></script>
        <script src="scripts/controllers/footer.js"></script>
        <script src="scripts/controllers/navigation.js"></script>
        <script src="scripts/controllers/shoppanel.js"></script>
        <script src="scripts/controllers/sidepanel.js"></script>
        <script src="scripts/controllers/weekly.js"></script>
        <!-- directives -->
        <script src="scripts/directives/slideshow.js"></script>
        <!-- .directives -->
        <!-- models -->
        <script src="scripts/models/pages.js"></script>
        <!-- .models -->
        <!-- endbuild -->
Run Code Online (Sandbox Code Playgroud)

咕噜文件:

// …
Run Code Online (Sandbox Code Playgroud)

javascript gruntjs yeoman bower grunt-usemin

9
推荐指数
1
解决办法
4834
查看次数

如何将数字数组连接成1个串联数字?

我如何加入该数组以尽可能少的步骤为我提供预期的输出?

var x = [31,31,3,1]
//expected output: x = 313131;
Run Code Online (Sandbox Code Playgroud)

javascript arrays

9
推荐指数
2
解决办法
1万
查看次数

如何通过angularJS中的嵌套键值对正确地重复ng-repeat

查看实时代码:

Angular JS

我是如何正确地遍历嵌套键值对并正确输出它们如下所示?

我想要的是一棵树就像这样

-touts
  -classes
    -col-12 
    -col-md-12
    -col-lg-12
Run Code Online (Sandbox Code Playgroud)

目前的观点是:

touts
  {"classes":["col-12","col-md-12","col-lg-12"]}
Run Code Online (Sandbox Code Playgroud)

JS:

var currentApp = angular.module('currentApp', []);
currentApp.controller('ACtrl', function($scope){

    $scope.templates = {
        'touts' : [
            {
                'classes' : ['col-12', 'col-md-12', 'col-lg-12' ]
            }
        ]
    };
});
Run Code Online (Sandbox Code Playgroud)

HTML:

<div ng-app="currentApp">
    <div ng-controller="ACtrl">
        <ul ng-repeat="(key, prop) in templates">
            <li>{{key}}</li>
              <li>
                  <ul ng-repeat="class in templates[key]">
                      <li>{{class}}</li>
                  </ul>
            </li>
        </ul>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

javascript json angularjs angularjs-ng-repeat

8
推荐指数
1
解决办法
2万
查看次数

如何在滑块的拇指上显示范围滑块的值?

这是一个奇怪的请求;然而,在滑块的拇指上显示 HTML5 范围滑块的值的最佳方法是什么?!拇指将在加载时进行动画处理,因此它必须跟随拇指;此外,这将在iPad上显示

例子:

在此输入图像描述

<input class="range-consideration" type="range" name="points" min="1" max="10" ng-model="rangeConsiderations">
Run Code Online (Sandbox Code Playgroud)

html javascript css

8
推荐指数
1
解决办法
3万
查看次数

为什么Stellar.js中的元素没有移动?

我在标题中有3个圆圈,当通过stellar.js滚动时,假设它们以不同的速率下降; 不幸的是,他们甚至不动.他们都有位置属性(绝对); 而且,我已经应用data-stellar-ratio了适当的标签.为什么stellar.js不起作用?更进一步,如何测试jQuery是否只是导航错误?

HTML

<div id="companyInfo" >
    <div class="circlefront" data-stellar-ratio="1.2"></div>
    <div class="circlemiddle" data-stellar-ratio="1.8"></div>
    <div class="circlerear" data-stellar-ratio="3"></div>
    <div class="infoWrapper">
      <h1>Towing, you can't do it without a truck, i have a truck</h1>
      <p>Id abunum ta inte publicae adhui senterem praties tantiena quitas vis, factum destus. Loca vehebus; et? Ti. Upionem, sil tala morbit ina, nique confendum tati et acepsen ihilin sula audactorips, fatur ia consign arisulos inatuis.</p>
    </div>
  </div>
Run Code Online (Sandbox Code Playgroud)

CSS

section#company div#companyInfo {
  height: 24em;
  line-height: 3em;
  margin: 0 auto; …
Run Code Online (Sandbox Code Playgroud)

html css jquery html5 css3

7
推荐指数
1
解决办法
1万
查看次数

一个dotfile,它将使用nvm在项目上设置默认节点版本?

在ruby中使用rbenv时,您可以创建一个.ruby-version文件并将其放在本地目录中.https://gist.github.com/fnichol/1912050 我正在寻找与NVM类似的东西?

题:

是否有要在package.json中设置的属性或要创建的文件,它将设置项目的节点的默认版本?

javascript version-control node.js nvm

7
推荐指数
3
解决办法
2095
查看次数

编写一个纯函数从内部属性返回另一个对象的一个​​对象?

做一些数据转换练习并陷入困境.我有一个对象,我想转换为from (starting)- > to (expected ending)输出如下所述.我正在尝试使用Array.reduceObject.assign保持输出纯净.但我无法让它正常工作.

/**
 *  from (starting): {topic: {id: 2}, products: {id: 3}}
 *  to (expected ending):   {topic: 2, products: 3}
 */

const starting = {topic: {id: 2}, products: {id: 3}};

const ending = Object.keys(starting).reduce((p, key) => {
  if(!p[key]) p[key] = key;
  return Object.assign(p[key], starting[key].id);  
}, {})
Run Code Online (Sandbox Code Playgroud)

javascript arrays reduce transformation

7
推荐指数
1
解决办法
118
查看次数