<script>
import baseChart from "./base-chart.vue";
import slots from "./mixin/slots";
import g2plot from "./mixin/g2plot";
export default {
  mixins: [slots(), g2plot()],
  components: { baseChart },
  render() {
    const tooltipData = this.tooltipData;
   
    const scopeSlots = this._scopeSlots || (this._scopeSlots = this.resolveBaseChartScopeSlot())
    const chartContentStyle = this.config._width ? {'max-width': `${this.config._width}`, 'min-width': `${this.config._width}`} : {}
    return (
      <baseChart
        scopedSlots={this.resolveBaseChartScopeSlot()}
        config={this.config}
        class={{ ["pot-chart-" + this.config._name]: true }}
      >
        <div class="plot-chart-content" style={chartContentStyle}></div>
        {this.renderSlots(true)}
        <div style="display:none">
          {scopeSlots.tooltip && (
            <div class="plot-chart--tooltip g2-tooltip" ref="plotChartTooltip">
              {scopeSlots.tooltip({
                config: this.config,
                tooltipData,
              })}
            </div>
          )}
        </div>
      </baseChart>
    );
  },
};
</script>