我已使用以下代码实现了Morris Line Chart
,这样做效果很好。
但我需要在目标的第二行名称中进行一些修改。你已经看到每个月出现点。我想从那条线上移除这些点,这样我就会成为一条直线。
Morris.Line({
element: 'line-chart',
data: JSON.parse(GraphData),
xkey: 'title',
ykeys: ['goal', 'actual'],
labels: ['Goal', 'Actual'],
xLabelFormat: function(x) { // <--- x.getMonth() returns valid index
var month = months[x.getMonth()];
return month;
},
dateFormat: function(x) {
var month = months[new Date(x).getMonth()];
return month;
},
resize: true,
lineColors: ['#ecb201', '#1B17BB'],
gridTextFamily: "'Nunito', sans-serif",
gridTextWeight: '300',
gridTextSize: 11,
gridTextColor: '#090b0d',
pointSize: 4,
lineWidth: 2,
pointStrokeColors: ['#ffffff', '#ffffff'],
});
答案 0 :(得分:4)
尝试将pointSize更改为0.在开始时设置pointSiZe:0
Morris.Line({
element: 'line-chart',
pointSize: 0, ....
)}
答案 1 :(得分:1)
渲染图表后使用此脚本。
$(document).ready(function(){
$('circle[fill="#ecb201"]').each(function(i,el) {
//console.log($(this).attr("r" , 0));
$(this).removeAttr("r");
$(this).removeAttr("cy");
$(this).removeAttr("cx");
});
});
但是在悬停时它会再次显示这些点数。这就是问题所在。