小编Tom*_*myF的帖子

Angular2/Typescript + D3v4 - 手动包括打字?

我一直在尝试使用我的Angular2应用程序启动D3.
不过似乎有当前与新D3v4问题和可用的分型文件,即试图用新的方法,例如scaleLinear(),而不是不再scale.linear()会导致错误
Property 'scaleLinear' does not exist on type 'typeof d3'.
 

由于tomwanzek似乎已经在这个问题上并试图在https://github.com/tomwanzek/d3-v4-definitelytyped上创建新定义,我想知道是否有办法手动包含已有的打包文件我的angular2项目?

d3.js typescript-typings d3v4 angular

7
推荐指数
2
解决办法
4663
查看次数

如果目标重定向解析为相同路径,则 Vue 路由器 beforeEach 不会被调用

router.push('/')当我用作注销的最后一步时,我遇到了问题。

/ redirect如果我从与 s相同的路由触发注销过程,则router.beforeEach不会触发,因此不会将用户重定向到,/login但仍然显示仅对登录用户可见的路由(用户不再是该路由)在注销过程结束时)。

{
  path: '/',
  redirect: 'foo'
},
{
  path: '/foo',
  name: 'foo',
  component: Foo,
  meta: {
    requiresAuth: true
  }
},
Run Code Online (Sandbox Code Playgroud)

