小编Rob*_*Rob的帖子

d3js 时间线图 - 带有一个用于擦洗的矩形块

我正在考虑创建一个底部只有一个矩形块的时间线图表。那被用作主洗涤器。

//当前 - http://jsfiddle.net/NYEaX/2427/

在此处输入图片说明

擦洗部分在哪里 - 我只想有一个基本矩形。我应该对当前代码库进行哪些修改

所以它更像这样 在此处输入图片说明

//我最新的 - https://jsfiddle.net/2mvhjr7z/2/

$(document).ready(function() {


  var $this = $('.timelinechart');
    
      var w = $this.data("width");
      var h = $this.data("height");
      //var data = $this.data("data");

      
    var data = [
      {
        "label": "person a",
        "icon": "4",
        "times": [
          {"text": "Test 1", "starting_time": 1355752800000, "ending_time": 1355759900000},
          {"text": "Test 2", "starting_time": 1355767900000, "ending_time": 1355774400000},
          {"text": "Test 6", "starting_time": 1355761900000, "ending_time": 1355764520000},
          {"text": "Test 7", "starting_time": 1355767900000, "ending_time": 1355774400000}
        ]
      },
      {
        "label": "person b",
        "icon": "5",
        "times": [
          {"text": …
Run Code Online (Sandbox Code Playgroud)

javascript jquery d3.js

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

React.js-父,子状态处理架构

我正在一个reactjs网站上工作,该网站将具有一系列填充表格的项目。

父外壳程序将可用记录列表下拉到一个数组中,并且使用子组件,我想用此数据填充表行。

我已经开始创建子组件-但是直到将状态处理放在render函数附近之前,父组件提供的属性才得到处理。

我确实在子组件设置状态中有一个构造函数,但没有找到解决的办法-我应该在componetDidMount或componentWillMount中设置状态(如果创建了新的子项?)

子组件将具有按钮-保存,生成,取消-然后需要更改初始加载状态-

//规则父级可以从数组创建/删除子级-子级需要采用父级给定的初始值-但随后必须独立执行-因此子级可以采用初始属性,然后使用内部的按钮它-自己拨打电话。该应用程序已被此父数组绑定,这会导致故障。

-child必须能够取消-例如在保存之前恢复到其原始状态-因此,如果感动了-isDirty为true。-一个大孩子-isNew:false-预先存在的数据-仅显示一个保存按钮。只有名称是可编辑的-一个新的子对象-isNew:true-首先将显示一个生成按钮(保存为隐藏)-如果用户手动开始将数据输入到其中,则该生成按钮将被隐藏并显示保存名称字段。-禁用“生成/保存”按钮,直到用户选择了一个区域。

https://codesandbox.io/embed/frosty-vaughan-kdl1v 应该看起来像这样-初始数组使孩子成为孩子之后-父母应该只能添加空白孩子或删除新的/旧的孩子-然后,所有其他状态应仅在子级别发生-因为您可能有3个新孩子,5个老孩子-开始更改值-有些已保存,有些已取消-独立更改。

父母

import React, { Component } from "react";

import Child from "./Child";
export default class Parent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      list: [
        {
          name: "apple",
          currentCode: "BJ3343",
          previousCode: " ",
          region: "opt2",
          isNew: false,
          isDirty: false
        },
        {
          name: "cherry",
          currentCode: "AS3433",
          previousCode: " ",
          region: "opt1",
          isNew: false,
          isDirty: false
        }
      ]
    };
  }

  addChild() {
    let blank = {
      name: "xxxxxxxxxxxxxxx",
      code: "",
      region: …
Run Code Online (Sandbox Code Playgroud)

reactjs

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

标签 统计

d3.js ×1

javascript ×1

jquery ×1

reactjs ×1