How to use the pts.Group function in pts

To help you get started, we’ve selected a few pts examples, based on popular ways it is used in public projects.

github williamngan / pts-react-example / neutrino_example / src / PtsExamples.jsx View on Github external
_renderChart() {
    // Given the data, distribute bars across the space's size
    let w = (this.space.size.x) / this.props.data.length;
    let bars = this.props.data.map( (d,i) => {
      return new Group( new Pt(i*w, this.space.size.y), new Pt( i*w, this.space.size.y-d*this.space.size.y-1) );
    });
    
    // Draw a line controlled by mouse pointer
    let line = new Group(new Pt(0, this.space.pointer.y), new Pt( this.space.size.x, this.space.pointer.y ) );
    this.form.stroke("#fff", 3).line( line, 10, "circle" );

    // Draw the bars and also check intersection with the pointer's line
    let intersects = bars.map( (b, i) => {
      this.form.stroke("#123",w-1).line( bars[i]  );
      return Line.intersectLine2D( b, line )
    });

    // Draw intersection points
    this.form.fillOnly("#f6c").points( intersects, w/2 );
  }
github williamngan / pts-react-example / src / PtsChart.jsx View on Github external
this.renderChart = () => {

      // Given the data, distribute bars across the space's size
      let w = (this.space.size.x) / this.props.data.length;
      let bars = this.props.data.map( (d,i) => {
        return new Group( new Pt(i*w, this.space.size.y), new Pt( i*w, this.space.size.y-d*this.space.size.y-1) );
      });
      
      // Draw a line controlled by mouse pointer
      let line = new Group(new Pt(0, this.space.size.y/2), new Pt( this.space.size.x, this.space.pointer.y ) );
      this.form.stroke("#fff", 3).line( line, 10, "circle" );

      // Draw the bars and also check intersection with the pointer's line
      let intersects = bars.map( (b, i) => {
        this.form.stroke("#123",w-1).line( bars[i]  );
        return Line.intersectLine2D( b, line )
      });

      // Draw intersection points
      this.form.fillOnly("#f6c").points( intersects, w/2 );
      
    }
github williamngan / pts-react-example / neutrino_example / src / PtsExamples.jsx View on Github external
let bars = this.props.data.map( (d,i) => {
      return new Group( new Pt(i*w, this.space.size.y), new Pt( i*w, this.space.size.y-d*this.space.size.y-1) );
    });
github williamngan / pts-react-example / src / PtsChart.jsx View on Github external
let bars = this.props.data.map( (d,i) => {
        return new Group( new Pt(i*w, this.space.size.y), new Pt( i*w, this.space.size.y-d*this.space.size.y-1) );
      });