router.beforeEach((to, from, next) => {
  ...
  if(to.requiresAuth && userLoggedIn == false) 
    next('/login')
  ...
Run Code Online (Sandbox Code Playgroud)

/foo因此,如果我从除预期之外的任何路由触发注销,但如果我从/foo用户触发注销,则不会重定向到/login.

我想这可能是为了使路由尽可能高效而有意为之,但在这种情况下,这绝对不是我想要的。

如何确保我的beforeEach路线守卫每次都会得到评估router.push/replace

vue.js vue-router vuejs2

6
推荐指数
1
解决办法
3181
查看次数

D3 v4 - 访问选择数组并找到相应的元素

我正试图让一个约束放松,为我的饼图工作.它基于这个示例https://jsfiddle.net/thudfactor/HdwTH/但是使用的放松方法似乎不再适用于v4.
具体问题是他们如何直接访问选择组数组:

textLabels = labelGroups.append("text").attr( ... );

if(again) {
        labelElements = textLabels[0];     <------------- here
        textLines.attr("y2",function(d,i) {
            labelForLine = d3.select(labelElements[i]);
            return labelForLine.attr("y");
        });
        setTimeout(relax,20)
    }
Run Code Online (Sandbox Code Playgroud)

使用D3 v4.x更改了如何访问选择组数组?
你现在怎么样?

javascript d3.js

5
推荐指数
1
解决办法
3215
查看次数

Angular2 自动将 div 滚动到底部 - 表达式更改异常

我有一个overflow-y: scroll;Observable.interval()轮询和基本{{content}}插值填充的 div 。
我试图让它自动滚动到底部,所以最后一行将始终可见。
我发现这个 plnkr http://plnkr.co/edit/7yz2DUttPjI5GVJkvr5h?open=app%2Fapp.component.ts看起来是最优雅的解决方案:
<div #list class="list" [scrollTop]="list.scrollHeight">
但是,当我尝试相同的方法时,我得到了一个Expression has changed after it was checked.异常。

<div class="cdiv" #cdiv [scrollTop]="cdiv.scrollHeight">{{content}}</div>
Run Code Online (Sandbox Code Playgroud)

我只能假设*ngFor .. | async来自 plunker 的内部行为与我使用的直接插值不同。
但是我不明白为什么以及是否有办法解决它。

angular

5
推荐指数
2
解决办法
6104
查看次数

查找与条件匹配的相邻行

我在R中有一个金融时间序列(目前是一个xts对象,但我现在也在研究tibble).

如何找到与条件匹配的2个相邻行的概率?

例如,我想知道连续2天的概率高于平均值/中值.我知道lag前几天我可以进入下一行,这样可以让我得到这个统计数据,但这看起来非常麻烦且不灵活.

有没有更好的方法来完成这项工作?

xts样本数据:

foo <- xts(x = c(1,1,5,1,5,5,1), seq(as.Date("2016-01-01"), length = 7, by = "days"))
Run Code Online (Sandbox Code Playgroud)

连续2天高于median值的概率是多少?

5
推荐指数
1
解决办法
489
查看次数

VueJS Vuex - 解决状态变化的承诺?

是否可以创建一个 Promise 来在全局 vuex 存储中的变量发生更改时进行解析?

我有一个null在状态存储中初始化的变量,并将通过异步调用填充。
应用程序的不同部分取决于该变量是truefalse并且应该在它静止时等待null

有没有办法干净地等待这个变量的变化?

javascript promise vue.js vuex vuejs2

5
推荐指数
1
解决办法
1332
查看次数

将固定元素设置为视口中心的动画

position: fixed;在页面的右上角有一个元素。
我希望它在单击时“增长并移动”到屏幕的中心。

我知道的最好的解决方案是将某些内容放置在页面的中心位置

position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
Run Code Online (Sandbox Code Playgroud)

如果我最初使用topleft属性放置元素,那么一切都会很好,但是如果最初使用right而不是元素放置动画,则动画中会出现令人讨厌的跳跃left

position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
Run Code Online (Sandbox Code Playgroud)
const myFunc = function() {
  let f = document.getElementById('element')

  if (f.className.includes('bar')) {
    f.className = 'foo'
  } else {
    f.className = 'foo bar'
  }
}
Run Code Online (Sandbox Code Playgroud)
.wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.foo {
  position: fixed;
  top: 20px;
  right: 20px;
  width: 200px;
  height: 50px;
  background-color: blue; …
Run Code Online (Sandbox Code Playgroud)

css css-transitions css-animations

5
推荐指数
1
解决办法
112
查看次数

在子级变换缩放期间未应用 CSS 父级边框半径

我正在研究砖石类型布局,其中有一个带有column-count属性的容器,然后是带有圆角的保存图像的项目。我希望图像transform: scale在悬停时有一点效果,但是通过这种 css 组合,圆形边框在过渡过程中消失。

有什么办法解决吗?

.container {
  column-count: 2;
}

.item {
  width: 100%;
  overflow: hidden;
  border-radius: 10px;
}

img {
  max-width: 100%;
  max-height: 100%;
  transition: all 0.2s;
}

img:hover {
  transform: scale(1.1);
}
Run Code Online (Sandbox Code Playgroud)
<div class="container">

  <div class="item">
    <img src="https://images.unsplash.com/photo-1558834643-1dacaf774843?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=800&q=60">
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

html css css-transforms

5
推荐指数
1
解决办法
1874
查看次数

D3v4堆积条形图工具提示

我正在使用d3.stack()创建标准化堆叠条形图.
但是我无法访问mousover工具提示的初始数据集的相关值.

serie.selectAll("rect")
    .data(function(d) { return d; })
    .enter().append("rect")
      ...
      .on("mousemove", function(d){
          let coords = d3.mouse(svg.node());
          tooltip.style("left", coords[0] + "px");
          tooltip.style("top", coords[1] - 70 + "px");
          tooltip.style("display", "inline-block");
          tooltip.html("HOW TO ACCESS DATA HERE?");
        });
Run Code Online (Sandbox Code Playgroud)

d就是Array[2]在这一点上与定义基线/背线的值,d.data是完整的原始数据对象,但缺少了该系列目前,我正在徘徊的这堆的信息.
理想情况下,我希望工具提示显示数据集{name:"item1", foo:10, bar:20}

value: 10
percentage: 33%
Run Code Online (Sandbox Code Playgroud)

当悬停在foorect 上方时.
我发现的所有示例都是针对D3v3的,您只需使用它d.y来访问相关值,但这似乎不再适用于D3v4.

javascript d3.js

4
推荐指数
1
解决办法
2022
查看次数

D3 stack() 与嵌套对象

我在尝试使用 D3v4 实现标准化堆叠条形图时遇到了问题。
出现此问题的原因是我的数据格式包含在服务器端动态填充的嵌套对象数组。

var data = [{x:"data1", y:[{name:"red", value:10}, {name:"green", value:20}]},
            {x:"data2", y:[{name:"red", value:30}, {name:"green", value:5}]}];
Run Code Online (Sandbox Code Playgroud)

调用d3.stack()此函数将不起作用,因为 d3 不知道如何遍历对象数组y。(https://jsfiddle.net/xv1qgqjg/
有什么方法可以告诉d3.stack()在哪里可以找到与其他地方使用的类似的相关数据.data(function(d){ return d.y; })

d3.js

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

Angular2 APP_INITIALIZER嵌套了http请求

我一直在尝试APP_INITIALIZER在引导过程中使用加载一些配置数据(类似于如何将从后端渲染的参数传递给angular2引导程序方法,Angular2 APP_INITIALIZER不一致,以及其他).

我面临的问题是我需要发出2个请求,第一个请求到URL所在的本地json文件,然后请求该URL获取实际配置.

出于某种原因,启动不会延迟,直到承诺结算.

这是通过的方法调用的加载方法 APP_INITIALIZER

public load(): Promise<any> 
{
  console.log('bootstrap loading called');
  const promise = this.http.get('./src/config.json').map((res) => res.json()).toPromise();
  promise.then(config => {

    let url = config['URL'];
    console.log("loading external config from: ./src/" + url);

    this.http.get('./src/' + url).map(r => r.json()).subscribe(r => { this.config = r; console.dir(r);});
  });
  return promise;
}
Run Code Online (Sandbox Code Playgroud)

这是一个完整的plnkr演示问题(检查控制台输出).

显然,我错过了对这个概念的重要理解.

如何让应用程序在加载组件之前等待两个请求都返回?

angular-cli angular

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

Flutter - 仅在有足够空间时才显示图像

我有一个ExpandedWidget,Image.asset(...)因为它是孩子。
在小手机上没有足够的空间,图像被大量缩小。由于无论如何它只是为了吸引眼球,Image如果至少没有height >= 100.0可用的,我想隐藏/不显示。

我如何在 Flutter 中做到这一点?有没有办法获得父小部件的大小?

flutter flutter-layout

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