Test: Porovnání verzí
Skočit na navigaci
Skočit na vyhledávání
Přidaný obsah Smazaný obsah
imported>Le0 Bez shrnutí editace |
imported>Le0 (Obsah stránky nahrazen textem „https://youtu.be/_B0CyOAO8y0?t=87“) |
||
Řádek 1: | Řádek 1: | ||
https://youtu.be/_B0CyOAO8y0?t=87 |
https://youtu.be/_B0CyOAO8y0?t=87 |
||
<graph mode=interactive title="Stock Market"> |
|||
{ |
|||
"version": 2, |
|||
"width": 650, |
|||
"height": 300, |
|||
"padding": "strict", |
|||
"signals": [ |
|||
{ |
|||
"name": "indexDate", |
|||
"init": {"expr": "time('Jan 1 2005')"}, |
|||
"streams": [{ |
|||
"type": "mousemove", |
|||
"expr": "clamp(eventX(), 0, eventGroup('root').width)", |
|||
"scale": {"name": "x", "invert": true} |
|||
}] |
|||
}, |
|||
{"name": "maxDate", "init": {"expr": "time('Mar 1 2010')"}} |
|||
], |
|||
"data": [ |
|||
{ |
|||
"name": "stocks", |
|||
"url": "wikiraw:///Extension:Graph/data/stocks-csv", |
|||
"format": {"type": "csv", "parse": {"price":"number", "date":"date"}} |
|||
}, |
|||
{ |
|||
"name": "index", |
|||
"source": "stocks", |
|||
"transform": [{ |
|||
"type": "filter", |
|||
"test": "month(datum.date) == month(indexDate) && year(datum.date) == year(indexDate)" |
|||
}] |
|||
}, |
|||
{ |
|||
"name": "indexified_stocks", |
|||
"source": "stocks", |
|||
"transform": [{ |
|||
"type": "lookup", |
|||
"on": "index", "onKey": "symbol", |
|||
"keys": ["symbol"], "as": ["index_term"], |
|||
"default": {"price": 0} |
|||
}, { |
|||
"type": "formula", |
|||
"field": "indexed_price", |
|||
"expr": "datum.index_term.price > 0 ? (datum.price - datum.index_term.price)/datum.index_term.price : 0" |
|||
}] |
|||
} |
|||
], |
|||
"scales": [ |
|||
{ |
|||
"name": "x", |
|||
"type": "time", |
|||
"domain": {"data": "stocks", "field": "date"}, |
|||
"range": "width" |
|||
}, |
|||
{ |
|||
"name": "y", |
|||
"type": "linear", |
|||
"domain": {"data": "indexified_stocks", "field": "indexed_price"}, |
|||
"range": "height", |
|||
"nice": true |
|||
}, |
|||
{ |
|||
"name": "color", |
|||
"type": "ordinal", |
|||
"domain": {"data": "stocks", "field": "symbol"}, |
|||
"range": "category10" |
|||
} |
|||
], |
|||
"axes": [ |
|||
{"type": "y", "scale": "y", "grid": true, "layer": "back", "format": "%"} |
|||
], |
|||
"marks": [ |
|||
{ |
|||
"type": "group", |
|||
"from": { |
|||
"data": "indexified_stocks", |
|||
"transform": [{"type": "facet", "groupby": ["symbol"]}] |
|||
}, |
|||
"marks": [ |
|||
{ |
|||
"type": "line", |
|||
"properties": { |
|||
"update": { |
|||
"x": {"scale": "x", "field": "date"}, |
|||
"y": {"scale": "y", "field": "indexed_price"}, |
|||
"stroke": {"scale": "color", "field": "symbol"}, |
|||
"strokeWidth": {"value": 2} |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
"type": "text", |
|||
"from": { |
|||
"transform": [{"type": "filter", "test": "datum.date == maxDate"}] |
|||
}, |
|||
"properties": { |
|||
"update": { |
|||
"x": {"scale": "x", "field": "date", "offset": 2}, |
|||
"y": {"scale": "y", "field": "indexed_price"}, |
|||
"fill": {"scale": "color", "field": "symbol"}, |
|||
"text": {"field": "symbol"}, |
|||
"baseline": {"value": "middle"} |
|||
} |
|||
} |
|||
} |
|||
] |
|||
}, |
|||
{ |
|||
"type":"rule", |
|||
"properties": { |
|||
"update": { |
|||
"x": {"field": {"group": "x"}}, |
|||
"x2": {"field": {"group": "width"}}, |
|||
"y": {"scale": "y", "value": 0}, |
|||
"stroke": {"value": "black"}, |
|||
"strokeWidth": {"value": 1} |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
"type":"rule", |
|||
"properties": { |
|||
"update": { |
|||
"x": {"scale": "x", "signal": "indexDate"}, |
|||
"y": {"value": 0}, |
|||
"y2": {"field": {"group": "height"}}, |
|||
"stroke": {"value": "red"} |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
"type":"text", |
|||
"properties": { |
|||
"update": { |
|||
"x": {"scale": "x", "signal": "indexDate"}, |
|||
"y2": {"field": {"group": "height"}, "offset": 15}, |
|||
"align": {"value": "center"}, |
|||
"text": {"template": "\u007B{indexDate | time: '%b %Y'}}"}, |
|||
"fill": {"value": "red"} |
|||
} |
|||
} |
|||
} |
|||
] |
|||
} |
|||
</graph> |