docs(demo): add line curved demo, fix autoResize' bug

examples/line/double/demo/curved.js

@@ -0,0 +1,72 @@
+import { Chart } from '@antv/g2';
+
+const data = [
+  { month: 'Jan', city: 'Tokyo', temperature: 7 },
+  { month: 'Jan', city: 'London', temperature: 3.9 },
+  { month: 'Feb', city: 'Tokyo', temperature: 6.9 },
+  { month: 'Feb', city: 'London', temperature: 4.2 },
+  { month: 'Mar', city: 'Tokyo', temperature: 9.5 },
+  { month: 'Mar', city: 'London', temperature: 5.7 },
+  { month: 'Apr', city: 'Tokyo', temperature: 14.5 },
+  { month: 'Apr', city: 'London', temperature: 8.5 },
+  { month: 'May', city: 'Tokyo', temperature: 18.4 },
+  { month: 'May', city: 'London', temperature: 11.9 },
+  { month: 'Jun', city: 'Tokyo', temperature: 21.5 },
+  { month: 'Jun', city: 'London', temperature: 15.2 },
+  { month: 'Jul', city: 'Tokyo', temperature: 25.2 },
+  { month: 'Jul', city: 'London', temperature: 17 },
+  { month: 'Aug', city: 'Tokyo', temperature: 26.5 },
+  { month: 'Aug', city: 'London', temperature: 16.6 },
+  { month: 'Sep', city: 'Tokyo', temperature: 23.3 },
+  { month: 'Sep', city: 'London', temperature: 14.2 },
+  { month: 'Oct', city: 'Tokyo', temperature: 18.3 },
+  { month: 'Oct', city: 'London', temperature: 10.3 },
+  { month: 'Nov', city: 'Tokyo', temperature: 13.9 },
+  { month: 'Nov', city: 'London', temperature: 6.6 },
+  { month: 'Dec', city: 'Tokyo', temperature: 9.6 },
+  { month: 'Dec', city: 'London', temperature: 4.8 },
+];
+
+const chart = new Chart({
+  container: 'container',
+  height: 500,
+});
+
+chart.data(data);
+
+chart.scale('month', {
+  range: [0, 1],
+});
+
+chart.tooltip({
+  crosshairs: {
+    type: 'line',
+  },
+});
+
+chart.axis('temperature', {
+  label: {
+    formatter: (val) => {
+      return val + '°C';
+    },
+  },
+});
+
+chart
+  .line()
+  .position('month*temperature')
+  .color('city')
+  .shape('smooth');
+
+chart
+  .point()
+  .position('month*temperature')
+  .color('city')
+  .size(4)
+  .shape('circle')
+  .style({
+    stroke: '#fff',
+    lineWidth: 1,
+  });
+
+chart.render();

src/chart/chart.ts

@@ -106,7 +106,7 @@ export default class Chart extends View {
    * when container size changed, change chart size props, and re-render.
    */
   private onResize = _.debounce(() => {
-    const { width, height } = this.ele.getBoundingClientRect();
+    const { width, height } = getChartSize(this.ele, this.autoFit, this.width, this.height);
     this.changeSize(width, height);
-  }, 60);
+  }, 300);
 }