文章/答案/技术大牛

发布

社区首页 >问答首页 >在渲染行为改变之前，HighCharts是否有一个基本的最小高度？

问在渲染行为改变之前，HighCharts是否有一个基本的最小高度？
EN

Stack Overflow用户

提问于 2021-06-11 08:54:01

回答 1查看 81关注 0票数 0

高图热图是否有基本的最低高度？

我们试图实现的是一个非常宽的热图，即1细胞高，4,032到4,462个细胞宽，把图表推到帧的边缘。

图表选项目前如下：

// options set on start up
chartOptions: Highcharts.Options = {
chart: {
  type: 'heatmap',
  margin: [0, 0, 0, 0],
  spacingTop: 0,
  spacingBottom: 0,
  spacingLeft: 0,
  spacingRight: 0
},
plotOptions: {
  heatmap: { // heatmap specific series
    borderColor: "#C4C4C4",
    borderWidth: 1,
  }
},
title: {
  text: undefined
},
credits: { enabled: false },
xAxis: { visible: false },
yAxis: { visible: false },
legend: { enabled: false },
colors: ["#DCDCDC"],
colorAxis: {
  dataClassColor: "category",
  dataClasses: [
    {
      from: 0,
      to: 0.9,
      color: "#DCDCDC",
      name: "Ok",
    },
    // Snipped full color set
  ]
},
series: [
  {
    name: 'Downtime status',
    type: 'heatmap',
    data: [[0, 0, 0], [1, 0, 0], [2, 0, 0], [3, 0, 0]], // Force initial chart creation to be a single row of data
  }
],
tooltip: {
  enabled: true,
}

}；

这都是在一个正式的角度包装。图表位于正常标记中：

<highcharts-chart *ngIf="isHighcharts"
                  [Highcharts]="Highcharts"
                  [constructorType]="chartConstructor"
                  [options]="chartOptions"
                  [callbackFunction]="chartCallback">
</highcharts-chart>

这是用以下css设计的：

highcharts-chart {
  clear: both;
  width: 40000px;
  height: 75px;
  overflow-x: auto;
  display: inline-block;
}

元素是故意溢出的，用户希望有一个滚动条，而不是放大图表。完整的数据集将在httpClient调用完成后加载。

当高度值大于75 be时，单个热图行工作正常，并填充完整的图表，但是如果我们将其降到75 be以下，则图表的行为会发生变化，而不是填充图表的行，它将恢复为一个非常小的行，5-10 be高，其余的填充whiteSpace。

这75便士是一个硬限制，还是有更多的选项在图表中，需要关闭？

angular

highcharts

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-06-11 09:25:52

这里：http://jsfiddle.net/BlackLabel/e9Lp3xvu/，我没有角度地复制了这个问题。

这个问题是由y轴(72)的tickPixelInterval默认值引起的.作为解决方案，您可以减少值。

    yAxis: {
        visible: false,
        tickPixelInterval: 1
    },

现场演示： http://jsfiddle.net/BlackLabel/ozLbs8qy/

API参考： https://api.highcharts.com/highcharts/yAxis.tickPixelInterval

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/67934046

复制

相似问题

问在渲染行为改变之前，HighCharts是否有一个基本的最小高度？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在渲染行为改变之前，HighCharts是否有一个基本的最小高度？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在渲染行为改变之前，HighCharts是否有一个基本的最小高度？
EN