Method update_style

js/src/Lines.ts:216–274

()

  }

  update_style(): void {
    const fill = this.model.get('fill'),
      fillColor = this.model.get('fill_colors'),
      fillOpacities = this.model.get('fill_opacities');
    // update curve colors
    const curves = this.d3el.selectAll('.curve');
    curves
      .select('.line')
      .style('opacity', this.get_mark_opacity.bind(this))
      .style('stroke', (d, i) => {
        return this.get_mark_color(d, i) || fillColor[i];
      })
      .style('fill', (d, i) => {
        return fill === 'inside' ? this.get_fill_color(d, i) : '';
      })
      .style('fill-opacity', (d, i) => {
        return fill === 'inside' ? fillOpacities[i] : '';
      });
    curves
      .select('.area')
      .style('fill', (d, i) => {
        return this.get_fill_color(d, i);
      })
      .style('opacity', (d, i) => {
        return fillOpacities[i];
      });
    this.update_marker_style();
    // update legend style
    if (this.legendEl) {
      this.legendEl
        .select('.line')
        .style('stroke', (d, i) => {
          return this.get_mark_color(d, i) || fillColor[i];
        })
        .style('opacity', this.get_mark_opacity.bind(this))
        .style('fill', (d, i) => {
          return this.model.get('fill') === 'none'
            ? ''
            : this.get_fill_color(d, i);
        });
      this.legendEl
        .select('.dot')
        .style('stroke', (d, i) => {
          return this.get_mark_color(d, i) || fillColor[i];
        })
        .style('opacity', this.get_mark_opacity.bind(this))
        .style('fill', (d, i) => {
          return this.get_mark_color(d, i) || fillColor[i];
        });
      this.legendEl
        .select('text')
        .style('fill', (d, i) => {
          return this.get_mark_color(d, i) || fillColor[i];
        })
        .style('opacity', this.get_mark_opacity.bind(this));
    }
    this.update_stroke_width(this.model, this.model.get('stroke_width'));
    this.update_line_style();