javascript 如何更改 Morris.js 折线图中的点点颜色和样式？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14037281/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to change the dot point color and style in Morris.js line graph?
提问by kinakomochi
回答by vortexwolf
Use the pointFillColorsproperty.
From the documentation:
使用pointFillColors物业。从文档：
pointFillColors Colors for the series points. By default uses the same values as lineColors
pointFillColors 系列点的颜色。默认情况下使用与 lineColors 相同的值
Here is the example of the chart with blue line and green dots:
这是带有蓝线和绿点的图表示例：
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="raphael-min.js"></script>
<script type="text/javascript" src="morris.min.js"></script>
<script type="text/javascript">
function drawChart() {
Morris.Line({
element: 'chart',
data: [
{y: '2012', a: 100},
{y: '2011', a: 75},
{y: '2010', a: 50},
{y: '2009', a: 75},
{y: '2008', a: 50},
{y: '2007', a: 75},
{y: '2006', a: 100}
],
xkey: 'y',
ykeys: ['a'],
labels: ['Test series'],
lineColors: ['#0b62a4'],
pointFillColors: ['#00ff00']
});
}
window.onload = drawChart;
</script>
<div id="chart" style="width: 400px; height: 250px;"></div>
回答by Jakub Hadvig
Instead of "lineColors", try "colors" like this:
而不是“lineColors”，试试这样的“颜色”：
function drawChart() {
Morris.Line({
element: 'chart',
data: [
{y: '2012', a: 100},
{y: '2011', a: 75},
{y: '2010', a: 50},
{y: '2009', a: 75},
{y: '2008', a: 50},
{y: '2007', a: 75},
{y: '2006', a: 100}
],
colors: ['#0b62a4','#D58665','#37619d','#fefefe','#A87D8E','#2D619C','#2D9C2F']
});
}
}
for every line there should be one color.
每条线都应该有一种颜色。
