Question

我正在尝试实现一个既有堆叠条形图又有多个折线图的图表。我不能为我的生活弄清楚如何隐藏折线图上的点。我已尝试在Chart.defaults中，在数据集中，在选项中设置它，但没有运气。我认为这与制作组合条/折线图这一事实有关，你将图表定义为类型栏，这使得pointDot参数没有任何意义。有什么想法吗？

var ytdData = {
    labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
    datasets: [
      {
        type: 'bar',
        label: 'Sales',
        backgroundColor: 'green',
        data: sales,
        borderColor: 'white'
      },
      {
        type: 'bar',
        label: 'Additional URL',
        backgroundColor: 'red',
        data: addtlUrl,
        borderColor: 'white'
      },
      {
        type: 'bar',
        label: 'Recurring Services',
        backgroundColor: 'orange',
        data: addtlSvcs,
        borderColor: 'white'
      },
      {
        type: 'bar',
        label: 'Install Base',
        backgroundColor: 'blue',
        data: installBase,
        borderColor: 'white'
      },
      {
        type: 'bar',
        label: 'Double Comp',
        backgroundColor: 'purple',
        data: doubleComp,
        borderColor: 'white'
      },
      {
        type: 'line',
        label: 'Quota',
        fill: false,
        data: baseQuota,
        borderColor: '#C1C1C1',
        strokeColor: "rgba(151,187,205,0)",
        pointColor: "rgba(0,0,0,0)"
      },
      {
        type: 'line',
        label: 'Minimum MRR',
        fill: false,
        borderDash: [5, 5],
        data: [42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000, 42000]
      }
    ]
  };

  Chart.defaults.line.pointDot = false;

  var stackedChart = new Chart($("#ytdChart").get(0).getContext("2d"), {
    type: 'bar',
    data: ytdData,
    options: {
      legend: {
        position: 'bottom'
      },
      tooltips: {
        mode: 'label'
      },
      responsive: true,
      scales: {
        xAxes: [{
          stacked: true,
          ticks: {
            beginAtZero: true
          }
        }],
        yAxes: [{
          stacked: false,
          ticks: {
            suggestedMax: 5,
            beginAtZero: true,
            callback: function(value) {
              return Number(value).toFixed(0);
            }
          }
        }]
      }
    }
  });

Answer 1

只需为行数据集设置pointRadius到0，就像这样

{
    type: 'line',
    pointRadius: 0,
    ...

小提琴 - http://jsfiddle.net/w99o1eub/

如何在组合堆叠条形图表上设置pointDot选项

1 个答案: