Angular JS를 사용하여 그래프의 하루 중 사무실 타이밍 (시작 및 종료 시간)을 그려야합니다. 나는 10시에 사무실에 도달 한 후 1에서 점심 식사를 위해 밖으로 갔다 예를 들어Stacked Highcharts - 주어진 점을 그려서 스택 블록에서 색을 제거하는 방법
은 다시 몇 가지 작업을 위해 2시 30 분 나간 다음 2에왔다 등등 .....
그래서 그래프에서 y 축은 10에서 6까지의 시간을 보여야하고 1에서 10을 가리키고 1을, 2를, 그리고 2를 30과 같이 그래프에 시간을 표시해야합니다.
내 질문은 다음과 같습니다 :
1) 어떤 그래프를 사용하면 하나의 막대에서이를 얻을 수 있습니까?
2) 누적 된 차트를 사용하고 있지만 누적 차트가 포인트를 추가하기 때문에 두 데이터의 차이점을 전송하므로 먼저 10을 보내고 다른 하나는 1을 가리키고 3을 전송합니다. 그래서 on ...하지만, 전체 블록을 색상으로 채 웁니다. 10-1 한 색상, 1-2 한 색상 등 ..., 필요한 것은, 먼저 10을 가리키고 1을 가리켜 야합니다. , 2시에 ... 그리고 어떤 색으로도 채워서는 안됩니다. https://plnkr.co/edit/CgnFfTbJ3BkyjHzErQGk?p=preview
하지만 내가 달성하고자하는 것은 도와주세요이
같은 것입니다 : 내가 지금까지 달성 한 무엇
이다.
또한 아래의 코드를 확인할 수 있습니다 : 여기
<html>
<head>
<title>Highcharts Tutorial</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
</head>
<body>
<div id="container" style="width: 550px; height: 400px; margin: 0 auto"> </div>
<script language="JavaScript">
$(document).ready(function() {
var chart = {
type: 'column'
};
var title = {
text: 'Stacked column chart'
};
var xAxis = {
categories: ['Apples', 'Oranges', 'Pears', 'Grapes', 'Bananas']
};
var yAxis ={
min: 10,
max:18,
tickInterval:1,
title: {
text: 'Total fruit consumption'
},
stackLabels: {
enabled: false,
style: {
fontWeight: 'bold',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
}
}
};
var legend = {
enabled:false
};
var tooltip = {
enabled:false
};
var plotOptions = {
column: {
stacking: 'normal',
dataLabels: {
enabled: false,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
textShadow: '0 0 3px black'
}
}
}
};
var credits = {
enabled: false
};
var series= [
{ name: 'John',
data: [1]
},
{ name: 'John',
data: [0.5]
},
{ name: 'John',
data: [1]
},
{
name: 'Jane',
data: [3]
}, {
name: 'Joe',
data: [10]
}];
var json = {};
json.chart = chart;
json.title = title;
json.xAxis = xAxis;
json.yAxis = yAxis;
json.legend = legend;
json.tooltip = tooltip;
json.plotOptions = plotOptions;
json.credits = credits;
json.series = series;
$('#container').highcharts(json);
});
</script>
</body>
</html>
</script>
</body>
</html>