个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
我正在尝试创建一个监控界面来检查 Windows 服务并使用 var colorScale = d3.scale.ordinal() 确定其状态和 start_type。
如果状态是“RUNNING”，我想在单元格中涂上绿色。如果状态是“STOPPED”，我想在单元格中涂上红色。任何其他值，以白色着色。
这是我的完整代码:
<html>
<body>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<script type="text/javascript">
var parsedCSV = d3.csv("servicecheckupreport.csv", function(parsedCSV){
var colorScale = d3.scale.ordinal()
.domain([" ","RUNNING","STOPPED"])
.range(["White","MediumSpringGreen","OrangeRed"]);
var body = d3.select("body");
var headers = Object.keys(parsedCSV[0]);
var table = body.append('table')
var thead = table.append('thead')
var tbody = table.append('tbody');
var head = thead.selectAll('th')
.data(headers)
.enter()
.append('th')
.text(function(d) {
return d;
});
var rows = tbody.selectAll('tr')
.data(parsedCSV)
.enter()
.append('tr');
var cells = rows.selectAll('td')
.data(function(d) {
return Object.values(d);
})
.enter()
.append('td')
.style("background-color", function(d) {
if(d){
return colorScale(d);
}else{
return "White";
}
})
.text(function(d) {
return d;
});
});
</script>
这是输出:
问题是，当这些单元格应该是白色时，代码会在 ip 地址和主机名中着色。
我试图通过使用数组中的第三个值来调用 ordinal.unknown()，如下所示:
var colorScale = d3.scale.ordinal()
.domain([" ","RUNNING","STOPPED"])
.range(["White","MediumSpringGreen","OrangeRed"]);
数组的第一个值 "" 表示数组中第二个和第三个之外的任何值都将被着色为白色，但它仍然没有。
最佳答案
unknown 仅在 D3 v4.x 中可用，您必须显式设置它:
var data = ["RUNNING", "foo", "STOPPED", "RUNNING", "bar", "STOPPED"];
var colorScale = d3.scaleOrdinal()
.domain(["RUNNING","STOPPED"])
.unknown("White")
.range(["MediumSpringGreen","OrangeRed"]);
data.forEach(function(d){ console.log(colorScale(d))});<script src="https://d3js.org/d3.v4.min.js"></script>v3 替代方法是仅为两个定义的值调用 colorScale:
var data = ["RUNNING", "foo", "STOPPED", "RUNNING", "bar", "STOPPED"];
var colorScale = d3.scale.ordinal()
.domain(["RUNNING","STOPPED"])
.range(["MediumSpringGreen","OrangeRed"]);
data.forEach(function(d){
if(d === "RUNNING" || d === "STOPPED"){
console.log("White");
} else {
console.log(colorScale(d));
}
});<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>除此之外，你说的...
The first value of the array " " indicates any values that are outside of the second and third on the array will be colored in white.
...不正确。空格不是任何其他值的通配符。
最后，我不知道你的数据结构，但在我看来没有匹配的值(例如，“STATE:4 RUNNING”与“RUNNING”不同)，并且比例只是骑自行车穿过范围。要了解更多相关信息，请在此处查看我的回答:https://stackoverflow.com/a/40675350/5768908
关于javascript - 尽管隐含了未知数，但序数刻度没有正确着色？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43098554/
25
4
0
这个问题在这里已经有了答案: 关闭 10 年前。 Possible Duplicate: Combination of List> 我有多个列表，可以是 2 个或 3 个，最多 10 个列表，有多个
我是一名优秀的程序员,十分优秀！