@domoinc/multiline-chart
Version:
MultiLineChart - Domo Widget
127 lines (106 loc) • 2.56 kB
Markdown
## Example
```js
var aHeight = 400;
var aWidth = 400;
// var ascale = d3.scale.ordinal().domain(d3.range(0, 1000)).rangePoints([0,aWidth], 0);
// var ascale = d3.scale.linear().domain([-1000, 1000]).range([0, aWidth]);
var ascale = d3.time.scale().domain([new Date('2014-01-11'), new Date('2014-12-29')]).range([0,500]);
// var ascale = d3.scale.ordinal().domain(['A','B','C']).rangeRoundBands([0, aWidth], 0.25);
//Initialze the widget
var chart = d3.select("#vis")
.append("svg")
.attr('width', 500)
.attr('height', 500)
.append("g")
.attr("transform", "translate(50,250)")
.chart("Axis")
.c({
'width': aWidth,
'height': aHeight,
'scale': ascale,
//'addGridlines': true,
// 'addGridlines': false,
//'addZeroline': true,
// 'addZeroline': false,
//'addTicks': true,
// 'addTicks': false,
//'addBaseline': true,
// 'addBaseline': false,
//'tickSize': 5,
// 'orient': 'top',
'orient': 'bottom',
// 'orient': 'top',
// 'orient': 'right',
showTooltip: true,
})
//Render the chart with data
chart._notifier.showMessage(true);
chart.draw();
// var orient = 'top';
// var orient = 'bottom';
// var orient = 'left';
var orient = 'right';
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': false,
// 'addZeroline': true,
// 'addTicks': true,
// })
// chart.draw();
// }, 500)
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': true,
// 'addZeroline': false,
// 'addTicks': true,
// })
// chart.draw();
// }, 500)
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': true,
// 'addZeroline': true,
// 'addTicks': false,
// })
// chart.draw();
// }, 500)
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': false,
// 'addZeroline': false,
// 'addTicks': true,
// })
// chart.draw();
// }, 500)
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': true,
// 'addZeroline': false,
// 'addTicks': false,
// })
// chart.draw();
// }, 500)
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': false,
// 'addZeroline': true,
// 'addTicks': false,
// })
// chart.draw();
// }, 500)
// setTimeout(function() {
// chart.c({
// 'orient': orient,
// 'addGridlines': false,
// 'addZeroline': false,
// 'addTicks': false,
// })
// chart.draw();
// }, 500)
```