primeNG怎么使用混合图表

Question

primeNG是使用的chart.js作为图表的，单独的chart.js是可以使用混合图表的，我想问下primeNG怎么使用混合图表。

模板的写法：

<p-chart type="scatter" [data]="data" [options]="options"></p-chart>

我按照chart.js的写法

但是它只显示分散图的点，而不显示线性图。下面是代码：

this.data = {

  datasets: [

    {

      label: '',

      data: [{x:1,y:5},{x:3,y:7},{x:8,y:10}],

      fill: false,

      borderColor: '#fff'

    },

    {

      label: '',

      data: [{x:5,y:8},{x:3,y:7},{x:8,y:10}],

      fill: false,

      borderColor: '#fff',

      type: 'line'

    }

  ]

}

this.options = {

  responsive: false,

  title: {

    display: true,

    text: '',

    fontSize: 12

  },

  scales: {

    yAxes: [

      {

        scaleLabel: {

          display: true,

          labelString: 'KKWH'

        },

        gridLines: {

          display: false

        }

      }

    ],

    xAxes: [

      {

        type: 'linear',

        position: 'bottom'

      }

    ]

  }

};

Answer 1

经过反复查看文档，发现当line类型的chart和scatter混合使用时，在模板的type里写scatter，在数据集里写type：line的话，需要在line数据集里写上这个showLine: true才能显示出线条，否则只显示点。反之，在模板的type里写line，在数据集里写type：scatter的话，就不需要写showLine: true。