Module:Chart and Module:Chart/sandbox: Difference between pages

(Difference between pages)
Jump to navigation Jump to search
Page 1
Page 2
imported>Jonesey95
fix text color in dark mode; this generally works but may cause problems, in which case revert or try specifying a different CSS value
 
imported>Pppery
No edit summary
 
Line 41: Line 41:
table.insert( tab, mw.text.tag( 'div' ) )
table.insert( tab, mw.text.tag( 'div' ) )
local list = {}
local list = {}
local spanStyle = "padding:0 1em;color:inherit;background-color:%s;border:1px solid %s;margin-right:1em;-webkit-print-color-adjust:exact;"
local spanStyle = "padding:0 1em;background-color:%s;border:1px solid %s;margin-right:1em;-webkit-print-color-adjust:exact;"
for gi = 1, #legends do
for gi = 1, #legends do
local span = mw.text.tag( 'span', { style = string.format( spanStyle, cols[gi], cols[gi] ) }, ' ' ) .. ' '..  legends[gi]
local span = mw.text.tag( 'span', { style = string.format( spanStyle, cols[gi], cols[gi] ) }, ' ' ) .. ' '..  legends[gi]
Line 48: Line 48:
table.insert( tab,
table.insert( tab,
mw.text.tag( 'ul',
mw.text.tag( 'ul',
{style="list-style:none;column-width:12em;"},
{style="width:100%;list-style:none;column-width:12em;"},
table.concat( list, '\n' )
table.concat( list, '\n' )
)
)
Line 112: Line 112:


local function createImageMap()
local function createImageMap()
addRes( '{{#tag:imagemap|', 'File:Circle frame.svg{{!}}' .. ( radius * 2 ) .. 'px' )
addRes( '{{#tag:imagemap|', 'Image:Circle frame.svg{{!}}' .. ( radius * 2 ) .. 'px' )
addRes( unpack( imslices ) )
addRes( unpack( imslices ) )
addRes( 'desc none', '}}' )
addRes( 'desc none', '}}' )
Line 232: Line 232:
if #values[gi] ~= numValues then error( keywords.group .. " " .. gi .. " does not have same number of values as " .. keywords.group .. " 1" ) end
if #values[gi] ~= numValues then error( keywords.group .. " " .. gi .. " does not have same number of values as " .. keywords.group .. " 1" ) end
end
end
if #xlegends ~= numValues then error( 'Illegal number of ' .. keywords.xlegend .. '. Should be exactly ' .. numValues .. ' not ' .. #xlegends) end
if #xlegends ~= numValues then error( 'Illegal number of ' .. keywords.xlegend .. '. Should be exactly ' .. numValues ) end
end
end


Line 314: Line 314:


local function calcHeights( gi, i, val )
local function calcHeights( gi, i, val )
local barHeight = math.max( 2, math.floor( val / yscales[gi] * chartHeight + 0.5 ) ) -- add half to make it "round" instead of "trunc", min height to 2 to avoid negative bar sizes
local barHeight = math.floor( val / yscales[gi] * chartHeight + 0.5 ) -- add half to make it "round" instead of "trunc"
local top, base = chartHeight - barHeight, 0
local top, base = chartHeight - barHeight, 0
if stack then
if stack then
for j = 1, gi - 1 do
local rawbase = 0
if tonumber(values[j][i]) > 0 then
for j = 1, gi - 1 do rawbase = rawbase + values[j][i] end -- sum the "i" value of all the groups below our group, gi.
base = base + math.max( 2, math.floor( values[j][i] / yscales[gi] * chartHeight + 0.5 ) ) -- sum the "i" value of all the groups below our group, gi, and keep the same calculation for each bar
base = math.floor( chartHeight * rawbase / yscales[gi] ) -- normally, and especially if it's "stack", all the yscales must be equal.
end
end
end
end
if barHeight < 2 then
barHeight = 2 -- Otherwise the template would try to create a bar with a negative height
end
return barHeight, top - base
return barHeight, top - base
end
end
Line 352: Line 353:


-- borders so it shows up when printing
-- borders so it shows up when printing
local style = string.format("position:absolute;left:%spx;top:%spx;height:%spx;min-width:%spx;max-width:%spx;color:inherit;background-color:%s;-webkit-print-color-adjust:exact;border:1px solid %s;border-bottom:none;overflow:hidden;",
local style = string.format("position:absolute;left:%spx;top:%spx;height:%spx;min-width:%spx;max-width:%spx;background-color:%s;-webkit-print-color-adjust:exact;border:1px solid %s;border-bottom:none;overflow:hidden;",
left, top, barHeight-1, barWidth-2, barWidth-2, color, color)
left, top, barHeight-1, barWidth-2, barWidth-2, color, color)
local link = links[gi] and links[gi][i] or ''
local link = links[gi] and links[gi][i] or ''
Line 405: Line 406:
setOffset, setWidth = groupBounds( i )
setOffset, setWidth = groupBounds( i )
-- setWidth = 0.85 * setWidth
-- setWidth = 0.85 * setWidth
table.insert( res, mw.text.tag( 'div', { style = string.format( legendDivStyleFormat, setOffset + 1, setWidth - 2, setWidth - 2 ) }, xlegends[i] or '' ) )
table.insert( res, mw.text.tag( 'div', { style = string.format( legendDivStyleFormat, setOffset + 5, setWidth - 10, setWidth - 10 ) }, xlegends[i] or '' ) )
table.insert( res, mw.text.tag( 'div', { style = string.format( tickDivstyleFormat, setOffset + setWidth / 2 ) }, '' ) )
table.insert( res, mw.text.tag( 'div', { style = string.format( tickDivstyleFormat, setOffset + setWidth / 2 ) }, '' ) )
end
end
Line 412: Line 413:


local function drawChart()
local function drawChart()
table.insert( res, mw.text.tag( 'div', { class = 'chart noresize', style = string.format( 'padding-top:10px;margin-top:1em;max-width:%spx;', width ) } ) )
table.insert( res, mw.text.tag( 'div', { class = 'chart noresize', style = string.format( 'margin-top:1em;max-width:%spx;', width ) } ) )
table.insert( res, mw.text.tag( 'div', { style = string.format("position:relative;min-height:%spx;min-width:%spx;max-width:%spx;", height, width, width ) } ) )
table.insert( res, mw.text.tag( 'div', { style = string.format("position:relative;min-height:%spx;min-width:%spx;max-width:%spx;", height, width, width ) } ) )