mirror of
https://github.com/ail-project/ail-framework.git
synced 2024-11-26 15:57:16 +00:00
fix: [crawler] fix monthly crawled domains stats svg size
This commit is contained in:
parent
e6d70e4f7b
commit
311e6f4bd8
1 changed files with 37 additions and 35 deletions
|
@ -148,10 +148,10 @@ $(document).ready(function(){
|
||||||
chart.stackBarChart = barchart_type_stack("{{ url_for('crawler_splash.crawlers_last_domains_json') }}?type={{type}}", '#barchart_type');
|
chart.stackBarChart = barchart_type_stack("{{ url_for('crawler_splash.crawlers_last_domains_json') }}?type={{type}}", '#barchart_type');
|
||||||
chart.stackBarChartMonth = barchart_type_stack("{{ url_for('crawler_splash.crawlers_last_domains_month_json') }}?type={{type}}", '#barchart_type_month');
|
chart.stackBarChartMonth = barchart_type_stack("{{ url_for('crawler_splash.crawlers_last_domains_month_json') }}?type={{type}}", '#barchart_type_month');
|
||||||
|
|
||||||
//chart.onResize();
|
chart.onResize();
|
||||||
//$(window).on("resize", function() {
|
$(window).on("resize", function() {
|
||||||
// chart.onResize();
|
chart.onResize();
|
||||||
//});
|
});
|
||||||
|
|
||||||
$('[data-toggle="popover"]').popover({
|
$('[data-toggle="popover"]').popover({
|
||||||
placement: 'top',
|
placement: 'top',
|
||||||
|
@ -182,8 +182,8 @@ function toggle_sidebar(){
|
||||||
function barchart_type_stack(url, svg_id) {
|
function barchart_type_stack(url, svg_id) {
|
||||||
|
|
||||||
var margin = {top: 20, right: 90, bottom: 55, left: 0},
|
var margin = {top: 20, right: 90, bottom: 55, left: 0},
|
||||||
width = parseInt(d3.select(svg_id).style('width'), 10);
|
width = $(svg_id).width()
|
||||||
width = 1000 - margin.left - margin.right,
|
width = width - margin.left - margin.right,
|
||||||
height = 500 - margin.top - margin.bottom;
|
height = 500 - margin.top - margin.bottom;
|
||||||
var x = d3.scaleBand().rangeRound([0, width]).padding(0.1);
|
var x = d3.scaleBand().rangeRound([0, width]).padding(0.1);
|
||||||
|
|
||||||
|
@ -196,7 +196,7 @@ function barchart_type_stack(url, svg_id) {
|
||||||
var color = d3.scaleOrdinal(d3.schemeSet3);
|
var color = d3.scaleOrdinal(d3.schemeSet3);
|
||||||
|
|
||||||
var svg = d3.select(svg_id).append("svg")
|
var svg = d3.select(svg_id).append("svg")
|
||||||
.attr("id", "thesvg")
|
.attr("id", svg_id)
|
||||||
.attr("viewBox", "0 0 "+width+" 500")
|
.attr("viewBox", "0 0 "+width+" 500")
|
||||||
.attr("width", width + margin.left + margin.right)
|
.attr("width", width + margin.left + margin.right)
|
||||||
.attr("height", height + margin.top + margin.bottom)
|
.attr("height", height + margin.top + margin.bottom)
|
||||||
|
@ -291,7 +291,7 @@ function barchart_type_stack(url, svg_id) {
|
||||||
.attr("transform", function (d, i) { return "translate(0," + i * 20 + ")"; });
|
.attr("transform", function (d, i) { return "translate(0," + i * 20 + ")"; });
|
||||||
|
|
||||||
legend.append("rect")
|
legend.append("rect")
|
||||||
.attr("x", 943)
|
.attr("x", width)
|
||||||
.attr("width", 10)
|
.attr("width", 10)
|
||||||
.attr("height", 10)
|
.attr("height", 10)
|
||||||
.style("fill", color)
|
.style("fill", color)
|
||||||
|
@ -299,40 +299,42 @@ function barchart_type_stack(url, svg_id) {
|
||||||
|
|
||||||
legend.append("text")
|
legend.append("text")
|
||||||
.attr("class", "svgText")
|
.attr("class", "svgText")
|
||||||
.attr("x", 941)
|
.attr("x", width - 2)
|
||||||
.attr("y", 6)
|
.attr("y", 6)
|
||||||
.attr("dy", ".35em")
|
.attr("dy", ".35em")
|
||||||
.style("text-anchor", "end")
|
.style("text-anchor", "end")
|
||||||
.text(function (d) { return d; });
|
.text(function (d) { return d; });
|
||||||
}
|
}
|
||||||
|
chart.onResize = function () {
|
||||||
|
//var aspect = width / height, chart = $("#thesvg");
|
||||||
|
svg_g = $(svg_id)
|
||||||
|
var targetWidth = svg_g.parent().width();
|
||||||
|
svg_g.attr("width", targetWidth);
|
||||||
|
svg_g.attr("height", targetWidth / 2);
|
||||||
|
}
|
||||||
|
|
||||||
|
function removePopovers () {
|
||||||
|
$('.popover').each(function() {
|
||||||
|
$(this).remove();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function showPopover (d) {
|
||||||
|
$(this).popover({
|
||||||
|
title: d.name,
|
||||||
|
placement: 'top',
|
||||||
|
container: 'body',
|
||||||
|
trigger: 'manual',
|
||||||
|
html : true,
|
||||||
|
content: function() {
|
||||||
|
return d.label +
|
||||||
|
"<br/>num: " + d3.format(",")(d.value ? d.value: d.y1 - d.y0); }
|
||||||
|
});
|
||||||
|
$(this).popover('show')
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function removePopovers () {
|
|
||||||
$('.popover').each(function() {
|
|
||||||
$(this).remove();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function showPopover (d) {
|
|
||||||
$(this).popover({
|
|
||||||
title: d.name,
|
|
||||||
placement: 'top',
|
|
||||||
container: 'body',
|
|
||||||
trigger: 'manual',
|
|
||||||
html : true,
|
|
||||||
content: function() {
|
|
||||||
return d.label +
|
|
||||||
"<br/>num: " + d3.format(",")(d.value ? d.value: d.y1 - d.y0); }
|
|
||||||
});
|
|
||||||
$(this).popover('show')
|
|
||||||
}
|
|
||||||
|
|
||||||
chart.onResize = function () {
|
|
||||||
var aspect = width / height, chart = $("#thesvg");
|
|
||||||
var targetWidth = chart.parent().width();
|
|
||||||
chart.attr("width", targetWidth);
|
|
||||||
chart.attr("height", targetWidth / 2);
|
|
||||||
}
|
|
||||||
|
|
||||||
window.chart = chart;
|
window.chart = chart;
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue