个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
25
4
我正在使用 kendoUI 和 angular。我有一个 Kendo Donut 图表，如下所示。
<div class="center-pad" kendo-chart k-theme="['material']" k-chart-area="{height: 325, width: 480}"
k-series="[{ type: 'donut',
field: 'percentage',
labels: {visible: true, template: '${value} ${category} ${dataItem.color}', position: 'outsideEnd', font: '15px Lato-Regular'},
categoryField: 'source',
explodeField: 'explode'}]"
k-series-click="actionChartClick" k-data-source="actionChartData">
我想将系列标签颜色作为系列颜色。在模板中，我可以通过 ${dataItem.color}
我试过设置，
k-series="[{ ...
labels: {visible: true, template: '${value} ${category}', position: 'outsideEnd', font: '15px Lato-Regular', color: '${dataItem.color}'}"
但这没有用。谁能指导我应该更改的地方？
最佳答案
使用 seriesDefaults.labels.color 或 series.labels.color 并从函数返回所需的颜色值。您将有权访问函数参数中的 series 和 dataItem。
http://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/chart#configuration-series.labels.color
<!DOCTYPE html>
<html>
<head>
<base href="http://demos.telerik.com/kendo-ui/donut-charts/donut-labels">
<style>html { font-size: 14px; font-family: Arial, Helvetica, sans-serif; }</style>
<title></title>
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.common.min.css" />
<link rel="stylesheet" href="//kendo.cdn.telerik.com/2016.3.914/styles/kendo.default.min.css" />
<script src="//kendo.cdn.telerik.com/2016.3.914/js/jquery.min.js"></script>
<script src="//kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>
</head>
<body>
<div id="chart"></div>
<script>
$(function() {
$("#chart").kendoChart({
title: {
text: "What is you favourite sport?"
},
legend: {
position: "top"
},
seriesDefaults: {
labels: {
template: "#= category # - #= kendo.format('{0:P}', percentage)#",
position: "outsideEnd",
visible: true,
background: "transparent",
color: function(e) {
// e.series
// e.dataItem
if (e.category == "Football") {
return "#000";
} else {
return e.series.color;
}
}
}
},
series: [{
type: "donut",
labels: {
/*color: function(e) {
// e.series
// e.dataItem
if (e.category == "Football") {
return "#f00";
} else {
return e.series.color;
}
}*/
},
data: [{
category: "Football",
value: 35
}, {
category: "Basketball",
value: 25
}, {
category: "Volleyball",
value: 20
}, {
category: "Rugby",
value: 10
}, {
category: "Tennis",
value: 10
}]
}],
tooltip: {
visible: true,
template: "#= category # - #= kendo.format('{0:P}', percentage) #"
}
});
});
</script>
</body>
</html>关于javascript - Kendo UI 将 donut chart 的系列标签颜色更改为系列颜色，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39929562/
25
4
0
我正在尝试在 Kendo 网格中获取 Kendo Tree 。 我可以实现获取数据，但不能实现树功能。 下面是相同的链接 http://dojo.telerik.com/oDakE 任何人都可以帮助我
我使用的是 Kendo Treeview ，在 Kendo Treeview 节点中，我嵌入了 Kendo 下拉菜单。 一切正常，下拉列表出现在 Treeview 节点上，但是当我展开 treevie
我在同一页面上有 TreeView 和 Grid，我需要从网格数据填充 TreeView。所以流程是这样的: 用户从下拉列表中选择某项内容并单击按钮 -> Web 服务调用 -> 使用来自 Web 服
我正在尝试在 Treeview 中嵌套一个窗口。我想要这样，当用户选择一个特定的节点时，它会打开一个 Kendo 窗口。有没有人做过这个？我在演示中没有看到太多类似的东西。 我正在使用 mvc 包装器
我想知道是否可以加载 kendo.View(...) 或 kendo.layout(...) 的内容一个单独的 html 文件？ 这是剑道的例子Hello World Single Page Appl
我有 Kendo HierarchicalDataSource绑定(bind)到 Kendo 的对象 treeview小部件。 HierarchicalDataSource只返回一个一级深度的 jso
我想为 kendo-grid-react-wrapper 引入类似 kendoDateRangePicker 的东西。有 kendoDatePicker 允许您只选择一个日期而不是两个: filter
我正在尝试将 Kendo UI MVVM 框架与 Kendo UI 拖放机制结合使用；但我很难找到如何将数据从 draggable 对象中删除。 我的代码是这样的...... var viewMode
我正在尝试最新的 Kendo UI Web 版本，以便在我们的应用程序中使用它，特别是网格组件。 如图here网格能够在移动设备或任何浏览器中进行自适应渲染，如果 mobile属性设置为“手机”或“平
Kendo UI Web 和 Kendo UI Core 之间有什么区别 https://www.nuget.org/packages/KendoUIWeb http://www.nuget.org/
我正在尝试将 Kendo UI MVVM 框架与 Kendo UI 拖放机制结合使用；但是我很难找到如何从 draggable 对象中删除数据。 我的代码是这样的…… var viewModel =
我正在尝试最新的 Kendo UI Web 版本，以便在我们的应用程序中使用它，特别是网格组件。 如图here网格能够在移动设备或任何浏览器中进行自适应渲染，如果 mobile属性设置为“手机”或“平
KendoUI 版本 2013.3.1119使用 Kendo MVVM 我有一个我构建的颜色选择器，它使用平面颜色选择器和使用调色板的颜色选择器。它们都可以正常运行，但平面颜色选择器的布局已关闭， s
我使用以下方法显示格式化为百分比的数值: columns.push( { field: key, hidden:
Hello 使用类似于此示例的复选框实现了自定义过滤器菜单: http://dojo.telerik.com/@SiliconSoul/oBoCu 我的问题是，如果用户选择/取消选择了一些复选框，但从
网格列可以调整大小。我想存储用户调整的列宽并在下一个 session 开始时恢复它们。 我发现存储列宽的最佳方法如下: var element = $('#grid').kendoGrid({
我有一个Kendo ui图表，该图表显示来自动态数据源的柱形图。但有时图表会打开可用空间大小的一半。当我单击某些链接或更改日期时，它会自动调整大小。知道为什么会导致它吗？ 在数据源更改事件中，当它显示
我发现 kendoui 图表有两种方法:refresh方法和redraw方法，有什么区别？我想他们俩都是再画一次图表。但是如果图表是根据 ajax 从远程数据绑定(bind)的，则请求不会再次触发。
我有一个包含太多列的剑道网格。最初我选择隐藏一些列，但后来我决定用水平滚动条显示所有列。 我通过为每一列分配宽度来做到这一点。当我这样做时，每列之间的行与标题行不同步。 我的意思是，网格数据部分的行相
enter image description here 我正在尝试使用带有复选框的 Treeview 来定义用户权限。 (2 个 Action - 启用/禁用正确) 如何从父节点获取值(id)？ K
我是一名优秀的程序员,十分优秀！