Index: arms/html/analysisTime/content-container.html =================================================================== diff -u -r788aeafe69a4719e241d2b2e7ae378dc4a6becbb -rb0cac3a3dfdd117b421baa7f1401358c282494af --- arms/html/analysisTime/content-container.html (.../content-container.html) (revision 788aeafe69a4719e241d2b2e7ae378dc4a6becbb) +++ arms/html/analysisTime/content-container.html (.../content-container.html) (revision b0cac3a3dfdd117b421baa7f1401358c282494af) @@ -7,16 +7,18 @@ 첫번째 박스 +
-
-
+
+
+
1. Productservice 를 선택해 주세요 @@ -56,15 +58,16 @@
-
+

- 선택된 제품 및 버전 Sender 자리 + 전체 남은 일자 중 남은 퍼센트

+
    @@ -87,15 +90,16 @@
-
@@ -252,11 +166,12 @@ 두번째 박스 +
-
-
-
+
+
+ +
+
+

+ + + 진행 기한 + +

+
+
+
+
+ + +
+
+
+
+
-
+
-
+

- - - 차수별 진행 현황 컬러표 - + + + 버전 타임라인 +

+
-
-
    -
    -
  • - - 전환전 -
  • -
  • - - 단위테스트 -
  • -
  • - - 성능테스트 -
  • -
    -
    -
  • - - 통합테스트 -
  • -
  • - - 컷오버 -
  • -
  • - - 전환 완료 -
  • -
    -
+
+
@@ -342,10 +281,11 @@ 세번째 박스 +
-
-
+
+

@@ -354,6 +294,7 @@ 전체 어플리케이션 진행 현황 컬러표

+
    @@ -376,47 +317,88 @@
-
-
-
+
+
+

- - - 차수별 진행 현황 컬러표 - + 제품(서비스) 버전별 + + 요구사항 상태 +

+
+
+ + + +
-
-
    -
    -
  • - - 전환전 -
  • -
  • - - 단위테스트 -
  • -
  • - - 성능테스트 -
  • -
    -
    -
  • - - 통합테스트 -
  • -
  • - - 컷오버 -
  • -
  • - - 전환 완료 -
  • -
    -
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SourceAmountChangeTarget
Direct713+53900
Refer562+84500
Social148-12180
Search653+23876
Internal976+101844
@@ -432,83 +414,35 @@ 네번째 박스 +
-
-
-
-
-

- - - 전체 어플리케이션 진행 현황 컬러표 - -

+
+
+
+
+

Top sources

+
-
    -
    -
  • - - 전환전 -
  • -
  • - - 진행중 -
  • -
  • - - 전환완료 -
  • -
    -
    -
+
+ +
+
+
-
-
-
-

- - - 차수별 진행 현황 컬러표 - -

+
+
+
+

Bar Chart

+
-
-
    -
    -
  • - - 전환전 -
  • -
  • - - 단위테스트 -
  • -
  • - - 성능테스트 -
  • -
    -
    -
  • - - 통합테스트 -
  • -
  • - - 컷오버 -
  • -
  • - - 전환 완료 -
  • -
    -
+
+
-
+
@@ -522,10 +456,11 @@ 다섯번째 박스 +
-
-
+
+

@@ -534,6 +469,7 @@ 전체 어플리케이션 진행 현황 컬러표

+
    @@ -556,47 +492,22 @@
-
+

- 차수별 진행 현황 컬러표 + HeatMap

+
-
    -
    -
  • - - 전환전 -
  • -
  • - - 단위테스트 -
  • -
  • - - 성능테스트 -
  • -
    -
    -
  • - - 통합테스트 -
  • -
  • - - 컷오버 -
  • -
  • - - 전환 완료 -
  • -
    -
+
+
+
+
@@ -612,86 +523,94 @@ 여섯번째 박스 +
-
-
-
+
+
+

- 전체 어플리케이션 진행 현황 컬러표 + 차수별 진행 현황 컬러표

+
-
    -
    -
  • - - 전환전 -
  • -
  • - - 진행중 -
  • -
  • - - 전환완료 -
  • -
    -
    -
+
+
-
-
+
+
+
+
+ + +
+
+ +
+
+
+

차수별 진행 현황 컬러표

+
-
    -
    -
  • - - 전환전 -
  • -
  • - - 단위테스트 -
  • -
  • - - 성능테스트 -
  • -
    -
    -
  • - - 통합테스트 -
  • -
  • - - 컷오버 -
  • -
  • - - 전환 완료 -
  • -
    -
+
-
\ No newline at end of file + +
+ + \ No newline at end of file Index: arms/js/analysisTime.js =================================================================== diff -u -r788aeafe69a4719e241d2b2e7ae378dc4a6becbb -rb0cac3a3dfdd117b421baa7f1401358c282494af --- arms/js/analysisTime.js (.../analysisTime.js) (revision 788aeafe69a4719e241d2b2e7ae378dc4a6becbb) +++ arms/js/analysisTime.js (.../analysisTime.js) (revision b0cac3a3dfdd117b421baa7f1401358c282494af) @@ -1,6 +1,7 @@ /////////////////// //Page 전역 변수 /////////////////// +var dashboardColor; // 필요시 작성 //////////////////////////////////////////////////////////////////////////////////////// @@ -14,10 +15,47 @@ "../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Load-Image_js_load-image.js", "../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Canvas-to-Blob_js_canvas-to-blob.js", "../reference/light-blue/lib/jquery.iframe-transport.js", - "../reference/light-blue/lib/jquery.fileupload.js", - "../reference/light-blue/lib/jquery.fileupload-fp.js", - "../reference/light-blue/lib/jquery.fileupload-ui.js"], + // chart Colors + "./js/dashboard/chart/colorPalette.js", + // 2번째 박스 d3 게이지 차트 + "../reference/jquery-plugins/d3-v4.13.0/d3.v4.min.js", + "../reference/jquery-plugins/c3/c3.min.css", + "../reference/jquery-plugins/c3/c3-custom.css", + "../reference/jquery-plugins/c3/c3.min.js", + "./js/common/colorPalette.js", + // 2번째 박스 timeline + "../reference/jquery-plugins/info-chart-v1/js/D.js", + "./js/dashboard/chart/timeline_custom.js", + "./js/dashboard/chart/infographic_custom.css", + // 네번째 박스 차트 + // d3.v2와 d3.v4 버전차이 오류생김... + "../reference/light-blue/lib/nvd3/lib/d3.v2.js", + "../reference/light-blue/lib/nvd3/nv.d3.custom.js", + "../reference/light-blue/lib/nvd3/src/models/pieChartTotal.js", + "../reference/light-blue/lib/nvd3/src/models/pie.js", + "../reference/light-blue/lib/nvd3/src/models/legend.js", + "../reference/light-blue/lib/nvd3/src/models/multiBar.js", + "../reference/light-blue/lib/nvd3/src/models/multiBarChart.js", + "../reference/light-blue/js/stats.js", + "../reference/light-blue/lib/nvd3/src/models/axis.js", + "../reference/light-blue/lib/nvd3/src/utils.js", + "../reference/light-blue/lib/nvd3/stream_layers.js", + // echarts + // "../reference/jquery-plugins/echarts-5.4.3/dist/echarts.min.js", + // "./js/dashboard/chart/barChartOnPolar.js", + // 5번째 박스 heatmap + "../reference/jquery-plugins/github-calendar-heatmap/js/calendar_yearview_blocks.js", + "../reference/jquery-plugins/github-calendar-heatmap/css/calendar_yearview_blocks.css", + // timeline + // "../reference/jquery-plugins/Timeline-Graphs-jQuery-Raphael/timeline/js/timeline.js", + // "../reference/jquery-plugins/Timeline-Graphs-jQuery-Raphael/js/demo.js", + // 7번째 박스 + // "../reference/jquery-plugins/timelines-chart-2.11.8/src/timeline-chart.js", + // "../reference/jquery-plugins/timelines-chart-2.11.8/example/random-data.js", + // "https://unpkg.com/timelines-chart@2.12.1/dist/timelines-chart.min.js", + ], + [ "../reference/lightblue4/docs/lib/slimScroll/jquery.slimscroll.min.js", "../reference/jquery-plugins/unityping-0.1.0/dist/jquery.unityping.min.js", "../reference/light-blue/lib/bootstrap-datepicker.js", @@ -58,7 +96,7 @@ document.head.appendChild(script); }, 3000); // 2초 후에 실행됩니다. console.log('모든 플러그인 로드 완료'); - + // 사이드 메뉴 처리 $('.widget').widgster(); setSideMenu("sidebar_menu_analysis", "sidebar_menu_analysis_time"); @@ -68,10 +106,14 @@ //버전 멀티 셀렉트 박스 이니시에이터 makeVersionMultiSelectBox(); - //박스별 차트 호출 + heatMapReady(); + // sevenTimeline(); + dashboardColor = dashboardPalette.dashboardPalette01; + console.log(dashboardColor); + }) .catch(function() { console.error('플러그인 로드 중 오류 발생'); @@ -82,6 +124,7 @@ /////////////////////// //제품 서비스 셀렉트 박스 ////////////////////// +/* function makePdServiceSelectBox() { //제품 서비스 셀렉트 박스 이니시에이터 $(".chzn-select").each(function () { @@ -138,6 +181,7 @@ }); } // end makePdServiceSelectBox() +*/ //////////////////// //버전 멀티 셀렉트 박스 @@ -491,4 +535,563 @@ isServerSide ); } -// -------------------- 데이터 테이블을 만드는 템플릿으로 쓰기에 적당하게 리팩토링 함. ------------------ // \ No newline at end of file +// -------------------- 데이터 테이블을 만드는 템플릿으로 쓰기에 적당하게 리팩토링 함. ------------------ // + +function makePdServiceSelectBox() { + //제품 서비스 셀렉트 박스 이니시에이터 + $(".chzn-select").each(function () { + $(this).select2($(this).data()); + }); + + //제품 서비스 셀렉트 박스 데이터 바인딩 + $.ajax({ + url: "/auth-user/api/arms/pdService/getPdServiceMonitor.do", + type: "GET", + contentType: "application/json;charset=UTF-8", + dataType: "json", + progress: true, + statusCode: { + 200: function (data) { + ////////////////////////////////////////////////////////// + for (var k in data.response) { + var obj = data.response[k]; + var newOption = new Option(obj.c_title, obj.c_id, false, false); + $("#selected_pdService").append(newOption).trigger("change"); + } + ////////////////////////////////////////////////////////// + } + } + }); + + + $("#selected_pdService").on("select2:open", function () { + //슬림스크롤 + makeSlimScroll(".select2-results__options"); + }); + + // --- select2 ( 제품(서비스) 검색 및 선택 ) 이벤트 --- // + $("#selected_pdService").on("select2:select", function (e) { + // 제품( 서비스 ) 선택했으니까 자동으로 버전을 선택할 수 있게 유도 + // 디폴트는 base version 을 선택하게 하고 ( select all ) + //~> 이벤트 연계 함수 :: Version 표시 jsTree 빌드 + bind_VersionData_By_PdService(); + + var checked = $("#checkbox1").is(":checked"); + var endPointUrl = ""; + + if (checked) { + endPointUrl = "/T_ARMS_REQSTATUS_" + $("#selected_pdService").val() + "/getStatusMonitor.do?disable=true"; + } else { + endPointUrl = "/T_ARMS_REQSTATUS_" + $("#selected_pdService").val() + "/getStatusMonitor.do?disable=false"; + } + + //이슈리스트 진행 상황 + //getIssueStatus($("#selected_pdService").val(), endPointUrl); + //통계로드 + //statisticsLoad($("#selected_pdService").val(), null); + console.log("선택된 제품(서비스) c_id = " + $("#selected_pdService").val()); + + statisticsMonitor($("#selected_pdService").val()); //ES모으는중 by YHS + + //타임라인 + // $("#notifyNoVersion2").hide(); + + // 투입 인력별 요구사항 차트 + // dataTableLoad($("#selected_pdService").val(), endPointUrl); + }); +} // end makePdServiceSelectBox() + +function statisticsMonitor(pdservice_id, pdservice_version_id) { + console.log("선택된 서비스 ===> " + pdservice_id); + tot_ver_count = 0; + active_ver_count = 0; + req_count = 0; + subtask_count = 0; + resource_count = 0; + + //1. 좌상 게이지 차트 및 타임라인 + //2. Time ( 작업일정 ) - 버전 개수 삽입 + d3.json("/auth-user/api/arms/pdService/getNodeWithVersionOrderByCidDesc.do?c_id=" + pdservice_id,function(json) { + + let versionData = json.pdServiceVersionEntities; + let version_count = versionData.length; + tot_ver_count = version_count; + + console.log("등록된 버전 개수 = " + version_count); + if(version_count !== undefined) { + $('#version_count').text(version_count); + + if (version_count >= 0) { + let today = new Date(); // console.log(today); + let plusDate = new Date(); + + $("#notifyNoVersion").slideUp(); + $("#project-start").show(); + $("#project-end").show(); + + $("#versionGaugeChart").html(""); //게이지 차트 초기화 + var versionGauge = []; + var versionTimeline = []; + versionData.forEach(function (versionElement, idx) { + //console.log(idx); console.log(versionElement); + var gaugeElement = { + "current_date": today.toString(), + "version_name": versionElement.c_title, + "version_id": versionElement.c_id, + "start_date": (versionElement.c_pds_version_start_date == "start" ? today : versionElement.c_pds_version_start_date), + "end_date": (versionElement.c_pds_version_end_date == "end" ? today : versionElement.c_pds_version_end_date) + //"end_date": (versionElement.c_pds_version_end_date == "end" ? plusDate.setMonth(plusDate.getMonth()+1) : versionElement.c_pds_version_end_date) + } + versionGauge.push(gaugeElement); + var timelineElement = { + "title" : "버전: "+versionElement.c_title, + "startDate" : (versionElement.c_pds_version_start_date == "start" ? today : versionElement.c_pds_version_start_date), + "endDate" : (versionElement.c_pds_version_end_date == "end" ? today : versionElement.c_pds_version_end_date) + //"endDate" : (versionElement.c_pds_version_end_date == "end" ? plusDate : versionElement.c_pds_version_end_date) + }; + versionTimeline.push(timelineElement); + }); + + drawVersionProgress(versionGauge); // 버전 게이지 + Timeline.init($("#version-timeline-bar"), versionTimeline); + } + } + }); + + + // 제품서비스 - status + // getReqCount(pdservice_id, ""); + // // 제품서비스별 담당자 통계 + // getAssigneeInfo(pdservice_id, ""); + // + // getReqAndLinkedIssueTop5(pdservice_id); // 우하단 수평바 + // getIssueResponsibleStatusTop5(pdservice_id); // 우하단 폴라바 + // 우하단 폴라바 + + // setTimeout(function () { + // //Scope - (2) 요구사항에 연결된 이슈 총 개수 + // getLinkedIssueCount(pdservice_id, ""); // 연결된 이슈 총 개수, 평균 값 대입 + // + // $('#inactive_version_count').text( tot_ver_count - active_ver_count ); + // },1000); + +} + +function drawVersionProgress(data) { + var Needle, + arc, + arcEndRad, + arcStartRad, + barWidth, // 색션의 두께 + chart, + chartInset, // 가운데로 들어간 정도 + el, + endPadRad, + height, + i, + margin, // 차트가 그려지는 위치 마진 + needle, // 침 + numSections,// 색션의 수 + padRad, + percToDeg, percToRad, degToRad, // 고정 + percent, + radius, // 반지름 + ref, + sectionIndx, // 색션 인덱스 + sectionPerc, // 색션의 퍼센트 + startPadRad, + svg, + totalPercent, + width, + versionId, + versionName, + waveName; + + percent = 0.55; + barWidth = 25; + padRad = 0; + chartInset = 11; + totalPercent = 0.75; + + margin = { + top: 0, + right: 0, + bottom: 0, + left: 0 + }; + + width = 220; + height = width; + radius = Math.min(width, height) / 2.5; + + // percToDeg percToRad degToRad 고정 + percToDeg = function (perc) { + return perc * 360; + }; + + percToRad = function (perc) { + return degToRad(percToDeg(perc)); + }; + + degToRad = function (deg) { + return (deg * Math.PI) / 180; + }; + // + svg = d3 + .select("#versionGaugeChart") + .append("svg") + .attr("viewBox", [70, 10, width -150, height -100]) + .append("g"); + + chart = svg + .append("g") + .attr("transform", "translate(" + (width + margin.left) / 2 + ", " + (height + margin.top) / 2 + ")"); + + var tooltip = d3 + .select("#versionGaugeChart") + .append("div") + .style("opacity", 0) + .attr("class", "tooltip") + .style("background-color", "white") + .style("border", "solid") + .style("border-width", "1px") + .style("border-radius", "5px") + .style("color", "black") + .style("padding", "10px"); + + var arc = d3 + .arc() + .innerRadius(radius * 0.6) + .outerRadius(radius); + + var outerArc = d3 + .arc() + .innerRadius(radius * 0.9) + .outerRadius(radius * 0.9); + + var totalDate; + var startDDay; + var endDDay; + + numSections = data.length; // 전체 색션의 수(버전의 수) + sectionPerc = 1 / numSections / 2; // '/ 2' for Half-circle + + var fastestStartDate; + var latestEndDate; + // 가장 빠른날짜, 가장 느린날짜 세팅 + for (var idx = 0; idx < data.length; idx++) { + if (idx === 0) { + fastestStartDate = data[idx].start_date; + latestEndDate = data[idx].end_date; + } else { + if (data[idx].start_date < fastestStartDate) { + fastestStartDate = data[idx].start_date; + } + if (data[idx].end_date > latestEndDate) { + latestEndDate = data[idx].end_date; + } + } + } + + $("#fastestStartDate").text(new Date(fastestStartDate).toLocaleDateString()); + $("#latestEndDate").text(new Date(latestEndDate).toLocaleDateString()); + + startDDay = Math.floor( + Math.abs((new Date(data[0].current_date) - new Date(fastestStartDate)) / (1000 * 60 * 60 * 24)) + ); + endDDay = Math.floor( + Math.abs((new Date(latestEndDate) - new Date(data[0].current_date)) / (1000 * 60 * 60 * 24)) + 1 + ); + $("#startDDay").text("+ " + startDDay); + $("#endDDay").text("- " + endDDay); + + totalDate = startDDay + endDDay; + + var mouseover = function (d) { + var subgroupId = d.version_id; + var subgroupName = d.version_name; + var subgroupValue = new Date(d.start_date).toLocaleDateString() + " ~ " + new Date(d.end_date).toLocaleDateString(); + tooltip.html("버전명: " + subgroupName + "
" + "기간: " + subgroupValue).style("opacity", 1); + + d3.selectAll(".myWave").style("opacity", 0.2); + d3.selectAll(".myStr").style("opacity", 0.2); + d3.selectAll(".wave-" + subgroupId).style("opacity", 1); + }; + + var mousemove = function (d) { + tooltip.style("left", d3.mouse(this)[0] + 120 + "px").style("top", d3.mouse(this)[1] + 150 + "px"); + }; + + var mouseleave = function (d) { + tooltip.style("opacity", 0); + d3.selectAll(".myStr").style("opacity", 1); + d3.selectAll(".myWave").style("opacity", 1); + }; + + for (sectionIndx = i = 1, ref = numSections; 1 <= ref ? i <= ref : i >= ref; sectionIndx = 1 <= ref ? ++i : --i) { + arcStartRad = percToRad(totalPercent); + arcEndRad = arcStartRad + percToRad(sectionPerc); + totalPercent += sectionPerc; + startPadRad = sectionIndx === 0 ? 0 : padRad / 2; + endPadRad = sectionIndx === numSections ? 0 : padRad / 2; + versionId = data[sectionIndx - 1].version_id; + versionName = data[sectionIndx - 1].version_name; + + var sectionData = data[sectionIndx - 1]; + + var arc = d3 + .arc() + .outerRadius(radius - chartInset) + .innerRadius(radius - chartInset - barWidth) + .startAngle(arcStartRad + startPadRad) + .endAngle(arcEndRad - endPadRad); + + var section = chart.selectAll(".arc.chart-color" + sectionIndx + ".myWave.wave-" + versionId); + + section + .data([sectionData]) + .enter() + .append("g") + .attr("class", "arc chart-color" + sectionIndx + " myWave wave-" + versionId) + .on("mouseover", mouseover) + .on("mousemove", mousemove) + .on("mouseleave", mouseleave) + .append("path") + .attr("fill", function (d) { + return dashboardColor.projectProgressColor[(sectionIndx - 1) % data.length]; + }) + .attr("stroke", "white") + .style("stroke-width", "0.4px") + .attr("d", arc); + + chart + .selectAll(".arc.chart-color" + sectionIndx + ".myWave.wave-" + versionId) + .append("text") + .attr("class", "no-select") + .text(function (d) { + return getStrLimit(d.version_name, 9); + }) + .attr("x", function (d) { + return arc.centroid(d)[0]; + }) + .attr("y", function (d) { + return arc.centroid(d)[1] + 2; + }) + .style("font-size", "10px") + .style("font-weight", "700") + .attr("text-anchor", "middle"); + } + + Needle = (function () { + function Needle(len, radius1) { + this.len = len; + this.radius = radius1; + } + + Needle.prototype.drawOn = function (el, perc) { + el.append("circle") + .attr("class", "needle-center") + .attr("cx", 0) + .attr("cy", -10) + .attr("r", this.radius) + .attr("stroke", "white") + .style("stroke-width", "0.3px"); + return el + .append("path") + .attr("class", "needle") + .attr("d", this.mkCmd(perc)) + .attr("stroke", "white") + .style("stroke-width", "0.3px"); + }; + + Needle.prototype.animateOn = function (el, perc) { + var self; + self = this; + return el + .selectAll(".needle") + .transition() + .delay(500) + .ease(d3.easeElasticOut) + .duration(3000) + .attrTween("progress", function () { + return function (percentOfPercent) { + var progress; + progress = percentOfPercent * perc; + return d3.select(".needle").attr("d", self.mkCmd(progress)); + }; + }); + }; + + Needle.prototype.mkCmd = function (perc) { + var centerX, centerY, leftX, leftY, rightX, rightY, thetaRad, topX, topY; + thetaRad = percToRad(perc / 2); + centerX = 0; + centerY = -10; + topX = centerX - this.len * Math.cos(thetaRad); + topY = centerY - this.len * Math.sin(thetaRad); + leftX = centerX - this.radius * Math.cos(thetaRad - Math.PI / 2); + leftY = centerY - this.radius * Math.sin(thetaRad - Math.PI / 2); + rightX = centerX - this.radius * Math.cos(thetaRad + Math.PI / 2); + rightY = centerY - this.radius * Math.sin(thetaRad + Math.PI / 2); + return "M " + leftX + " " + leftY + " L " + topX + " " + topY + " L " + rightX + " " + rightY; + }; + + return Needle; + })(); + + needle = new Needle(35, 3); + + needle.drawOn(chart, 0); + + needle.animateOn(chart, startDDay / totalDate); +} + +// heatmap +if (!String.prototype.formatString) { + String.prototype.formatString = function () { + var args = arguments; + return this.replace(/{(\d+)}/g, function (match, number) { + return typeof args[number] !== 'undefined' + ? args[number] + : match + ; + }); + }; +} +// If the number less than 10, add a zero before it +var prettyNumber = function (number) { + return number < 10 ? '0' + number.toString() : number = number.toString(); +}; + +var getDisplayDate = function (date_obj) { + var pretty_month = prettyNumber(date_obj.getMonth() + 1); + var pretty_date = prettyNumber(date_obj.getDate()); + return "{0}-{1}-{2}".formatString(date_obj.getFullYear(), pretty_month, pretty_date); +}; + +// Generate random number between min and max +function randomInt(min, max) { + return Math.floor(Math.random() * (max - min + 1) + min); +} + +function getRandomData(min, max, items) { + var return_object = {}; + + var entries = randomInt(min, max); + for (var i = 0; i < entries; i++) { + var day = new Date(); + + var previous_date = randomInt(0, 365); + day.setDate(day.getDate() - previous_date); + + var display_date = getDisplayDate(day); + return_object[display_date] = {}; + return_object[display_date].items = []; + var random_elements = randomInt(1,3); + for (var j=0; j < random_elements; j++) { + var random_item = items[randomInt(0,items.length-1)]; + if (!return_object[display_date].items.includes(random_item)) { + return_object[display_date].items.push(random_item); + } + } + + } + console.log(return_object); + return JSON.stringify(return_object); + +} + +function heatMapReady() { + $('#calendar_yearview_blocks_chart_1').calendar_yearview_blocks({ + //data: '{"2020-08-01": {"items": ["banana", "apple"]}, "2020-05-05": {"items": ["apple"]}, "2020-05-01": {"items": ["banana"]}, "2020-05-03": {"items": ["banana", "apple", "orange"]}, "2020-05-22": {"items": ["banana", "apple", "orange", "pear"]}}', + data: getRandomData(10, 40, ["banana", "apple", "orange", "pear"]), + start_monday: true, + always_show_tooltip: true, + month_names: ['jan', 'feb', 'maa', 'apr', 'mei', 'jun', 'jul', 'aug', 'sept', 'okt', 'nov', 'dec'], + day_names: ['ma', 'wo', 'vr', 'zo'], + colors: { + 'default': '#eeeeee', // Default color + 'apple': 'green', + 'banana': 'yellow', + 'orange': 'orange', + 'pear': 'lightgreen' + } + }); + + $('#calendar_yearview_blocks_chart_2').calendar_yearview_blocks({ + data: getRandomData(20, 80, ["rain", "sunshine", "fog", "thunder", "hail"]), + start_monday: false, + always_show_tooltip: false, + month_names: ['jan', 'feb', 'mar', 'apr', 'may', 'jun', 'jul', 'aug', 'sep', 'oct', 'nov', 'dec'], + day_names: ['mo', 'wed', 'fri'], + colors: { + 'default': '#eeeeee', // Default color + 'rain': 'lightblue', + 'sunshine': 'lightyellow', + 'fog': 'gray', + 'thunder': 'brown', + 'hail': 'white' + } + }); +} + +/* +function getRandomData(ordinal = false) { + + const NGROUPS = 6, + MAXLINES = 15, + MAXSEGMENTS = 20, + MAXCATEGORIES = 20, + MINTIME = new Date(2013,2,21); + + const nCategories = Math.ceil(Math.random()*MAXCATEGORIES), + categoryLabels = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z']; + + return [...Array(NGROUPS).keys()].map(i => ({ + group: 'group' + (i+1), + data: getGroupData() + })); + + // + + function getGroupData() { + + return [...Array(Math.ceil(Math.random()*MAXLINES)).keys()].map(i => ({ + label: 'label' + (i+1), + data: getSegmentsData() + })); + + // + + function getSegmentsData() { + const nSegments = Math.ceil(Math.random()*MAXSEGMENTS), + segMaxLength = Math.round(((new Date())-MINTIME)/nSegments); + let runLength = MINTIME; + + return [...Array(nSegments).keys()].map(i => { + const tDivide = [Math.random(), Math.random()].sort(), + start = new Date(runLength.getTime() + tDivide[0]*segMaxLength), + end = new Date(runLength.getTime() + tDivide[1]*segMaxLength); + + runLength = new Date(runLength.getTime() + segMaxLength); + + return { + timeRange: [start, end], + val: ordinal ? categoryLabels[Math.ceil(Math.random()*nCategories)] : Math.random() + //labelVal: is optional - only displayed in the labels + }; + }); + + } + } +} + +function sevenTimeline() { + const myData = getRandomData(true); + + TimelinesChart()('#sevenTimeLine') + .zScaleLabel('My Scale Units') + .zQualitative(true) + .dateMarker(new Date() - 365 * 24 * 60 * 60 * 1000) // Add a marker 1y ago + .data(myData); +}*/