1
PlotlyJS
을 사용하여 차트를 작성하고 있습니다.JS 플롯 홀수 마진 상단
사람이 어떻게이 문제를 해결하는 방법을 말해 줄래 : 그러나 내 수평 막대 차트 상단에 몇 가지 이상한 패딩/여유가?
기본 값을 코드는
angular.module('Chart').directive('advancedChart', function (seriesGenerator) {
return {
restrict: 'E',
template: '<div> </div>',
scope: {
chartData: '=',
valueKey: '@',
labelKey: '@',
orientation: '@',
seriesType: '@',
shapes: '=',
customSeries: '=',
seriesKey: '@',
labelFilter: '@',
labelGroup: '@',
callback: '=',
customSize: '='
},
replace: true,
link: function (scope, element, attr) {
var plotElement = element[0];
var myPlot = document.getElementById('uniqueId');
var layout = {};
if (scope.customSize) {
var height = scope.chartData.length * 50;
layout = {
height: height
}
}
if (!scope.orientation) {
scope.orientation = 'v';
}
if (!scope.seriesKey) {
scope.seriesKey = scope.labelKey;
}
seriesGenerator.generateAdvancedPlotlySeries(scope.chartData, scope.labelKey, scope.valueKey, scope.seriesType, scope.orientation, scope.seriesKey, scope.labelFilter, scope.labelGroup)
.then(function (result) {
if (scope.shapes) {
layout.shapes = scope.shapes;
}
layout.margin = {
l:250,
};
layout.showlegend = false;
if (scope.customSeries) {
result = result.concat(scope.customSeries);
}
createChart(result);
});
function createChart(charData) {
Plotly.newPlot(plotElement, charData, layout);
plotElement.on('plotly_click', function (data) {
if (scope.callback != null) {
var returnData = {
y: data.points[0].y,
x: data.points[0].x
};
scope.callback(returnData);
}
console.log('y: ' + data.points[0].y + ' ' + 'x:' + data.points[0].x);
});
}
window.onresize = function() {
var update = {
width: element.parent().width();
};
Plotly.relayout(plotElement, update);
};
}
}
});
코드없이 도움을 줄 수 없습니까? 그렇습니다. –
@GerardoFurtado il 제 질문에 코드를 추가하십시오 –