kendo-asp.net-mvc - 剑道主题不会因图表而改变

Question

我想更改默认的 kendo ui 主题。问题是它发生了变化，但仅限于控件:网格等，但图表保持完全相同。

我正在将这些样式添加到 bundle 中。

bundles.Add(new StyleBundle("~/Content/kendoUi").Include(
    "~/Content/kendo/2016.1.112/kendo.common.min.css",
    "~/Content/kendo/2016.1.112/kendo.mobile.all.min.css",
    "~/Content/kendo/2016.1.112/kendo.metro.min.css"
));

我错过了什么吗？

Answer 1

今天我也在为同样的事情而苦苦挣扎。由于某种原因，图表的主题必须通过小部件配置来设置。

来自Documentation of the Kendo Client Library :

The Kendo UI Chart widgets come with a set of predefined themes. Use the theme option to select a theme, as demonstrated in the example below. The theme name is case insensitive.

$("#chart").kendoChart({
    theme: "blueOpal",
    //...
});

没有服务器包装器的文档。但是，它会这样工作:

@(Html.Kendo().Chart().Theme("blueOpal"))

原因似乎是explained here :

Kendo UI Gauges, Charts, Barcodes, Diagrams, and Maps use a mix of browser technologies to attain the required precision and responsiveness. Visualization is rendered as vector graphics with computed layout. In contrast, interactive features are built using traditional HTML elements. As a result, the appearance settings of these widgets are split between declarative options and traditional CSS.

如果你想在全局范围内进行，你需要override kendo :

var themable = ["Chart", "TreeMap", "Diagram", "StockChart", "Sparkline", "RadialGauge", "LinearGauge"];

if (kendo.dataviz) {
  for (var i = 0; i < themable.length; i++) {
    var widget = kendo.dataviz.ui[themable[i]];

    if (widget) {
      widget.fn.options.theme = "blueOpal";
    }
  }
}