Question

我正在使用highcharts-angular v2.4.0和highcharts v7.1.2开发Angular 8应用程序

我在打字稿chartOptions中将图表styledMode设置为true，并将以下内容放置在组件scss文件中

.highcharts-pie-series.highcharts-legend-item.highcharts-color-0 {
    text {
        font-size: 50px;
    }
}

我已经阅读了有关应用主题或覆盖样式的有关Highcharts的文章，但我尝试过的内容对所产生的饼图或图例没有任何影响。我想念什么？

Answer 1

不幸的是，使用样式模式时，您必须全局添加样式。

在angular-cli.json内添加图表样式的CSS文件（以下为chart-styles.css和theme.css）：

{
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": ["assets", "favicon.ico"],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "prefix": "app",
      "styles": ["styles.css", "theme.css", "chart-styles.css"],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ]
}

演示：

https://codesandbox.io/s/cqxuh

在Angular 8应用程序中使用HighCharts styledMode

1 个答案: