blob42
/
nvd3
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'master' of git://github.com/novus/nvd3 into multiChart

Browse Source
master-patched
Steven Noble 12 years ago
parent 4507e22d37 9deb24f0f2
commit d6789c0caa
44 changed files with 1536 additions and 1217 deletions
Show Stats Download Patch File Download Diff File

1
examples/discreteBarChart.html
Unescape Escape View File

@ -40,6 +40,7 @@ svg {
<script src="../nv.d3.js"></script>
<!-- including all the components so I don't have to minify every time I test in development -->
<script src="../src/tooltip.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/models/axis.js"></script>
<script src="../src/models/discreteBar.js"></script>
<script src="../src/models/discreteBarChart.js"></script>

1
examples/historicalBar.html
Unescape Escape View File

@ -19,6 +19,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/models/historicalBar.js"></script>
<script src="../src/utils.js"></script>
<script>

1
examples/linePlusBarChart.html
Unescape Escape View File

@ -34,6 +34,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/tooltip.js"></script>
<script src="../src/models/legend.js"></script>
<script src="../src/models/axis.js"></script>

1
examples/multiBarChart.html
Unescape Escape View File

@ -35,6 +35,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/tooltip.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/models/legend.js"></script>
<script src="../src/models/axis.js"></script>
<script src="../src/models/multiBar.js"></script>

1
examples/multiBarHorizontalChart.html
Unescape Escape View File

@ -37,6 +37,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/tooltip.js"></script>
<script src="../src/models/legend.js"></script>
<script src="../src/models/axis.js"></script>

1
examples/pieChart.html
Unescape Escape View File

@ -22,6 +22,7 @@ text {
<script src="../src/models/legend.js"></script>
<script src="../src/models/pie.js"></script>
<script src="../src/models/pieChart.js"></script>
<script src="../src/utils.js"></script>
<script>
var testdata = [

1
examples/scatterChart.html
Unescape Escape View File

@ -50,6 +50,7 @@ div {
<script src="../lib/fisheye.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/tooltip.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/models/legend.js"></script>
<script src="../src/models/axis.js"></script>
<script src="../src/models/distribution.js"></script>

1
examples/sparkline.html
Unescape Escape View File

@ -25,6 +25,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/models/sparkline.js"></script>
<script src="../src/utils.js"></script>
<script>
//Format A

1
examples/sparklineplus.html → examples/sparklinePlus.html
Unescape Escape View File

@ -24,6 +24,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/models/sparkline.js"></script>
<script src="../src/models/sparklinePlus.js"></script>
<script>

16
examples/stackedAreaChart.html
Unescape Escape View File

@ -30,6 +30,7 @@ text {
<script src="../lib/d3.v2.js"></script>
<script src="../nv.d3.js"></script>
<script src="../src/utils.js"></script>
<script src="../src/models/axis.js"></script>
<script src="../src/tooltip.js"></script>
<script src="../src/models/legend.js"></script>
@ -132,14 +133,14 @@ var histcatexplong = [
var histcatexpshort = [
{
"key" : "Consumer Discretionary" ,
"values" : [ [ 1138683600000 , -0.62238434102863] , [ 1141102800000 , -0.61484565039024] , [ 1143781200000 , -1.0769367918668] , [ 1146369600000 , -1.2221156604129] , [ 1149048000000 , -1.2434858263377] , [ 1151640000000 , -0.58606435489597] , [ 1154318400000 , -0.61478911495141] , [ 1156996800000 , -0.61429362688591] , [ 1159588800000 , -1.1168614112788] , [ 1162270800000 , -1.1510268716612] , [ 1164862800000 , -1.1104724164222] , [ 1167541200000 , -1.2298338563471] , [ 1170219600000 , -1.5053664389104] , [ 1172638800000 , -1.5535266372193] , [ 1175313600000 , -3.1690472535854] , [ 1177905600000 , -3.1273013967041] , [ 1180584000000 , -3.155466271777] , [ 1183176000000 , -3.7158562579437] , [ 1185854400000 , -3.8244546635586] , [ 1188532800000 , -3.5524464859972] , [ 1191124800000 , -3.0472339109128] , [ 1193803200000 , -3.064978140815] , [ 1196398800000 , -3.0818130124986] , [ 1199077200000 , -2.9806791138312] , [ 1201755600000 , -3.7360958775824] , [ 1204261200000 , -3.4687841733263] , [ 1206936000000 , -3.3702018615806] , [ 1209528000000 , -3.1982756208679] , [ 1212206400000 , -3.0489433155104] , [ 1214798400000 , -3.7008275605963] , [ 1217476800000 , -3.8980507260892] , [ 1220155200000 , -3.7680083260241] , [ 1222747200000 , -3.2061890012391] , [ 1225425600000 , -2.6727551440484] , [ 1228021200000 , -2.4469327462935] , [ 1230699600000 , -3.0192419668784] , [ 1233378000000 , -2.892958553476] , [ 1235797200000 , -3.1153570053479] , [ 1238472000000 , -2.9927580570711] , [ 1241064000000 , -3.5061796706294] , [ 1243742400000 , -3.2944159516725] , [ 1246334400000 , -3.4154213240617] , [ 1249012800000 , -3.6492125438171] , [ 1251691200000 , -3.6674164998394] , [ 1254283200000 , -4.6271484977727] , [ 1256961600000 , -4.2433407292676] , [ 1259557200000 , -4.4742625247274] , [ 1262235600000 , -5.2078214612359] , [ 1264914000000 , -5.2209579214469] , [ 1267333200000 , -5.4596395756061] , [ 1270008000000 , -5.6906459276584] , [ 1272600000000 , -6.4981737808665] , [ 1275278400000 , -6.2563044048578] , [ 1277870400000 , -6.175479487959] , [ 1280548800000 , -6.6641002427295] , [ 1283227200000 , -6.3648667745556] , [ 1285819200000 , -5.0270168607884] , [ 1288497600000 , -5.1186072976233] , [ 1291093200000 , -5.1127601587872] , [ 1293771600000 , -5.3015262972641] , [ 1296450000000 , -4.4295728671596] , [ 1298869200000 , -4.5488139745696] , [ 1301544000000 , -2.9021260315957] , [ 1304136000000 , -3.1482096241139] , [ 1306814400000 , -2.8648831814763] , [ 1309406400000 , -2.8149423433441] , [ 1312084800000 , -2.6350669145713] , [ 1314763200000 , -5.9871754759038] , [ 1317355200000 , -8.6127555816399] , [ 1320033600000 , -7.0712887348892] , [ 1322629200000 , -7.3930257999857] , [ 1325307600000 , -6.5183071556304] , [ 1327986000000 , -7.4388913793503] , [ 1330491600000 , -8.2134465182649] , [ 1333166400000 , -7.7836036697105] , [ 1335758400000 , -8.0955053683936] , [ 1338436800000 , -8.0981845818893]]
} ,
{
"key" : "Consumer Staples" ,
"values" : [ [ 1138683600000 , 0] , [ 1141102800000 , 0] , [ 1143781200000 , 0] , [ 1146369600000 , 0] , [ 1149048000000 , 0] , [ 1151640000000 , 0] , [ 1154318400000 , 0] , [ 1156996800000 , 0] , [ 1159588800000 , 0] , [ 1162270800000 , 0] , [ 1164862800000 , 0] , [ 1167541200000 , -0.24102139376003] , [ 1170219600000 , -0.69960584365035] , [ 1172638800000 , -0.67365051426185] , [ 1175313600000 , 0] , [ 1177905600000 , 0] , [ 1180584000000 , 0] , [ 1183176000000 , -0.31429312464988] , [ 1185854400000 , -0.90018700397153] , [ 1188532800000 , -0.96926214328714] , [ 1191124800000 , -1.1343386468131] , [ 1193803200000 , -1.1335426595455] , [ 1196398800000 , -1.2327663032424] , [ 1199077200000 , -0.41027135492155] , [ 1201755600000 , -0.41779167524802] , [ 1204261200000 , -0.38133883625885] , [ 1206936000000 , 0] , [ 1209528000000 , -0.32550520320253] , [ 1212206400000 , -0.33185144615505] , [ 1214798400000 , -0.68609668877894] , [ 1217476800000 , -0.70001207744308] , [ 1220155200000 , -0.68378680840919] , [ 1222747200000 , -0.40908783182034] , [ 1225425600000 , -0.39074266525646] , [ 1228021200000 , -0.40358490474562] , [ 1230699600000 , -0.85752207262267] , [ 1233378000000 , -0.74395750438805] , [ 1235797200000 , -0.70718832429489] , [ 1238472000000 , -0.76244465406965] , [ 1241064000000 , -0.67618572591984] , [ 1243742400000 , -0.67649596761402] , [ 1246334400000 , -0.94618002703247] , [ 1249012800000 , -0.95408485581014] , [ 1251691200000 , -0.96272139504276] , [ 1254283200000 , 0] , [ 1256961600000 , 0] , [ 1259557200000 , 0] , [ 1262235600000 , 0] , [ 1264914000000 , 0] , [ 1267333200000 , 0] , [ 1270008000000 , -0.25516420149471] , [ 1272600000000 , -0.24106264576017] , [ 1275278400000 , -0.22802547751448] , [ 1277870400000 , -0.62187524046697] , [ 1280548800000 , -0.72155608677106] , [ 1283227200000 , -0.70221659944774] , [ 1285819200000 , -1.1117002584543] , [ 1288497600000 , -1.190911001336] , [ 1291093200000 , -1.1781082003972] , [ 1293771600000 , -1.2125860264875] , [ 1296450000000 , -1.7748010365657] , [ 1298869200000 , -1.8919594178596] , [ 1301544000000 , -1.7077946421533] , [ 1304136000000 , -2.024238803094] , [ 1306814400000 , -1.9769844081819] , [ 1309406400000 , -2.0730275464065] , [ 1312084800000 , -1.9690128240888] , [ 1314763200000 , -5.5557852269348] , [ 1317355200000 , -7.2527933190641] , [ 1320033600000 , -5.7367677053109] , [ 1322629200000 , -6.0409316206662] , [ 1325307600000 , -4.6511525539195] , [ 1327986000000 , -4.526116059083] , [ 1330491600000 , -4.846292325197] , [ 1333166400000 , -2.2663198779425] , [ 1335758400000 , -2.4172072568564] , [ 1338436800000 , -2.3204729601189]]
} ,
{
"key" : "Consumer Discretionary" ,
"values" : [ [ 1138683600000 , -0.62238434102863] , [ 1141102800000 , -0.61484565039024] , [ 1143781200000 , -1.0769367918668] , [ 1146369600000 , -1.2221156604129] , [ 1149048000000 , -1.2434858263377] , [ 1151640000000 , -0.58606435489597] , [ 1154318400000 , -0.61478911495141] , [ 1156996800000 , -0.61429362688591] , [ 1159588800000 , -1.1168614112788] , [ 1162270800000 , -1.1510268716612] , [ 1164862800000 , -1.1104724164222] , [ 1167541200000 , -1.2298338563471] , [ 1170219600000 , -1.5053664389104] , [ 1172638800000 , -1.5535266372193] , [ 1175313600000 , -3.1690472535854] , [ 1177905600000 , -3.1273013967041] , [ 1180584000000 , -3.155466271777] , [ 1183176000000 , -3.7158562579437] , [ 1185854400000 , -3.8244546635586] , [ 1188532800000 , -3.5524464859972] , [ 1191124800000 , -3.0472339109128] , [ 1193803200000 , -3.064978140815] , [ 1196398800000 , -3.0818130124986] , [ 1199077200000 , -2.9806791138312] , [ 1201755600000 , -3.7360958775824] , [ 1204261200000 , -3.4687841733263] , [ 1206936000000 , -3.3702018615806] , [ 1209528000000 , -3.1982756208679] , [ 1212206400000 , -3.0489433155104] , [ 1214798400000 , -3.7008275605963] , [ 1217476800000 , -3.8980507260892] , [ 1220155200000 , -3.7680083260241] , [ 1222747200000 , -3.2061890012391] , [ 1225425600000 , -2.6727551440484] , [ 1228021200000 , -2.4469327462935] , [ 1230699600000 , -3.0192419668784] , [ 1233378000000 , -2.892958553476] , [ 1235797200000 , -3.1153570053479] , [ 1238472000000 , -2.9927580570711] , [ 1241064000000 , -3.5061796706294] , [ 1243742400000 , -3.2944159516725] , [ 1246334400000 , -3.4154213240617] , [ 1249012800000 , -3.6492125438171] , [ 1251691200000 , -3.6674164998394] , [ 1254283200000 , -4.6271484977727] , [ 1256961600000 , -4.2433407292676] , [ 1259557200000 , -4.4742625247274] , [ 1262235600000 , -5.2078214612359] , [ 1264914000000 , -5.2209579214469] , [ 1267333200000 , -5.4596395756061] , [ 1270008000000 , -5.6906459276584] , [ 1272600000000 , -6.4981737808665] , [ 1275278400000 , -6.2563044048578] , [ 1277870400000 , -6.175479487959] , [ 1280548800000 , -6.6641002427295] , [ 1283227200000 , -6.3648667745556] , [ 1285819200000 , -5.0270168607884] , [ 1288497600000 , -5.1186072976233] , [ 1291093200000 , -5.1127601587872] , [ 1293771600000 , -5.3015262972641] , [ 1296450000000 , -4.4295728671596] , [ 1298869200000 , -4.5488139745696] , [ 1301544000000 , -2.9021260315957] , [ 1304136000000 , -3.1482096241139] , [ 1306814400000 , -2.8648831814763] , [ 1309406400000 , -2.8149423433441] , [ 1312084800000 , -2.6350669145713] , [ 1314763200000 , -5.9871754759038] , [ 1317355200000 , -8.6127555816399] , [ 1320033600000 , -7.0712887348892] , [ 1322629200000 , -7.3930257999857] , [ 1325307600000 , -6.5183071556304] , [ 1327986000000 , -7.4388913793503] , [ 1330491600000 , -8.2134465182649] , [ 1333166400000 , -7.7836036697105] , [ 1335758400000 , -8.0955053683936] , [ 1338436800000 , -8.0981845818893]]
} ,
{
"key" : "Energy" ,
"values" : [ [ 1138683600000 , -0.95707527558303] , [ 1141102800000 , -0.78324346694487] , [ 1143781200000 , -1.2905241058019] , [ 1146369600000 , -1.3880880486779] , [ 1149048000000 , -1.3337247185993] , [ 1151640000000 , -1.0342112071924] , [ 1154318400000 , -1.1264764100183] , [ 1156996800000 , -1.0001002640852] , [ 1159588800000 , -0.85341153093953] , [ 1162270800000 , -0.88452017844596] , [ 1164862800000 , -0.84305725300642] , [ 1167541200000 , -1.0874455682301] , [ 1170219600000 , -1.1714969043168] , [ 1172638800000 , -1.1445856467934] , [ 1175313600000 , -1.1928513334073] , [ 1177905600000 , -1.2365691634265] , [ 1180584000000 , -1.2690940962478] , [ 1183176000000 , -1.662233774695] , [ 1185854400000 , -1.745760538781] , [ 1188532800000 , -1.5209200931271] , [ 1191124800000 , -1.7874791820886] , [ 1193803200000 , -1.7755668105117] , [ 1196398800000 , -1.5456069064618] , [ 1199077200000 , -1.7077541586335] , [ 1201755600000 , -1.6462081650757] , [ 1204261200000 , -1.8624735339628] , [ 1206936000000 , -0.71073453533048] , [ 1209528000000 , -0.75380709640219] , [ 1212206400000 , -0.71020554911716] , [ 1214798400000 , -1.2077850914504] , [ 1217476800000 , -1.0505576787644] , [ 1220155200000 , -0.97804595164878] , [ 1222747200000 , -0.34591294663671] , [ 1225425600000 , -0.19958331514025] , [ 1228021200000 , -0.17599782216296] , [ 1230699600000 , -0.49577714121027] , [ 1233378000000 , -0.51644059173978] , [ 1235797200000 , -0.48576859637083] , [ 1238472000000 , -0.75596531126452] , [ 1241064000000 , -0.72073358315801] , [ 1243742400000 , -0.82125996732294] , [ 1246334400000 , -1.4933216860121] , [ 1249012800000 , -1.5003760525933] , [ 1251691200000 , -1.4744921420596] , [ 1254283200000 , -1.8197844060652] , [ 1256961600000 , -1.6558574419626] , [ 1259557200000 , -1.7256149254159] , [ 1262235600000 , -2.7667194124217] , [ 1264914000000 , -2.9113351806903] , [ 1267333200000 , -3.0172806042796] , [ 1270008000000 , -2.8607175559701] , [ 1272600000000 , -2.629226972169] , [ 1275278400000 , -2.1855196883832] , [ 1277870400000 , 0] , [ 1280548800000 , 0] , [ 1283227200000 , 0] , [ 1285819200000 , -1.3788733828844] , [ 1288497600000 , -1.4136792139765] , [ 1291093200000 , -1.5176522942901] , [ 1293771600000 , -1.5776651933208] , [ 1296450000000 , -1.7171675182182] , [ 1298869200000 , -1.8121885250566] , [ 1301544000000 , -1.2221934283206] , [ 1304136000000 , -1.2910715239439] , [ 1306814400000 , -1.1492301612576] , [ 1309406400000 , -1.0613891302841] , [ 1312084800000 , -0.99605193205308] , [ 1314763200000 , -1.7324212072278] , [ 1317355200000 , -1.5226856867477] , [ 1320033600000 , -1.3159138896549] , [ 1322629200000 , -1.3925952659299] , [ 1325307600000 , -1.59624913621] , [ 1327986000000 , -1.5235879880296] , [ 1330491600000 , -1.7315573519279] , [ 1333166400000 , -0.86883431220926] , [ 1335758400000 , -0.90144871282829] , [ 1338436800000 , -0.7010492182517]]
@ -183,11 +184,17 @@ var histcatexpshort = [
});
*/
//an example of harmonizing colors between visualizations
//observe that Consumer Discretionary and Consumer Staples have
//been flipped in the second chart
var colors = d3.scale.category20();
keyColor = function(d, i) {return colors(d.key)};
nv.addGraph(function() {
var chart = nv.models.stackedAreaChart()
.x(function(d) { return d[0] })
.y(function(d) { return d[1] })
.color(keyColor)
//.clipEdge(true);
chart.xAxis
@ -209,6 +216,7 @@ nv.addGraph(function() {
var chart = nv.models.stackedAreaChart()
.x(function(d) { return d[0] })
.y(function(d) { return d[1] })
.color(keyColor)
//.clipEdge(true);
chart.xAxis

1170
nv.d3.js
View File

File diff suppressed because it is too large Load Diff

8
nv.d3.min.js vendored
View File

File diff suppressed because one or more lines are too long

32
src/models/axis.js
Unescape Escape View File

@ -19,8 +19,8 @@ nv.models.axis = function() {
selection.each(function(data) {
var container = d3.select(this);
var wrap = container.selectAll('g.wrap.axis').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap axis');
var wrap = container.selectAll('g.nv-wrap.nv-axis').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-axis');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g')
@ -35,21 +35,21 @@ nv.models.axis = function() {
scale0 = scale0 || axis.scale();
var axisLabel = g.selectAll('text.axislabel')
var axisLabel = g.selectAll('text.nv-axislabel')
.data([axisLabelText || null]);
axisLabel.exit().remove();
switch (axis.orient()) {
case 'top':
axisLabel.enter().append('text').attr('class', 'axislabel')
axisLabel.enter().append('text').attr('class', 'nv-axislabel')
.attr('text-anchor', 'middle')
.attr('y', 0);
var w = (scale.range().length==2) ? scale.range()[1] : (scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]));
axisLabel
.attr('x', w/2);
if (showMaxMin) {
var axisMaxMin = wrap.selectAll('g.axisMaxMin')
var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
.data(scale.domain());
axisMaxMin.enter().append('g').attr('class', 'axisMaxMin').append('text');
axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text');
axisMaxMin.exit().remove();
axisMaxMin
.attr('transform', function(d,i) {
@ -69,16 +69,16 @@ nv.models.axis = function() {
}
break;
case 'bottom':
axisLabel.enter().append('text').attr('class', 'axislabel')
axisLabel.enter().append('text').attr('class', 'nv-axislabel')
.attr('text-anchor', 'middle')
.attr('y', 30);
var w = (scale.range().length==2) ? scale.range()[1] : (scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]));
axisLabel
.attr('x', w/2);
if (showMaxMin) {
var axisMaxMin = wrap.selectAll('g.axisMaxMin')
var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
.data(scale.domain());
axisMaxMin.enter().append('g').attr('class', 'axisMaxMin').append('text');
axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text');
axisMaxMin.exit().remove();
axisMaxMin
.attr('transform', function(d,i) {
@ -98,16 +98,16 @@ nv.models.axis = function() {
}
break;
case 'right':
axisLabel.enter().append('text').attr('class', 'axislabel')
axisLabel.enter().append('text').attr('class', 'nv-axislabel')
.attr('text-anchor', rotateYLabel ? 'middle' : 'begin')
.attr('transform', rotateYLabel ? 'rotate(90)' : '')
.attr('y', rotateYLabel ? (-Math.max(margin.right,width) - 12) : -10); //TODO: consider calculating this based on largest tick width... OR at least expose this on chart
axisLabel
.attr('x', rotateYLabel ? (scale.range()[0] / 2) : axis.tickPadding());
if (showMaxMin) {
var axisMaxMin = wrap.selectAll('g.axisMaxMin')
var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
.data(scale.domain());
axisMaxMin.enter().append('g').attr('class', 'axisMaxMin').append('text')
axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text')
.style('opacity', 0);
axisMaxMin.exit().remove();
axisMaxMin
@ -131,16 +131,16 @@ nv.models.axis = function() {
}
break;
case 'left':
axisLabel.enter().append('text').attr('class', 'axislabel')
axisLabel.enter().append('text').attr('class', 'nv-axislabel')
.attr('text-anchor', rotateYLabel ? 'middle' : 'end')
.attr('transform', rotateYLabel ? 'rotate(-90)' : '')
.attr('y', rotateYLabel ? (-Math.max(margin.left,width) + 12) : -10); //TODO: consider calculating this based on largest tick width... OR at least expose this on chart
axisLabel
.attr('x', rotateYLabel ? (-scale.range()[0] / 2) : -axis.tickPadding());
if (showMaxMin) {
var axisMaxMin = wrap.selectAll('g.axisMaxMin')
var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
.data(scale.domain());
axisMaxMin.enter().append('g').attr('class', 'axisMaxMin').append('text')
axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text')
.style('opacity', 0);
axisMaxMin.exit().remove();
axisMaxMin
@ -183,7 +183,7 @@ nv.models.axis = function() {
if (showMaxMin && (axis.orient() === 'top' || axis.orient() === 'bottom')) {
var maxMinRange = [];
wrap.selectAll('g.axisMaxMin')
wrap.selectAll('g.nv-axisMaxMin')
.each(function(d,i) {
if (i) // i== 1, max position
maxMinRange.push(scale(d) - this.getBBox().width - 4) //assuming the max and min labels are as wide as the next tick (with an extra 4 pixels just in case)

20
src/models/bullet.js
Unescape Escape View File

@ -26,8 +26,8 @@ nv.models.bullet = function() {
measurez = measures.call(this, d, i).slice().sort(d3.descending);
var wrap = d3.select(this).selectAll('g.wrap.bullet').data([d]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 bullet');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-bullet').data([d]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-bullet');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g')
@ -71,11 +71,11 @@ nv.models.bullet = function() {
// Update the range rects.
var range = g.selectAll('rect.range')
var range = g.selectAll('rect.nv-range')
.data(rangez);
range.enter().append('rect')
.attr('class', function(d, i) { return 'range s' + i; })
.attr('class', function(d, i) { return 'nv-range nv-s' + i; })
.attr('width', w0)
.attr('height', availableHeight)
.attr('x', reverse ? x0 : 0)
@ -100,11 +100,11 @@ nv.models.bullet = function() {
// Update the measure rects.
var measure = g.selectAll('rect.measure')
var measure = g.selectAll('rect.nv-measure')
.data(measurez);
measure.enter().append('rect')
.attr('class', function(d, i) { return 'measure s' + i; })
.attr('class', function(d, i) { return 'nv-measure nv-s' + i; })
.attr('width', w0)
.attr('height', availableHeight / 3)
.attr('x', reverse ? x0 : 0)
@ -132,22 +132,22 @@ nv.models.bullet = function() {
// Update the marker lines.
var marker = g.selectAll('path.markerTriangle')
var marker = g.selectAll('path.nv-markerTriangle')
.data(markerz);
var h3 = availableHeight / 6;
marker.enter().append('path')
.attr('class', 'markerTriangle')
.attr('class', 'nv-markerTriangle')
.attr('transform', function(d) { return 'translate(' + x0(d) + ',' + (availableHeight / 2) + ')' })
.attr('d', 'M0,' + h3 + 'L' + h3 + ',' + (-h3) + ' ' + (-h3) + ',' + (-h3) + 'Z')
.on('mouseover', function(d,i) {
.on('mouseover', function(d,i) {
dispatch.elementMouseover({
value: d,
label: 'Previous',
pos: [x1(d), availableHeight/2]
})
})
.on('mouseout', function(d,i) {
.on('mouseout', function(d,i) {
dispatch.elementMouseout({
value: d,
label: 'Previous'

20
src/models/bulletChart.js
Unescape Escape View File

@ -49,12 +49,12 @@ nv.models.bulletChart = function() {
markerz = markers.call(this, d, i).slice().sort(d3.descending),
measurez = measures.call(this, d, i).slice().sort(d3.descending);
var wrap = container.selectAll('g.wrap.bulletChart').data([d]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 bulletChart');
var wrap = container.selectAll('g.nv-wrap.nv-bulletChart').data([d]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-bulletChart');
var gEnter = wrapEnter.append('g');
gEnter.append('g').attr('class', 'bulletWrap');
gEnter.append('g').attr('class', 'titles');
gEnter.append('g').attr('class', 'nv-bulletWrap');
gEnter.append('g').attr('class', 'nv-titles');
var g = wrap.select('g')
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
@ -96,15 +96,15 @@ nv.models.bulletChart = function() {
w1 = function(d) { return Math.abs(x1(d) - x1(0)) };
var title = g.select('.titles').append("g")
var title = g.select('.nv-titles').append("g")
.attr("text-anchor", "end")
.attr("transform", "translate(-6," + (height - margin.top - margin.bottom) / 2 + ")");
title.append("text")
.attr("class", "title")
.attr("class", "nv-title")
.text(function(d) { return d.title; });
title.append("text")
.attr("class", "subtitle")
.attr("class", "nv-subtitle")
.attr("dy", "1em")
.text(function(d) { return d.subtitle; });
@ -114,7 +114,7 @@ nv.models.bulletChart = function() {
.width(availableWidth)
.height(availableHeight)
var bulletWrap = g.select('.bulletWrap')
var bulletWrap = g.select('.nv-bulletWrap')
//.datum(data);
d3.transition(bulletWrap).call(bullet);
@ -125,14 +125,14 @@ nv.models.bulletChart = function() {
var format = tickFormat || x1.tickFormat(8);
// Update the tick groups.
var tick = g.selectAll('g.tick')
var tick = g.selectAll('g.nv-tick')
.data(x1.ticks(8), function(d) {
return this.textContent || format(d);
});
// Initialize the ticks with the old scale, x0.
var tickEnter = tick.enter().append('g')
.attr('class', 'tick')
.attr('class', 'nv-tick')
.attr('transform', function(d) { return 'translate(' + x0(d) + ',0)' })
.style('opacity', 1e-6);

48
src/models/cumulativeLineChart.js
Unescape Escape View File

@ -5,9 +5,9 @@ nv.models.cumulativeLineChart = function() {
// Public Variables with Default Settings
//------------------------------------------------------------
var margin = {top: 30, right: 20, bottom: 50, left: 60},
color = d3.scale.category20().range(),
width = null,
var margin = {top: 30, right: 30, bottom: 50, left: 60},
color = nv.utils.getColor(),
width = null,
height = null,
showLegend = true,
tooltips = true,
@ -74,7 +74,7 @@ nv.models.cumulativeLineChart = function() {
function chart(selection) {
selection.each(function(data) {
var container = d3.select(this).classed('chart-' + id, true),
var container = d3.select(this).classed('nv-chart-' + id, true),
that = this;
var availableWidth = (width || parseInt(container.style('width')) || 960)
@ -94,14 +94,14 @@ nv.models.cumulativeLineChart = function() {
var data = indexify(index.i, data);
var wrap = container.selectAll('g.wrap.cumulativeLine').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 cumulativeLine').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-cumulativeLine').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-cumulativeLine').append('g');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'linesWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-linesWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
var g = wrap.select('g');
@ -110,7 +110,7 @@ nv.models.cumulativeLineChart = function() {
if (showLegend) {
legend.width(availableWidth);
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -120,14 +120,14 @@ nv.models.cumulativeLineChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(0,' + (-margin.top) +')')
}
if (showRescaleToggle) {
controls.width(140).color(['#444', '#444', '#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
@ -141,7 +141,7 @@ nv.models.cumulativeLineChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
@ -149,15 +149,15 @@ nv.models.cumulativeLineChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var linesWrap = g.select('.linesWrap')
var linesWrap = g.select('.nv-linesWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(linesWrap).call(lines);
var indexLine = linesWrap.selectAll('.indexLine')
var indexLine = linesWrap.selectAll('.nv-indexLine')
.data([index]);
indexLine.enter().append('rect').attr('class', 'indexLine')
indexLine.enter().append('rect').attr('class', 'nv-indexLine')
.attr('width', 3)
.attr('x', -2)
.attr('fill', 'red')
@ -175,9 +175,9 @@ nv.models.cumulativeLineChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
@ -186,7 +186,7 @@ nv.models.cumulativeLineChart = function() {
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
@ -211,7 +211,7 @@ nv.models.cumulativeLineChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -299,8 +299,8 @@ nv.models.cumulativeLineChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

22
src/models/discreteBar.js
Unescape Escape View File

@ -14,7 +14,7 @@ nv.models.discreteBar = function() {
getX = function(d) { return d.x },
getY = function(d) { return d.y },
forceY = [0], // 0 is forced by default.. this makes sense for the majority of bar graphs... user can always do chart.forceY([]) to remove
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
showValues = false,
valueFormat = d3.format(',.2f'),
xDomain, yDomain;
@ -66,11 +66,11 @@ nv.models.discreteBar = function() {
y0 = y0 || y.copy().range([y(0),y(0)]);
var wrap = d3.select(this).selectAll('g.wrap.discretebar').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 discretebar');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-discretebar').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-discretebar');
var gEnter = wrapEnter.append('g');
gEnter.append('g').attr('class', 'groups');
gEnter.append('g').attr('class', 'nv-groups');
var g = wrap.select('g')
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
@ -78,7 +78,7 @@ nv.models.discreteBar = function() {
//TODO: by definition, the discrete bar should not have multiple groups, will modify/remove later
var groups = wrap.select('.groups').selectAll('.group')
var groups = wrap.select('.nv-groups').selectAll('.nv-group')
.data(function(d) { return d }, function(d) { return d.key });
groups.enter().append('g')
.style('stroke-opacity', 1e-6)
@ -88,14 +88,14 @@ nv.models.discreteBar = function() {
.style('fill-opacity', 1e-6)
.remove();
groups
.attr('class', function(d,i) { return 'group series-' + i })
.attr('class', function(d,i) { return 'nv-group nv-series-' + i })
.classed('hover', function(d) { return d.hover });
d3.transition(groups)
.style('stroke-opacity', 1)
.style('fill-opacity', .75);
var bars = groups.selectAll('g.bar')
var bars = groups.selectAll('g.nv-bar')
.data(function(d) { return d.values });
bars.exit().remove();
@ -156,8 +156,8 @@ nv.models.discreteBar = function() {
barsEnter.append('rect')
.attr('height', 0)
.attr('width', x.rangeBand() / data.length )
.style('fill', function(d,i){ return d.color || color[i % color.length] }) //this is a 'hack' to allow multiple colors in a single series... will need to rethink this methodology
.style('stroke', function(d,i){ return d.color || color[i % color.length] });
.style('fill', function(d,i){ return d.color || color(d, i) })
.style('stroke', function(d,i){ return d.color || color(d, i)});
if (showValues) {
barsEnter.append('text')
@ -171,7 +171,7 @@ nv.models.discreteBar = function() {
}
bars
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'bar negative' : 'bar positive'})
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
//.attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',0)'; })
.attr('transform', function(d,i) {
return 'translate(' + x(getX(d,i)) + ', ' + (getY(d,i) < 0 ? y0(0) : y0(getY(d,i))) + ')'
@ -267,7 +267,7 @@ nv.models.discreteBar = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

32
src/models/discreteBarChart.js
Unescape Escape View File

@ -3,7 +3,7 @@ nv.models.discreteBarChart = function() {
var margin = {top: 10, right: 10, bottom: 50, left: 60},
width = null,
height = null,
color = d3.scale.category20().range(),
color = nv.utils.getColor(), //a function that gets color for a datum
staggerLabels = false,
rotateLabels = 0,
tooltips = true,
@ -57,13 +57,13 @@ nv.models.discreteBarChart = function() {
.height(availableHeight);
var wrap = container.selectAll('g.wrap.discreteBarWithAxes').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 discreteBarWithAxes').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-discreteBarWithAxes').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-discreteBarWithAxes').append('g');
var defsEnter = gEnter.append('defs');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'barsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-barsWrap');
@ -72,7 +72,7 @@ nv.models.discreteBarChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var barsWrap = g.select('.barsWrap')
var barsWrap = g.select('.nv-barsWrap')
.datum(data.filter(function(d) { return !d.disabled }))
@ -80,10 +80,10 @@ nv.models.discreteBarChart = function() {
defsEnter.append('clipPath')
.attr('id', 'x-label-clip-' + discretebar.id())
.attr('id', 'nv-x-label-clip-' + discretebar.id())
.append('rect')
g.select('#x-label-clip-' + discretebar.id() + ' rect')
g.select('#nv-x-label-clip-' + discretebar.id() + ' rect')
.attr('width', x.rangeBand() * (staggerLabels ? 2 : 1))
.attr('height', 16)
.attr('x', -x.rangeBand() / (staggerLabels ? 1 : 2 ));
@ -93,14 +93,14 @@ nv.models.discreteBarChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + (y.range()[0] + ((discretebar.showValues() && y.domain()[0] < 0) ? 16 : 0)) + ')')
//d3.transition(g.select('.x.axis'))
g.select('.x.axis').transition().duration(0)
g.select('.nv-x.nv-axis').transition().duration(0)
.call(xAxis);
var xTicks = g.select('.x.axis').selectAll('g');
var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
if (staggerLabels)
xTicks
@ -115,14 +115,14 @@ nv.models.discreteBarChart = function() {
xTicks
.selectAll('text')
.attr('clip-path', function(d,i,j) { return rotateLabels ? '' : 'url(#x-label-clip-' + discretebar.id() + ')' });
.attr('clip-path', function(d,i,j) { return rotateLabels ? '' : 'url(#nv-x-label-clip-' + discretebar.id() + ')' });
yAxis
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
@ -176,8 +176,8 @@ nv.models.discreteBarChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
discretebar.color(_);
color = nv.utils.getColor(_);
discretebar.color(color);
return chart;
};

20
src/models/distribution.js
Unescape Escape View File

@ -5,7 +5,7 @@ nv.models.distribution = function() {
size = 8,
axis = 'x', // 'x' or 'y'... horizontal or vertical
getData = function(d) { return d[axis] }, // defaults d.x or d.y
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
domain;
var scale = d3.scale.linear(),
@ -27,35 +27,35 @@ nv.models.distribution = function() {
*/
var wrap = d3.select(this).selectAll('g.distribution').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 distribution');
var wrap = d3.select(this).selectAll('g.nv-distribution').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-distribution');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g');
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
var distWrap = g.selectAll('g.dist')
var distWrap = g.selectAll('g.nv-dist')
.data(function(d) { return d }, function(d) { return d.key });
distWrap.enter().append('g')
distWrap
.attr('class', function(d,i) { return 'dist series-' + i })
.style('stroke', function(d,i) { return color[i % color.length] });
.attr('class', function(d,i) { return 'nv-dist nv-series-' + i })
.style('stroke', function(d,i) { return color(d, i) });
//.style('stroke', function(d,i) { return color.filter(function(d,i) { return data[i] && !data[i].disabled })[i % color.length] });
var dist = distWrap.selectAll('line.dist' + axis)
var dist = distWrap.selectAll('line.nv-dist' + axis)
.data(function(d) { return d.values })
dist.enter().append('line')
.attr(axis + '1', function(d,i) { return scale0(getData(d,i)) })
.attr(axis + '2', function(d,i) { return scale0(getData(d,i)) })
d3.transition(distWrap.exit().selectAll('line.dist' + axis))
d3.transition(distWrap.exit().selectAll('line.nv-dist' + axis))
.attr(axis + '1', function(d,i) { return scale(getData(d,i)) })
.attr(axis + '2', function(d,i) { return scale(getData(d,i)) })
.style('stroke-opacity', 0)
.remove();
dist
//distWrap.selectAll('line.dist' + axis)
.attr('class', function(d,i) { return 'dist' + axis + ' dist' + axis + '-' + i })
.attr('class', function(d,i) { return 'nv-dist' + axis + ' nv-dist' + axis + '-' + i })
.attr(naxis + '1', 0)
.attr(naxis + '2', size);
d3.transition(dist)
@ -110,7 +110,7 @@ nv.models.distribution = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

28
src/models/historicalBar.js
Unescape Escape View File

@ -9,7 +9,7 @@ nv.models.historicalBar = function() {
forceX = [],
forceY = [],
clipEdge = true,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
xDomain, yDomain;
var x = d3.scale.linear(),
@ -55,11 +55,11 @@ nv.models.historicalBar = function() {
});
var wrap = d3.select(this).selectAll('g.wrap.bar').data([data[0].values]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 bar');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-bar').data([data[0].values]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-bar');
var gEnter = wrapEnter.append('g');
gEnter.append('g').attr('class', 'bars');
gEnter.append('g').attr('class', 'nv-bars');
wrap.attr('width', width)
@ -70,28 +70,28 @@ nv.models.historicalBar = function() {
wrapEnter.append('defs').append('clipPath')
.attr('id', 'chart-clip-path-' + id)
.attr('id', 'nv-chart-clip-path-' + id)
.append('rect');
wrap.select('#chart-clip-path-' + id + ' rect')
wrap.select('#nv-chart-clip-path-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
gEnter
.attr('clip-path', clipEdge ? 'url(#chart-clip-path-' + id + ')' : '');
.attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
var shiftWrap = gEnter.append('g').attr('class', 'shiftWrap');
var shiftWrap = gEnter.append('g').attr('class', 'nv-shiftWrap');
var bars = wrap.select('.bars').selectAll('.bar')
var bars = wrap.select('.nv-bars').selectAll('.nv-bar')
.data(function(d) { return d });
bars.exit().remove();
var barsEnter = bars.enter().append('svg:rect')
.attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'bar negative' : 'bar positive') + ' bar-' + j + '-' + i })
.attr('fill', function(d,i) { return color[0]; })
var barsEnter = bars.enter().append('rect')
.attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive') + ' nv-bar-' + j + '-' + i })
.attr('fill', function(d,i) { return color(d, i); })
.attr('x', 0 )
.attr('y', function(d,i) { return y(Math.max(0, getY(d,i))) })
.attr('height', function(d,i) { return Math.abs(y(getY(d,i)) - y(0)) })
@ -143,7 +143,7 @@ nv.models.historicalBar = function() {
});
bars
.attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'bar negative' : 'bar positive') + ' bar-' + j + '-' + i })
.attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive') + ' nv-bar-' + j + '-' + i })
.attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - ((availableWidth / data[0].values.length) * .5)) + ',0)'; }) //TODO: better width calculations that don't assume always uniform data spacing;w
.attr('width', (availableWidth / data[0].values.length) * .9 )
@ -235,7 +235,7 @@ nv.models.historicalBar = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

16
src/models/indentedTree.js
Unescape Escape View File

@ -5,7 +5,7 @@ nv.models.indentedTree = function() {
var margin = {top: 0, right: 0, bottom: 0, left: 0}, //TODO: implement, maybe as margin on the containing div
width = 960,
height = 500,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
id = Math.floor(Math.random() * 10000),
header = true,
noResultsText = 'No Results found.'
@ -41,7 +41,7 @@ nv.models.indentedTree = function() {
var wrap = d3.select(this).selectAll('div').data([[nodes]]);
var wrapEnter = wrap.enter().append('div').attr('class', 'wrap nvd3 indentedtree');
var wrapEnter = wrap.enter().append('div').attr('class', 'nvd3 nv-wrap nv-indentedtree');
var tableEnter = wrapEnter.append('table');
var table = wrap.select('table').attr('width', '100%').attr('class', tableClass);
@ -82,7 +82,7 @@ nv.models.indentedTree = function() {
node.exit().remove();
node.select('img.treeicon')
node.select('img.nv-treeicon')
.attr('src', icon)
.classed('folded', folded);
@ -98,8 +98,8 @@ nv.models.indentedTree = function() {
if (index == 0) {
nodeName.append('img')
.classed('treeicon', true)
.classed('folded', folded)
.classed('nv-treeicon', true)
.classed('nv-folded', folded)
.attr('src', icon)
.style('width', '14px')
.style('height', '14px')
@ -116,7 +116,7 @@ nv.models.indentedTree = function() {
if (column.showCount)
nodeName.append('span')
.attr('class', 'childrenCount')
.attr('class', 'nv-childrenCount')
.text(function(d) {
return ((d.values && d.values.length) || (d._values && d._values.length)) ?
'(' + ((d.values && d.values.length) || (d._values && d._values.length)) + ')'
@ -236,8 +236,8 @@ nv.models.indentedTree = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
scatter.color(_);
color = nv.utils.getColor(_);
scatter.color(color);
return chart;
};

16
src/models/legend.js
Unescape Escape View File

@ -4,7 +4,7 @@ nv.models.legend = function() {
width = 400,
height = 20,
getKey = function(d) { return d.key },
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
align = true;
var dispatch = d3.dispatch('legendClick', 'legendDblclick', 'legendMouseover', 'legendMouseout'); //TODO: theres are really element or series events, there are currently no 'LEGEND' events (as in entire legend)... decide if they are needed
@ -13,17 +13,17 @@ nv.models.legend = function() {
selection.each(function(data) {
var availableWidth = width - margin.left - margin.right;
var wrap = d3.select(this).selectAll('g.legend').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 legend').append('g');
var wrap = d3.select(this).selectAll('g.nv-legend').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-legend').append('g');
var g = wrap.select('g')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var series = g.selectAll('.series')
var series = g.selectAll('.nv-series')
.data(function(d) { return d });
var seriesEnter = series.enter().append('g').attr('class', 'series')
var seriesEnter = series.enter().append('g').attr('class', 'nv-series')
.on('mouseover', function(d,i) {
dispatch.legendMouseover(d,i); //TODO: Make consistent with other event objects
})
@ -37,8 +37,8 @@ nv.models.legend = function() {
dispatch.legendDblclick(d,i);
});
seriesEnter.append('circle')
.style('fill', function(d,i) { return d.color || color[i % color.length] })
.style('stroke', function(d,i) { return d.color || color[i % color.length] })
.style('fill', function(d,i) { return d.color || color(d,i)})
.style('stroke', function(d,i) { return d.color || color(d, i) })
.style('stroke-width', 2)
.attr('r', 5);
seriesEnter.append('text')
@ -167,7 +167,7 @@ nv.models.legend = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

44
src/models/line.js
Unescape Escape View File

@ -8,7 +8,7 @@ nv.models.line = function() {
var margin = {top: 0, right: 0, bottom: 0, left: 0},
width = 960,
height = 500,
color = d3.scale.category20().range(), // array of colors to be used in order
color = nv.utils.defaultColor(), // a function that returns a color
id = Math.floor(Math.random() * 10000), //Create semi-unique ID incase user doesn't select one
getX = function(d) { return d.x }, // accessor to get the x value from a data point
getY = function(d) { return d.y }, // accessor to get the y value from a data point
@ -44,16 +44,16 @@ nv.models.line = function() {
y0 = y0 || y;
var wrap = container.selectAll('g.wrap.line').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 line');
var wrap = container.selectAll('g.nv-wrap.nv-line').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-line');
var defsEnter = wrapEnter.append('defs');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g')
gEnter.append('g').attr('class', 'groups');
gEnter.append('g').attr('class', 'scatterWrap');
gEnter.append('g').attr('class', 'nv-groups');
gEnter.append('g').attr('class', 'nv-scatterWrap');
var scatterWrap = wrap.select('.scatterWrap');//.datum(data);
var scatterWrap = wrap.select('.nv-scatterWrap');//.datum(data);
scatter
@ -68,21 +68,21 @@ nv.models.line = function() {
defsEnter.append('clipPath')
.attr('id', 'edge-clip-' + id)
.attr('id', 'nv-edge-clip-' + id)
.append('rect');
wrap.select('#edge-clip-' + id + ' rect')
wrap.select('#nv-edge-clip-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
g .attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
scatterWrap
.attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
.attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
var groups = wrap.select('.groups').selectAll('.group')
var groups = wrap.select('.nv-groups').selectAll('.nv-group')
.data(function(d) { return d }, function(d) { return d.key });
groups.enter().append('g')
.style('stroke-opacity', 1e-6)
@ -92,21 +92,21 @@ nv.models.line = function() {
.style('fill-opacity', 1e-6)
.remove();
groups
.attr('class', function(d,i) { return 'group series-' + i })
.attr('class', function(d,i) { return 'nv-group nv-series-' + i })
.classed('hover', function(d) { return d.hover })
.style('fill', function(d,i){ return color[i % color.length] })
.style('stroke', function(d,i){ return color[i % color.length] });
.style('fill', function(d,i){ return color(d, i) })
.style('stroke', function(d,i){ return color(d, i)});
d3.transition(groups)
.style('stroke-opacity', 1)
.style('fill-opacity', .5);
var areaPaths = groups.selectAll('path.area')
var areaPaths = groups.selectAll('path.nv-area')
.data(function(d) { return [d] }); // this is done differently than lines because I need to check if series is an area
areaPaths.enter().append('path')
.filter(isArea)
.attr('class', 'area')
.attr('class', 'nv-area')
.attr('d', function(d) {
return d3.svg.area()
.interpolate(interpolate)
@ -117,7 +117,7 @@ nv.models.line = function() {
//.y1(function(d,i) { return y0(0) }) //assuming 0 is within y domain.. may need to tweak this
.apply(this, [d.values])
});
d3.transition(groups.exit().selectAll('path.area'))
d3.transition(groups.exit().selectAll('path.nv-area'))
.attr('d', function(d) {
return d3.svg.area()
.interpolate(interpolate)
@ -142,10 +142,10 @@ nv.models.line = function() {
var linePaths = groups.selectAll('path.line')
var linePaths = groups.selectAll('path.nv-line')
.data(function(d) { return [d.values] });
linePaths.enter().append('path')
.attr('class', function(d) { return 'line' })
.attr('class', function(d) { return 'nv-line' })
.attr('d',
d3.svg.line()
.interpolate(interpolate)
@ -153,7 +153,7 @@ nv.models.line = function() {
.x(function(d,i) { return x0(getX(d,i)) })
.y(function(d,i) { return y0(getY(d,i)) })
);
d3.transition(groups.exit().selectAll('path.line'))
d3.transition(groups.exit().selectAll('path.nv-line'))
.attr('d',
d3.svg.line()
.interpolate(interpolate)
@ -230,8 +230,8 @@ nv.models.line = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
scatter.color(_);
color = nv.utils.getColor(_);
scatter.color(color);
return chart;
};

34
src/models/lineChart.js
Unescape Escape View File

@ -6,7 +6,7 @@ nv.models.lineChart = function() {
//------------------------------------------------------------
var margin = {top: 30, right: 20, bottom: 50, left: 60},
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
width = null,
height = null,
showLegend = true,
@ -66,13 +66,13 @@ nv.models.lineChart = function() {
y = lines.yScale();
var wrap = container.selectAll('g.wrap.lineChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 lineChart').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-lineChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-lineChart').append('g');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'linesWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-linesWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
var g = wrap.select('g');
@ -83,7 +83,7 @@ nv.models.lineChart = function() {
if (showLegend) {
legend.width(availableWidth);
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -93,7 +93,7 @@ nv.models.lineChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(0,' + (-margin.top) +')')
}
@ -102,7 +102,7 @@ nv.models.lineChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
@ -110,7 +110,7 @@ nv.models.lineChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var linesWrap = g.select('.linesWrap')
var linesWrap = g.select('.nv-linesWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(linesWrap).call(lines);
@ -122,9 +122,9 @@ nv.models.lineChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
@ -133,7 +133,7 @@ nv.models.lineChart = function() {
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
@ -148,7 +148,7 @@ nv.models.lineChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -233,8 +233,8 @@ nv.models.lineChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

52
src/models/linePlusBarChart.js
Unescape Escape View File

@ -5,7 +5,7 @@ nv.models.linePlusBarChart = function() {
height = null,
getX = function(d) { return d.x },
getY = function(d) { return d.y },
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
showLegend = true,
tooltips = true,
tooltip = function(key, x, y, e, graph) {
@ -57,14 +57,14 @@ nv.models.linePlusBarChart = function() {
//TODO: try to remove x scale computation from this layer
var series1 = data.filter(function(d) { return !d.disabled && d.bar })
.map(function(d) {
.map(function(d) {
return d.values.map(function(d,i) {
return { x: getX(d,i), y: getY(d,i) }
})
});
var series2 = data.filter(function(d) { return !d.disabled && !d.bar })
.map(function(d) {
.map(function(d) {
return d.values.map(function(d,i) {
return { x: getX(d,i), y: getY(d,i) }
})
@ -88,15 +88,15 @@ nv.models.linePlusBarChart = function() {
var wrap = d3.select(this).selectAll('g.wrap.linePlusBar').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 linePlusBar').append('g');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-linePlusBar').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-linePlusBar').append('g');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y1 axis');
gEnter.append('g').attr('class', 'y2 axis');
gEnter.append('g').attr('class', 'barsWrap');
gEnter.append('g').attr('class', 'linesWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y1 nv-axis');
gEnter.append('g').attr('class', 'nv-y2 nv-axis');
gEnter.append('g').attr('class', 'nv-barsWrap');
gEnter.append('g').attr('class', 'nv-linesWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
@ -106,8 +106,8 @@ nv.models.linePlusBarChart = function() {
if (showLegend) {
legend.width( availableWidth / 2 );
g.select('.legendWrap')
.datum(data.map(function(series) {
g.select('.nv-legendWrap')
.datum(data.map(function(series) {
series.originalKey = series.originalKey === undefined ? series.key : series.originalKey;
series.key = series.originalKey + (series.bar ? ' (left axis)' : ' (right axis)');
return series;
@ -120,7 +120,7 @@ nv.models.linePlusBarChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(' + ( availableWidth / 2 ) + ',' + (-margin.top) +')');
}
@ -131,22 +131,22 @@ nv.models.linePlusBarChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled && !data[i].bar }))
bars
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled && data[i].bar }))
var barsWrap = g.select('.barsWrap')
var barsWrap = g.select('.nv-barsWrap')
.datum(dataBars.length ? dataBars : [{values:[]}])
var linesWrap = g.select('.linesWrap')
var linesWrap = g.select('.nv-linesWrap')
.datum(dataLines.length ? dataLines : [{values:[]}])
@ -161,9 +161,9 @@ nv.models.linePlusBarChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y1.range()[0] + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
@ -171,7 +171,7 @@ nv.models.linePlusBarChart = function() {
.ticks( availableHeight / 36 )
.tickSize(-availableWidth, 0);
d3.transition(g.select('.y1.axis'))
d3.transition(g.select('.nv-y1.nv-axis'))
.style('opacity', dataBars.length ? 1 : 0)
.call(yAxis1);
@ -180,11 +180,11 @@ nv.models.linePlusBarChart = function() {
.ticks( availableHeight / 36 )
.tickSize(dataBars.length ? 0 : -availableWidth, 0); // Show the y2 rules only if y1 has none
g.select('.y2.axis')
g.select('.nv-y2.nv-axis')
.style('opacity', dataLines.length ? 1 : 0)
.attr('transform', 'translate(' + x.range()[1] + ',0)');
d3.transition(g.select('.y2.axis'))
d3.transition(g.select('.nv-y2.nv-axis'))
.call(yAxis2);
@ -195,7 +195,7 @@ nv.models.linePlusBarChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -287,8 +287,8 @@ nv.models.linePlusBarChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

34
src/models/lineWithFisheye.js
Unescape Escape View File

@ -4,7 +4,7 @@ nv.models.line = function() {
var margin = {top: 0, right: 0, bottom: 0, left: 0},
width = 960,
height = 500,
color = d3.scale.category20().range(), // array of colors to be used in order
color = nv.utils.defaultColor(), // function that returns colors
id = Math.floor(Math.random() * 10000), //Create semi-unique ID incase user doesn't select one
getX = function(d) { return d.x }, // accessor to get the x value from a data point
getY = function(d) { return d.y }, // accessor to get the y value from a data point
@ -36,16 +36,16 @@ nv.models.line = function() {
y0 = y0 || y;
var wrap = d3.select(this).selectAll('g.wrap.line').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 line');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-line').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-line');
var defsEnter = wrapEnter.append('defs');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g')
wrapEnter.append('g').attr('class', 'scatterWrap');
var scatterWrap = wrap.select('.scatterWrap').datum(data);
wrapEnter.append('g').attr('class', 'nv-scatterWrap');
var scatterWrap = wrap.select('.nv-scatterWrap').datum(data);
gEnter.append('g').attr('class', 'groups');
gEnter.append('g').attr('class', 'nv-groups');
scatter
@ -59,21 +59,21 @@ nv.models.line = function() {
defsEnter.append('clipPath')
.attr('id', 'edge-clip-' + id)
.attr('id', 'nv-edge-clip-' + id)
.append('rect');
wrap.select('#edge-clip-' + id + ' rect')
wrap.select('#nv-edge-clip-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
g .attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
scatterWrap
.attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
.attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
var groups = wrap.select('.groups').selectAll('.group')
var groups = wrap.select('.nv-groups').selectAll('.nv-group')
.data(function(d) { return d }, function(d) { return d.key });
groups.enter().append('g')
.style('stroke-opacity', 1e-6)
@ -83,10 +83,10 @@ nv.models.line = function() {
.style('fill-opacity', 1e-6)
.remove();
groups
.attr('class', function(d,i) { return 'group series-' + i })
.attr('class', function(d,i) { return 'nv-group nv-series-' + i })
.classed('hover', function(d) { return d.hover })
.style('fill', function(d,i){ return color[i % color.length] })
.style('stroke', function(d,i){ return color[i % color.length] })
.style('fill', function(d,i){ return color(d, i) })
.style('stroke', function(d,i){ return color(d, i) })
d3.transition(groups)
.style('stroke-opacity', 1)
.style('fill-opacity', .5)
@ -95,7 +95,7 @@ nv.models.line = function() {
var paths = groups.selectAll('path')
.data(function(d, i) { return [d.values] });
paths.enter().append('path')
.attr('class', 'line')
.attr('class', 'nv-line')
.attr('d', d3.svg.line()
.interpolate(interpolate)
.x(function(d,i) { return x0(getX(d,i)) })
@ -170,8 +170,8 @@ nv.models.line = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
scatter.color(_);
color = nv.utils.getColor(_);
scatter.color(color);
return chart;
};

60
src/models/lineWithFisheyeChart.js
Unescape Escape View File

@ -1,7 +1,7 @@
nv.models.lineChart = function() {
var margin = {top: 30, right: 20, bottom: 50, left: 60},
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
width = null,
height = null,
showLegend = true,
@ -55,22 +55,22 @@ nv.models.lineChart = function() {
var wrap = container.selectAll('g.wrap.lineChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 lineChart').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-lineChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-lineChart').append('g');
gEnter.append('rect')
.attr('class', 'nvd3 background')
.attr('class', 'nvd3 nv-background')
.attr('width', availableWidth)
.attr('height', availableHeight);
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'linesWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-linesWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
var g = wrap.select('g');
@ -81,7 +81,7 @@ nv.models.lineChart = function() {
if (showLegend) {
legend.width(availableWidth);
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -91,13 +91,13 @@ nv.models.lineChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(0,' + (-margin.top) +')')
}
if (showControls) {
controls.width(180).color(['#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
@ -109,7 +109,7 @@ nv.models.lineChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
@ -117,7 +117,7 @@ nv.models.lineChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var linesWrap = g.select('.linesWrap')
var linesWrap = g.select('.nv-linesWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(linesWrap).call(lines);
@ -129,9 +129,9 @@ nv.models.lineChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
@ -140,29 +140,29 @@ nv.models.lineChart = function() {
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
g.select('.background').on('mousemove', updateFisheye);
g.select('.background').on('click', function() { pauseFisheye = !pauseFisheye; });
g.select('.nv-background').on('mousemove', updateFisheye);
g.select('.nv-background').on('click', function() { pauseFisheye = !pauseFisheye; });
//g.select('.point-paths').on('mousemove', updateFisheye);
function updateFisheye() {
if (pauseFisheye) {
//g.select('.background') .style('pointer-events', 'none');
g.select('.point-paths').style('pointer-events', 'all');
g.select('.nv-point-paths').style('pointer-events', 'all');
return false;
}
g.select('.background') .style('pointer-events', 'all');
g.select('.point-paths').style('pointer-events', 'none' );
g.select('.nv-background') .style('pointer-events', 'all');
g.select('.nv-point-paths').style('pointer-events', 'none' );
var mouse = d3.mouse(this);
linesWrap.call(lines);
g.select('.x.axis').call(xAxis);
g.select('.nv-x.nv-axis').call(xAxis);
x.distortion(fisheye).focus(mouse[0]);
}
@ -171,8 +171,8 @@ nv.models.lineChart = function() {
d.disabled = !d.disabled;
fisheye = d.disabled ? 0 : 5;
g.select('.background') .style('pointer-events', d.disabled ? 'none' : 'all');
g.select('.point-paths').style('pointer-events', d.disabled ? 'all' : 'none' );
g.select('.nv-background') .style('pointer-events', d.disabled ? 'none' : 'all');
g.select('.nv-point-paths').style('pointer-events', d.disabled ? 'all' : 'none' );
//scatter.interactive(d.disabled);
//tooltips = d.disabled;
@ -181,7 +181,7 @@ nv.models.lineChart = function() {
x.distortion(fisheye).focus(0);
linesWrap.call(lines);
g.select('.x.axis').call(xAxis);
g.select('.nv-x.nv-axis').call(xAxis);
} else {
pauseFisheye = false;
}
@ -197,7 +197,7 @@ nv.models.lineChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -269,8 +269,8 @@ nv.models.lineChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

225
src/models/lineWithFocusChart.js
Unescape Escape View File

@ -1,14 +1,15 @@
nv.models.lineWithFocusChart = function() {
var margin = {top: 30, right: 20, bottom: 50, left: 60},
margin2 = {top: 0, right: 20, bottom: 20, left: 60},
color = d3.scale.category20().range(),
width = null,
var margin = {top: 30, right: 30, bottom: 30, left: 60},
margin2 = {top: 0, right: 30, bottom: 20, left: 60},
color = nv.utils.defaultColor(),
width = null,
height = null,
height2 = 100,
showLegend = true,
brushExtent = null,
tooltips = true,
tooltip = function(key, x, y, e, graph) {
tooltip = function(key, x, y, e, graph) {
return '<h3>' + key + '</h3>' +
'<p>' + y + ' at ' + x + '</p>'
};
@ -21,7 +22,7 @@ nv.models.lineWithFocusChart = function() {
y2 = lines2.yScale(),
xAxis = nv.models.axis().scale(x).orient('bottom').tickPadding(5),
yAxis = nv.models.axis().scale(y).orient('left'),
x2Axis = nv.models.axis().scale(x).orient('bottom').tickPadding(5),
x2Axis = nv.models.axis().scale(x2).orient('bottom').tickPadding(5),
y2Axis = nv.models.axis().scale(y2).orient('left'),
legend = nv.models.legend().height(30),
dispatch = d3.dispatch('tooltipShow', 'tooltipHide'),
@ -54,21 +55,23 @@ nv.models.lineWithFocusChart = function() {
brush.on('brush', onBrush);
var wrap = container.selectAll('g.wrap.lineWithFocusChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 lineWithFocusChart').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-lineWithFocusChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-lineWithFocusChart').append('g');
var focusEnter = gEnter.append('g').attr('class', 'focus');
focusEnter.append('g').attr('class', 'x axis');
focusEnter.append('g').attr('class', 'y axis');
focusEnter.append('g').attr('class', 'linesWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
var contextEnter = gEnter.append('g').attr('class', 'context');
contextEnter.append('g').attr('class', 'x axis');
contextEnter.append('g').attr('class', 'y axis');
contextEnter.append('g').attr('class', 'linesWrap');
contextEnter.append('g').attr('class', 'x brush');
var focusEnter = gEnter.append('g').attr('class', 'nv-focus');
focusEnter.append('g').attr('class', 'nv-x nv-axis');
focusEnter.append('g').attr('class', 'nv-y nv-axis');
focusEnter.append('g').attr('class', 'nv-linesWrap');
var contextEnter = gEnter.append('g').attr('class', 'nv-context');
contextEnter.append('g').attr('class', 'nv-x nv-axis');
contextEnter.append('g').attr('class', 'nv-y nv-axis');
contextEnter.append('g').attr('class', 'nv-linesWrap');
contextEnter.append('g').attr('class', 'nv-brushBackground');
contextEnter.append('g').attr('class', 'nv-x nv-brush');
gEnter.append('g').attr('class', 'legendWrap');
var g = wrap.select('g');
@ -79,17 +82,17 @@ nv.models.lineWithFocusChart = function() {
if (showLegend) {
legend.width(availableWidth);
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
if ( margin.top != legend.height()) {
margin.top = legend.height();
availableHeight = (height || parseInt(container.style('height')) || 400)
- margin.top - margin.bottom;
- margin.top - margin.bottom - height2;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(0,' + (-margin.top) +')')
}
@ -98,7 +101,7 @@ nv.models.lineWithFocusChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
lines2
@ -108,53 +111,105 @@ nv.models.lineWithFocusChart = function() {
.x(lines.x())
.y(lines.y())
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var focusLinesWrap = g.select('.focus .linesWrap')
/*
var focusLinesWrap = g.select('.nv-focus .nv-linesWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(focusLinesWrap).call(lines);
*/
xAxis
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.focus .x.axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
d3.transition(g.select('.focus .x.axis'))
.call(xAxis);
yAxis
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.focus .y.axis'))
g.select('.nv-focus .nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
/*
d3.transition(g.select('.nv-focus .nv-x.nv-axis'))
.call(xAxis);
d3.transition(g.select('.nv-focus .nv-y.nv-axis'))
.call(yAxis);
*/
g.select('.context')
g.select('.nv-context')
.attr('transform', 'translate(0,' + ( availableHeight + margin.bottom + margin2.top) + ')')
var contextLinesWrap = g.select('.context .linesWrap')
var contextLinesWrap = g.select('.nv-context .nv-linesWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(contextLinesWrap).call(lines2);
gBrush = g.select('.x.brush')
if (brushExtent) brush.extent(brushExtent);
var brushBG = g.select('.nv-brushBackground').selectAll('g')
.data([brushExtent || brush.extent()])
var brushBGenter = brushBG.enter()
.append('g');
brushBGenter.append('rect')
.attr('class', 'left')
.attr('x', 0)
.attr('y', 0)
.attr('height', availableHeight2);
brushBGenter.append('rect')
.attr('class', 'right')
.attr('x', 0)
.attr('y', 0)
.attr('height', availableHeight2);
function updateBrushBG() {
//nv.log('test', brush.empty(), brush.extent());
if (!brush.empty()) brush.extent(brushExtent);
brushBG
.data([brush.empty() ? x2.domain() : brushExtent])
//.data([brush.empty() ? xi.domain() : brush.extent()])
.each(function(d,i) {
var leftWidth = x2(d[0]) - x.range()[0],
rightWidth = x.range()[1] - x2(d[1]);
d3.select(this).select('.left')
.attr('width', leftWidth < 0 ? 0 : leftWidth);
d3.select(this).select('.right')
.attr('x', x2(d[1]))
.attr('width', rightWidth < 0 ? 0 : rightWidth);
});
}
gBrush = g.select('.nv-x.nv-brush')
.call(brush);
gBrush.selectAll('rect')
//.attr('y', -5)
.attr('height', availableHeight2);
gBrush.selectAll(".resize").append("path").attr("d", resizePath);
gBrush.selectAll('.resize').append('path').attr('d', resizePath);
//if (brushExtent) onBrush();
onBrush();
@ -163,9 +218,9 @@ nv.models.lineWithFocusChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight2, 0);
g.select('.context .x.axis')
g.select('.nv-context .nv-x.nv-axis')
.attr('transform', 'translate(0,' + y2.range()[0] + ')');
d3.transition(g.select('.context .x.axis'))
d3.transition(g.select('.nv-context .nv-x.nv-axis'))
.call(x2Axis);
@ -174,12 +229,15 @@ nv.models.lineWithFocusChart = function() {
.ticks( availableHeight2 / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.context .y.axis'))
d3.transition(g.select('.nv-context .nv-y.nv-axis'))
.call(y2Axis);
updateFocus();
g.select('.nv-focus .nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
g.select('.nv-context .nv-x.nv-axis')
.attr('transform', 'translate(0,' + y2.range()[0] + ')');
legend.dispatch.on('legendClick', function(d,i) {
@ -188,7 +246,7 @@ nv.models.lineWithFocusChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -225,50 +283,69 @@ nv.models.lineWithFocusChart = function() {
// Taken from crossfilter (http://square.github.com/crossfilter/)
function resizePath(d) {
var e = +(d == "e"),
var e = +(d == 'e'),
x = e ? 1 : -1,
y = availableHeight2 / 3;
return "M" + (.5 * x) + "," + y
+ "A6,6 0 0 " + e + " " + (6.5 * x) + "," + (y + 6)
+ "V" + (2 * y - 6)
+ "A6,6 0 0 " + e + " " + (.5 * x) + "," + (2 * y)
+ "Z"
+ "M" + (2.5 * x) + "," + (y + 8)
+ "V" + (2 * y - 8)
+ "M" + (4.5 * x) + "," + (y + 8)
+ "V" + (2 * y - 8);
return 'M' + (.5 * x) + ',' + y
+ 'A6,6 0 0 ' + e + ' ' + (6.5 * x) + ',' + (y + 6)
+ 'V' + (2 * y - 6)
+ 'A6,6 0 0 ' + e + ' ' + (.5 * x) + ',' + (2 * y)
+ 'Z'
+ 'M' + (2.5 * x) + ',' + (y + 8)
+ 'V' + (2 * y - 8)
+ 'M' + (4.5 * x) + ',' + (y + 8)
+ 'V' + (2 * y - 8);
}
function onBrush() {
updateFocus();
//nv.log(brush.empty(), brush.extent(), x2(brush.extent()[0]), x2(brush.extent()[1]));
/*
focusLinesWrap.call(lines)
//var focusLinesWrap = g.select('.focus .linesWrap')
g.select('.focus .x.axis').call(xAxis);
g.select('.focus .y.axis').call(yAxis);
g.select('.nv-focus .nv-x.nv-axis').call(xAxis);
g.select('.nv-focus .nv-y.nv-axis').call(yAxis);
}
*/
brushExtent = brush.empty() ? null : brush.extent();
extent = brush.empty() ? x2.domain() : brush.extent();
function updateFocus() {
var yDomain = brush.empty() ? y2.domain() : d3.extent(d3.merge(data.filter(function(d) { return !d.disabled }).map(function(d) { return d.values })).filter(function(d) {
return lines.x()(d) >= brush.extent()[0] && lines.x()(d) <= brush.extent()[1];
}), lines.y()); //This doesn't account for the 1 point before and the 1 point after the domain. Would fix, but likely need to change entire methodology here
updateBrushBG();
if (typeof yDomain[0] == 'undefined') yDomain = y2.domain(); //incase the brush doesn't cover a single point
x.domain(brush.empty() ? x2.domain() : brush.extent());
y.domain(yDomain);
var focusLinesWrap = g.select('.nv-focus .nv-linesWrap')
.datum(
data
.filter(function(d) { return !d.disabled })
.map(function(d,i) {
return {
key: d.key,
values: d.values.filter(function(d,i) {
return lines.x()(d,i) >= extent[0] && lines.x()(d,i) <= extent[1];
})
}
})
)
//TODO: Rethink this... performance is horrible, likely need to cut off focus data to within the range
// If I limit the data for focusLines would want to include 1 point before and after the extent,
// Need to figure out an optimized way to accomplish this.
// ***One concern is to try not to make the assumption that all lines are of the same length, and
// points with the same index have the same x value (while this is true in our test cases, may
// not always be)
d3.transition(focusLinesWrap).call(lines);
lines.xDomain(x.domain());
lines.yDomain(y.domain());
/*
var contextLinesWrap = g.select('.context .linesWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(contextLinesWrap).call(lines2);
*/
d3.transition(g.select('.nv-focus .nv-x.nv-axis'))
.call(xAxis);
d3.transition(g.select('.nv-focus .nv-y.nv-axis'))
.call(yAxis);
}
@ -302,6 +379,12 @@ nv.models.lineWithFocusChart = function() {
return chart;
};
chart.margin2 = function(_) {
if (!arguments.length) return margin2;
margin2 = _;
return chart;
};
chart.width = function(_) {
if (!arguments.length) return width;
width = _;
@ -316,8 +399,8 @@ nv.models.lineWithFocusChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color =nv.utils.getColor(_);
legend.color(color);
return chart;
};
@ -338,7 +421,7 @@ nv.models.lineWithFocusChart = function() {
tooltip = _;
return chart;
};
chart.interpolate = function(_) {
if (!arguments.length) return lines.interpolate();
lines.interpolate(_);

37
src/models/multiBar.js
Unescape Escape View File

@ -16,7 +16,7 @@ nv.models.multiBar = function() {
forceY = [0], // 0 is forced by default.. this makes sense for the majority of bar graphs... user can always do chart.forceY([]) to remove
clipEdge = true,
stacked = false,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
delay = 1200,
xDomain, yDomain;
@ -57,7 +57,7 @@ nv.models.multiBar = function() {
var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
data.map(function(d) {
data.map(function(d) {
return d.values.map(function(d,i) {
return { x: getX(d,i), y: getY(d,i), y0: d.y0 }
})
@ -77,7 +77,6 @@ nv.models.multiBar = function() {
x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
: x.domain([-1,1]);
nv.log(y.domain());
if (y.domain()[0] === y.domain()[1])
y.domain()[0] ?
y.domain([y.domain()[0] + y.domain()[0] * 0.01, y.domain()[1] - y.domain()[1] * 0.01])
@ -93,12 +92,12 @@ nv.models.multiBar = function() {
var wrap = d3.select(this).selectAll('g.wrap.multibar').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multibar');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-multibar').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-multibar');
var defsEnter = wrapEnter.append('defs');
var gEnter = wrapEnter.append('g');
gEnter.append('g').attr('class', 'groups');
gEnter.append('g').attr('class', 'nv-groups');
var g = wrap.select('g')
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
@ -106,17 +105,17 @@ nv.models.multiBar = function() {
defsEnter.append('clipPath')
.attr('id', 'edge-clip-' + id)
.attr('id', 'nv-edge-clip-' + id)
.append('rect');
wrap.select('#edge-clip-' + id + ' rect')
wrap.select('#nv-edge-clip-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
g .attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
var groups = wrap.select('.groups').selectAll('.group')
var groups = wrap.select('.nv-groups').selectAll('.nv-group')
.data(function(d) { return d }, function(d) { return d.key });
groups.enter().append('g')
.style('stroke-opacity', 1e-6)
@ -124,29 +123,29 @@ nv.models.multiBar = function() {
d3.transition(groups.exit())
//.style('stroke-opacity', 1e-6)
//.style('fill-opacity', 1e-6)
.selectAll('rect.bar')
.selectAll('rect.nv-bar')
.delay(function(d,i) { return i * delay/ data[0].values.length })
.attr('y', function(d) { return stacked ? y0(d.y0) : y0(0) })
.attr('height', 0)
.remove();
groups
.attr('class', function(d,i) { return 'group series-' + i })
.attr('class', function(d,i) { return 'nv-group nv-series-' + i })
.classed('hover', function(d) { return d.hover })
.style('fill', function(d,i){ return color[i % color.length] })
.style('stroke', function(d,i){ return color[i % color.length] });
.style('fill', function(d,i){ return color(d, i) })
.style('stroke', function(d,i){ return color(d, i) });
d3.transition(groups)
.style('stroke-opacity', 1)
.style('fill-opacity', .75);
var bars = groups.selectAll('rect.bar')
var bars = groups.selectAll('rect.nv-bar')
.data(function(d) { return d.values });
bars.exit().remove();
var barsEnter = bars.enter().append('rect')
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'bar negative' : 'bar positive'})
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
.attr('x', function(d,i,j) {
return stacked ? 0 : (j * x.rangeBand() / data.length )
})
@ -202,7 +201,7 @@ nv.models.multiBar = function() {
d3.event.stopPropagation();
});
bars
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'bar negative' : 'bar positive'})
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
.attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',0)'; })
if (stacked)
d3.transition(bars)
@ -232,7 +231,7 @@ nv.models.multiBar = function() {
.attr('y', function(d,i) {
return getY(d,i) < 0 ?
y(0) :
y(getY(d,i))
y(getY(d,i))
})
.attr('height', function(d,i) {
return Math.abs(y(getY(d,i)) - y(0))
@ -334,7 +333,7 @@ nv.models.multiBar = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

40
src/models/multiBarChart.js
Unescape Escape View File

@ -8,7 +8,7 @@ nv.models.multiBarChart = function() {
var margin = {top: 30, right: 20, bottom: 50, left: 60},
width = null,
height = null,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
showControls = true,
showLegend = true,
reduceXTicks = true, // if false a tick will show for every data point
@ -59,14 +59,14 @@ nv.models.multiBarChart = function() {
y = multibar.yScale();
var wrap = container.selectAll('g.wrap.multiBarWithLegend').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multiBarWithLegend').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-multiBarWithLegend').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-multiBarWithLegend').append('g');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'barsWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-barsWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
@ -76,7 +76,7 @@ nv.models.multiBarChart = function() {
if (showLegend) {
legend.width(availableWidth / 2);
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -86,7 +86,7 @@ nv.models.multiBarChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(' + (availableWidth / 2) + ',' + (-margin.top) +')');
}
@ -95,7 +95,7 @@ nv.models.multiBarChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }))
@ -107,7 +107,7 @@ nv.models.multiBarChart = function() {
];
controls.width(180).color(['#444', '#444', '#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
@ -117,7 +117,7 @@ nv.models.multiBarChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var barsWrap = g.select('.barsWrap')
var barsWrap = g.select('.nv-barsWrap')
.datum(data.filter(function(d) { return !d.disabled }))
@ -129,12 +129,12 @@ nv.models.multiBarChart = function() {
.ticks( availableWidth / 100 )
.tickSize(-availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
var xTicks = g.select('.x.axis > g').selectAll('g');
var xTicks = g.select('.nv-x.nv-axis > g').selectAll('g');
xTicks
.selectAll('line, text')
@ -153,7 +153,7 @@ nv.models.multiBarChart = function() {
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
@ -168,7 +168,7 @@ nv.models.multiBarChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -259,8 +259,8 @@ nv.models.multiBarChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

29
src/models/multiBarHorizontal.js
Unescape Escape View File

@ -9,7 +9,7 @@ nv.models.multiBarHorizontal = function() {
getX = function(d) { return d.x },
getY = function(d) { return d.y },
forceY = [0], // 0 is forced by default.. this makes sense for the majority of bar graphs... user can always do chart.forceY([]) to remove
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
stacked = false,
showValues = false,
valuePadding = 60,
@ -46,7 +46,7 @@ nv.models.multiBarHorizontal = function() {
var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
data.map(function(d) {
data.map(function(d) {
return d.values.map(function(d,i) {
return { x: getX(d,i), y: getY(d,i), y0: d.y0 }
})
@ -63,22 +63,21 @@ nv.models.multiBarHorizontal = function() {
//store old scales if they exist
x0 = x0 || x;
//y0 = y0 || y;
y0 = y0 || d3.scale.linear().domain(y.domain()).range([y(0),y(0)]);
var wrap = d3.select(this).selectAll('g.wrap.multibarHorizontal').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multibarHorizontal');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-multibarHorizontal').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-multibarHorizontal');
var defsEnter = wrapEnter.append('defs');
var gEnter = wrapEnter.append('g');
gEnter.append('g').attr('class', 'groups');
gEnter.append('g').attr('class', 'nv-groups');
var g = wrap.select('g')
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var groups = wrap.select('.groups').selectAll('.group')
var groups = wrap.select('.nv-groups').selectAll('.nv-group')
.data(function(d) { return d }, function(d) { return d.key });
groups.enter().append('g')
.style('stroke-opacity', 1e-6)
@ -88,16 +87,16 @@ nv.models.multiBarHorizontal = function() {
.style('fill-opacity', 1e-6)
.remove();
groups
.attr('class', function(d,i) { return 'group series-' + i })
.attr('class', function(d,i) { return 'nv-group nv-series-' + i })
.classed('hover', function(d) { return d.hover })
.style('fill', function(d,i){ return color[i % color.length] })
.style('stroke', function(d,i){ return color[i % color.length] });
.style('fill', function(d,i){ return color(d, i) })
.style('stroke', function(d,i){ return color(d, i) });
d3.transition(groups)
.style('stroke-opacity', 1)
.style('fill-opacity', .75);
var bars = groups.selectAll('g.bar')
var bars = groups.selectAll('g.nv-bar')
.data(function(d) { return d.values });
bars.exit().remove();
@ -111,7 +110,7 @@ nv.models.multiBarHorizontal = function() {
barsEnter.append('rect')
.attr('width', 0)
.attr('height', x.rangeBand() / (stacked ? 1 : data.length) )
bars
.on('mouseover', function(d,i) { //TODO: figure out why j works above, but not here
d3.select(this).classed('hover', true);
@ -177,7 +176,7 @@ nv.models.multiBarHorizontal = function() {
}
bars
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'bar negative' : 'bar positive'})
.attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
//.attr('transform', function(d,i,j) {
//return 'translate(' + y0(stacked ? d.y0 : 0) + ',' + x(getX(d,i)) + ')'
//})
@ -186,7 +185,7 @@ nv.models.multiBarHorizontal = function() {
//.delay(function(d,i) { return i * delay / data[0].values.length })
.attr('transform', function(d,i) {
//return 'translate(' + y(d.y0) + ',0)'
return 'translate(' + y(d.y0) + ',' + (stacked ? 0 : (j * x.rangeBand() / data.length )) + ')'
return 'translate(' + y(d.y0) + ',' + x(getX(d,i)) + ')'
})
.select('rect')
.attr('width', function(d,i) {
@ -336,7 +335,7 @@ nv.models.multiBarHorizontal = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

40
src/models/multiBarHorizontalChart.js
Unescape Escape View File

@ -3,7 +3,7 @@ nv.models.multiBarHorizontalChart = function() {
var margin = {top: 30, right: 20, bottom: 50, left: 60},
width = null,
height = null,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
showControls = true,
showLegend = true,
tooltips = true,
@ -54,14 +54,14 @@ nv.models.multiBarHorizontalChart = function() {
var wrap = container.selectAll('g.wrap.multiBarHorizontalChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multiBarHorizontalChart').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-multiBarHorizontalChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-multiBarHorizontalChart').append('g');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'barsWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-barsWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
@ -74,7 +74,7 @@ nv.models.multiBarHorizontalChart = function() {
if (showLegend) {
legend.width(availableWidth / 2);
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -84,7 +84,7 @@ nv.models.multiBarHorizontalChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(' + (availableWidth / 2) + ',' + (-margin.top) +')')
}
@ -93,14 +93,14 @@ nv.models.multiBarHorizontalChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }))
if (showControls) {
controls.width(180).color(['#444', '#444', '#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
@ -110,7 +110,7 @@ nv.models.multiBarHorizontalChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var barsWrap = g.select('.barsWrap')
var barsWrap = g.select('.nv-barsWrap')
.datum(data.filter(function(d) { return !d.disabled }))
@ -122,10 +122,10 @@ nv.models.multiBarHorizontalChart = function() {
.tickSize(-availableWidth, 0);
//d3.transition(g.select('.x.axis'))
g.select('.x.axis').transition().duration(0)
g.select('.nv-x.nv-axis').transition().duration(0)
.call(xAxis);
var xTicks = g.select('.x.axis').selectAll('g');
var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
xTicks
.selectAll('line, text')
@ -144,9 +144,9 @@ nv.models.multiBarHorizontalChart = function() {
.ticks( availableWidth / 100 )
.tickSize( -availableHeight, 0);
g.select('.y.axis')
g.select('.nv-y.nv-axis')
.attr('transform', 'translate(0,' + availableHeight + ')');
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
//g.select('.y.axis').transition().duration(0)
.call(yAxis);
@ -159,7 +159,7 @@ nv.models.multiBarHorizontalChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -239,8 +239,8 @@ nv.models.multiBarHorizontalChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

61
src/models/ohlcBar.js
Unescape Escape View File

@ -13,7 +13,7 @@ nv.models.ohlcBar = function() {
forceX = [],
forceY = [],
clipEdge = true,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
xDomain, yDomain;
var x = d3.scale.linear(),
@ -63,11 +63,11 @@ nv.models.ohlcBar = function() {
});
var wrap = d3.select(this).selectAll('g.wrap.historicalStock').data([data[0].values]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 historicalStock');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-ohlcBar').data([data[0].values]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-ohlcBar');
var gEnter = wrapEnter.append('g');
gEnter.append('g').attr('class', 'ticks');
gEnter.append('g').attr('class', 'nv-ticks');
wrap.attr('width', width)
@ -78,30 +78,46 @@ nv.models.ohlcBar = function() {
wrapEnter.append('defs').append('clipPath')
.attr('id', 'chart-clip-path-' + id)
.attr('id', 'nv-chart-clip-path-' + id)
.append('rect');
wrap.select('#chart-clip-path-' + id + ' rect')
wrap.select('#nv-chart-clip-path-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
gEnter
.attr('clip-path', clipEdge ? 'url(#chart-clip-path-' + id + ')' : '');
.attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
var shiftWrap = gEnter.append('g').attr('class', 'shiftWrap');
var shiftWrap = gEnter.append('g').attr('class', 'nv-shiftWrap');
var ticks = wrap.select('.ticks').selectAll('.tick')
var ticks = wrap.select('.nv-ticks').selectAll('.nv-tick')
.data(function(d) { return d });
ticks.exit().remove();
var ticksEnter = ticks.enter().append('path')
.attr('class', function(d,i,j) { return (getOpen(d,i) > getClose(d,i) ? 'tick negative' : 'tick positive') + ' tick-' + j + '-' + i })
.attr('class', function(d,i,j) { return (getOpen(d,i) > getClose(d,i) ? 'nv-tick negative' : 'nv-tick positive') + ' nv-tick-' + j + '-' + i })
.attr('d', function(d,i) {
var w = (availableWidth / data[0].values.length) * .9;
return 'm0,0l0,' + (y(getOpen(d,i)) - y(getHigh(d,i))) + 'l' + (-w/2) + ',0l' + (w/2) + ',0l0,' + (y(getLow(d,i)) - y(getOpen(d,i))) +'l0,'+ (y(getClose(d,i)) - y(getLow(d,i))) +'l' + (w/2) + ',0l' + (-w/2) + ',0z';
return 'm0,0l0,'
+ (y(getOpen(d,i))
- y(getHigh(d,i)))
+ 'l'
+ (-w/2)
+ ',0l'
+ (w/2)
+ ',0l0,'
+ (y(getLow(d,i)) - y(getOpen(d,i)))
+ 'l0,'
+ (y(getClose(d,i))
- y(getLow(d,i)))
+ 'l'
+ (w/2)
+ ',0l'
+ (-w/2)
+ ',0z';
})
.attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',' + y(getHigh(d,i)) + ')'; })
//.attr('fill', function(d,i) { return color[0]; })
@ -157,12 +173,29 @@ nv.models.ohlcBar = function() {
});
ticks
.attr('class', function(d,i,j) { return (getOpen(d,i) > getClose(d,i) ? 'tick negative' : 'tick positive') + ' tick-' + j + '-' + i })
.attr('class', function(d,i,j) { return (getOpen(d,i) > getClose(d,i) ? 'nv-tick negative' : 'nv-tick positive') + ' nv-tick-' + j + '-' + i })
d3.transition(ticks)
.attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',' + y(getHigh(d,i)) + ')'; })
.attr('d', function(d,i) {
var w = (availableWidth / data[0].values.length) * .9;
return 'm0,0l0,' + (y(getOpen(d,i)) - y(getHigh(d,i))) + 'l' + (-w/2) + ',0l' + (w/2) + ',0l0,' + (y(getLow(d,i)) - y(getOpen(d,i))) +'l0,'+ (y(getClose(d,i)) - y(getLow(d,i))) +'l' + (w/2) + ',0l' + (-w/2) + ',0z';
return 'm0,0l0,'
+ (y(getOpen(d,i))
- y(getHigh(d,i)))
+ 'l'
+ (-w/2)
+ ',0l'
+ (w/2)
+ ',0l0,'
+ (y(getLow(d,i))
- y(getOpen(d,i)))
+ 'l0,'
+ (y(getClose(d,i))
- y(getLow(d,i)))
+ 'l'
+ (w/2)
+ ',0l'
+ (-w/2)
+ ',0z';
})
//.attr('width', (availableWidth / data[0].values.length) * .9 )
@ -278,7 +311,7 @@ nv.models.ohlcBar = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

24
src/models/pie.js
Unescape Escape View File

@ -7,7 +7,7 @@ nv.models.pie = function() {
getX = function(d) { return d.x },
getY = function(d) { return d.y },
id = Math.floor(Math.random() * 10000), //Create semi-unique ID in case user doesn't select one
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
valueFormat = d3.format(',.2f'),
showLabels = true,
labelThreshold = .02, //if slice percentage is under this, don't show label
@ -32,16 +32,16 @@ nv.models.pie = function() {
});
var wrap = container.selectAll('.wrap.pie').data([getValues(data[0])]);
var wrapEnter = wrap.enter().append('g').attr('class','wrap nvd3 pie chart-' + id);
var wrap = container.selectAll('.nv-wrap.nv-pie').data([getValues(data[0])]);
var wrapEnter = wrap.enter().append('g').attr('class','nvd3 nv-wrap nv-pie nv-chart-' + id);
var gEnter = wrapEnter.append('g');
var g = wrap.select('g')
gEnter.append('g').attr('class', 'pie');
gEnter.append('g').attr('class', 'nv-pie');
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
g.select('.pie').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
g.select('.nv-pie').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
@ -56,13 +56,13 @@ nv.models.pie = function() {
.sort(null)
.value(function(d) { return d.disabled ? 0 : getY(d) });
var slices = wrap.select('.pie').selectAll('.slice')
var slices = wrap.select('.nv-pie').selectAll('.nv-slice')
.data(pie);
slices.exit().remove();
var ae = slices.enter().append('svg:g')
.attr('class', 'slice')
var ae = slices.enter().append('g')
.attr('class', 'nv-slice')
.on('mouseover', function(d,i){
d3.select(this).classed('hover', true);
dispatch.elementMouseover({
@ -108,10 +108,10 @@ nv.models.pie = function() {
});
slices
.attr('fill', function(d,i) { return color[i]; })
.attr('stroke', function(d,i) { return color[i]; });
.attr('fill', function(d,i) { return color(d, i); })
.attr('stroke', function(d,i) { return color(d, i); });
var paths = ae.append('svg:path')
var paths = ae.append('path')
.each(function(d) { this._current = d; });
//.attr('d', arc);
@ -234,7 +234,7 @@ nv.models.pie = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

24
src/models/pieChart.js
Unescape Escape View File

@ -4,7 +4,7 @@ nv.models.pieChart = function() {
width = null,
height = null,
showLegend = true,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
tooltips = true,
tooltip = function(key, y, e, graph) {
return '<h3>' + key + '</h3>' +
@ -40,11 +40,11 @@ nv.models.pieChart = function() {
var wrap = container.selectAll('g.wrap.pieChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 pieChart').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-pieChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-pieChart').append('g');
gEnter.append('g').attr('class', 'pieWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'nv-pieWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
var g = wrap.select('g');
@ -54,7 +54,7 @@ nv.models.pieChart = function() {
.width( availableWidth )
.key(pie.x());
wrap.select('.legendWrap')
wrap.select('.nv-legendWrap')
.datum(pie.values()(data[0]))
.call(legend);
@ -64,7 +64,7 @@ nv.models.pieChart = function() {
- margin.top - margin.bottom;
}
wrap.select('.legendWrap')
wrap.select('.nv-legendWrap')
.attr('transform', 'translate(0,' + (-margin.top) +')');
}
@ -80,7 +80,7 @@ nv.models.pieChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var pieWrap = g.select('.pieWrap')
var pieWrap = g.select('.nv-pieWrap')
.datum(data)
//.datum(data.filter(function(d) { return !d.disabled }))
@ -94,7 +94,7 @@ nv.models.pieChart = function() {
if (!pie.values()(data[0]).filter(function(d) { return !d.disabled }).length) {
pie.values()(data[0]).map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -150,9 +150,9 @@ nv.models.pieChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
pie.color(_);
color = nv.utils.getColor(_);
legend.color(color);
pie.color(color);
return chart;
};

48
src/models/scatter.js
Unescape Escape View File

@ -8,7 +8,7 @@ nv.models.scatter = function() {
var margin = {top: 0, right: 0, bottom: 0, left: 0}
, width = 960
, height = 500
, color = d3.scale.category20().range() // array of colors to be used in order
, color = nv.utils.defaultColor() // chooses color
, id = Math.floor(Math.random() * 100000) //Create semi-unique ID incase user doesn't selet one
, x = d3.scale.linear()
, y = d3.scale.linear()
@ -108,14 +108,14 @@ nv.models.scatter = function() {
//------------------------------------------------------------
// Setup containers and skeleton of chart
var wrap = container.selectAll('g.wrap.scatter').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 scatter chart-' + id + (singlePoint ? ' single-point' : ''));
var wrap = container.selectAll('g.nv-wrap.nv-scatter').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-scatter nv-chart-' + id + (singlePoint ? ' nv-single-point' : ''));
var defsEnter = wrapEnter.append('defs');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g');
gEnter.append('g').attr('class', 'groups');
gEnter.append('g').attr('class', 'point-paths');
gEnter.append('g').attr('class', 'nv-groups');
gEnter.append('g').attr('class', 'nv-point-paths');
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
@ -123,14 +123,14 @@ nv.models.scatter = function() {
defsEnter.append('clipPath')
.attr('id', 'edge-clip-' + id)
.attr('id', 'nv-edge-clip-' + id)
.append('rect');
wrap.select('#edge-clip-' + id + ' rect')
wrap.select('#nv-edge-clip-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
g .attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
@ -152,9 +152,9 @@ nv.models.scatter = function() {
if (clipVoronoi) {
defsEnter.append('clipPath').attr('id', 'points-clip-' + id);
defsEnter.append('clipPath').attr('id', 'nv-points-clip-' + id);
var pointClips = wrap.select('#points-clip-' + id).selectAll('circle')
var pointClips = wrap.select('#nv-points-clip-' + id).selectAll('circle')
.data(vertices);
pointClips.enter().append('circle')
.attr('r', clipRadius);
@ -163,8 +163,8 @@ nv.models.scatter = function() {
.attr('cx', function(d) { return d[0] })
.attr('cy', function(d) { return d[1] });
wrap.select('.point-paths')
.attr('clip-path', 'url(#points-clip-' + id + ')');
wrap.select('.nv-point-paths')
.attr('clip-path', 'url(#nv-points-clip-' + id + ')');
}
@ -178,10 +178,10 @@ nv.models.scatter = function() {
});
var pointPaths = wrap.select('.point-paths').selectAll('path')
var pointPaths = wrap.select('.nv-point-paths').selectAll('path')
.data(voronoi);
pointPaths.enter().append('path')
.attr('class', function(d,i) { return 'path-'+i; });
.attr('class', function(d,i) { return 'nv-path-'+i; });
pointPaths.exit().remove();
pointPaths
.attr('d', function(d) { return 'M' + d.data.join(',') + 'Z'; })
@ -225,7 +225,7 @@ nv.models.scatter = function() {
var groups = wrap.select('.groups').selectAll('.group')
var groups = wrap.select('.nv-groups').selectAll('.nv-group')
.data(function(d) { return d }, function(d) { return d.key });
groups.enter().append('g')
.style('stroke-opacity', 1e-6)
@ -235,16 +235,16 @@ nv.models.scatter = function() {
.style('fill-opacity', 1e-6)
.remove();
groups
.attr('class', function(d,i) { return 'group series-' + i })
.attr('class', function(d,i) { return 'nv-group nv-series-' + i })
.classed('hover', function(d) { return d.hover });
d3.transition(groups)
.style('fill', function(d,i) { return color[i % color.length] })
.style('stroke', function(d,i) { return color[i % color.length] })
.style('fill', function(d,i) { return color(d, i) })
.style('stroke', function(d,i) { return color(d, i) })
.style('stroke-opacity', 1)
.style('fill-opacity', .5);
var points = groups.selectAll('path.point')
var points = groups.selectAll('path.nv-point')
.data(function(d) { return d.values });
points.enter().append('path')
.attr('transform', function(d,i) {
@ -255,12 +255,12 @@ nv.models.scatter = function() {
.type(getShape)
.size(function(d,i) { return z(getSize(d,i)) })
);
d3.transition(groups.exit().selectAll('path.point'))
d3.transition(groups.exit().selectAll('path.nv-point'))
.attr('transform', function(d,i) {
return 'translate(' + x(getX(d,i)) + ',' + y(getY(d,i)) + ')'
})
.remove();
points.attr('class', function(d,i) { return 'point point-' + i });
points.attr('class', function(d,i) { return 'nv-point nv-point-' + i });
d3.transition(points)
.attr('transform', function(d,i) {
return 'translate(' + x(getX(d,i)) + ',' + y(getY(d,i)) + ')'
@ -293,13 +293,13 @@ nv.models.scatter = function() {
dispatch.on('elementMouseover.point', function(d) {
if (interactive)
d3.select('.chart-' + id + ' .series-' + d.seriesIndex + ' .point-' + d.pointIndex)
d3.select('.nv-chart-' + id + ' .nv-series-' + d.seriesIndex + ' .nv-point-' + d.pointIndex)
.classed('hover', true);
});
dispatch.on('elementMouseout.point', function(d) {
if (interactive)
d3.select('.chart-' + id + ' .series-' + d.seriesIndex + ' .point-' + d.pointIndex)
d3.select('.nv-chart-' + id + ' .nv-series-' + d.seriesIndex + ' .nv-point-' + d.pointIndex)
.classed('hover', false);
});
@ -434,7 +434,7 @@ nv.models.scatter = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

98
src/models/scatterChart.js
Unescape Escape View File

@ -8,7 +8,7 @@ nv.models.scatterChart = function() {
var margin = {top: 30, right: 20, bottom: 50, left: 60}
, width = null
, height = null
, color = d3.scale.category20().range()
, color = nv.utils.defaultColor()
//x = scatter.xScale(),
, x = d3.fisheye.scale(d3.scale.linear).distortion(0)
//y = scatter.yScale(),
@ -96,20 +96,20 @@ nv.models.scatterChart = function() {
//------------------------------------------------------------
// Setup containers and skeleton of chart
var wrap = container.selectAll('g.wrap.scatterChart').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 scatterChart chart-' + scatter.id());
var wrap = container.selectAll('g.nv-wrap.nv-scatterChart').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-scatterChart nv-chart-' + scatter.id());
var gEnter = wrapEnter.append('g');
var g = wrap.select('g')
// background for pointer events
gEnter.append('rect').attr('class', 'nvd3 background')
gEnter.append('rect').attr('class', 'nvd3 nv-background')
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'scatterWrap');
gEnter.append('g').attr('class', 'distWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-scatterWrap');
gEnter.append('g').attr('class', 'nv-distWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
@ -119,7 +119,7 @@ nv.models.scatterChart = function() {
if (showLegend) {
legend.width( availableWidth / 2 );
wrap.select('.legendWrap')
wrap.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -129,21 +129,21 @@ nv.models.scatterChart = function() {
- margin.top - margin.bottom;
}
wrap.select('.legendWrap')
wrap.select('.nv-legendWrap')
.attr('transform', 'translate(' + (availableWidth / 2) + ',' + (-margin.top) +')');
}
if (showControls) {
controls.width(180).color(['#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
}
g.select('.background')
g.select('.nv-background')
.attr('width', availableWidth)
.attr('height', availableHeight);
@ -152,10 +152,10 @@ nv.models.scatterChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }))
wrap.select('.scatterWrap')
wrap.select('.nv-scatterWrap')
.datum(data.filter(function(d) { return !d.disabled }))
.call(scatter);
@ -165,7 +165,7 @@ nv.models.scatterChart = function() {
.ticks( availableWidth / 100 )
.tickSize( -availableHeight , 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')')
.call(xAxis);
@ -175,7 +175,7 @@ nv.models.scatterChart = function() {
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
g.select('.y.axis')
g.select('.nv-y.nv-axis')
.call(yAxis);
@ -183,12 +183,12 @@ nv.models.scatterChart = function() {
.scale(x)
.width(availableWidth)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
gEnter.select('.distWrap').append('g')
.attr('class', 'distributionX')
gEnter.select('.nv-distWrap').append('g')
.attr('class', 'nv-distributionX')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
g.select('.distributionX')
g.select('.nv-distributionX')
.datum(data.filter(function(d) { return !d.disabled }))
.call(distX);
@ -197,18 +197,18 @@ nv.models.scatterChart = function() {
.scale(y)
.width(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
gEnter.select('.distWrap').append('g')
.attr('class', 'distributionY')
gEnter.select('.nv-distWrap').append('g')
.attr('class', 'nv-distributionY')
.attr('transform', 'translate(-' + distY.size() + ',0)');
g.select('.distributionY')
g.select('.nv-distributionY')
.datum(data.filter(function(d) { return !d.disabled }))
.call(distY);
g.select('.background').on('mousemove', updateFisheye);
g.select('.background').on('click', function() { pauseFisheye = !pauseFisheye;});
g.select('.nv-background').on('mousemove', updateFisheye);
g.select('.nv-background').on('click', function() { pauseFisheye = !pauseFisheye;});
scatter.dispatch.on('elementClick.freezeFisheye', function() {
pauseFisheye = !pauseFisheye;
});
@ -216,25 +216,25 @@ nv.models.scatterChart = function() {
function updateFisheye() {
if (pauseFisheye) {
g.select('.point-paths').style('pointer-events', 'all');
g.select('.nv-point-paths').style('pointer-events', 'all');
return false;
}
g.select('.point-paths').style('pointer-events', 'none' );
g.select('.nv-point-paths').style('pointer-events', 'none' );
var mouse = d3.mouse(this);
x.distortion(fisheye).focus(mouse[0]);
y.distortion(fisheye).focus(mouse[1]);
g.select('.scatterWrap')
g.select('.nv-scatterWrap')
.datum(data.filter(function(d) { return !d.disabled }))
.call(scatter);
g.select('.x.axis').call(xAxis);
g.select('.y.axis').call(yAxis);
g.select('.distributionX')
g.select('.nv-x.nv-axis').call(xAxis);
g.select('.nv-y.nv-axis').call(yAxis);
g.select('.nv-distributionX')
.datum(data.filter(function(d) { return !d.disabled }))
.call(distX);
g.select('.distributionY')
g.select('.nv-distributionY')
.datum(data.filter(function(d) { return !d.disabled }))
.call(distY);
}
@ -249,16 +249,16 @@ nv.models.scatterChart = function() {
d.disabled = !d.disabled;
fisheye = d.disabled ? 0 : 2.5;
g.select('.background') .style('pointer-events', d.disabled ? 'none' : 'all');
g.select('.point-paths').style('pointer-events', d.disabled ? 'all' : 'none' );
g.select('.nv-background') .style('pointer-events', d.disabled ? 'none' : 'all');
g.select('.nv-point-paths').style('pointer-events', d.disabled ? 'all' : 'none' );
if (d.disabled) {
x.distortion(fisheye).focus(0);
y.distortion(fisheye).focus(0);
g.select('.scatterWrap').call(scatter);
g.select('.x.axis').call(xAxis);
g.select('.y.axis').call(yAxis);
g.select('.nv-scatterWrap').call(scatter);
g.select('.nv-x.nv-axis').call(xAxis);
g.select('.nv-y.nv-axis').call(yAxis);
} else {
pauseFisheye = false;
}
@ -272,7 +272,7 @@ nv.models.scatterChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -293,9 +293,9 @@ nv.models.scatterChart = function() {
*/
scatter.dispatch.on('elementMouseover.tooltip', function(e) {
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .distx-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distx-' + e.pointIndex)
.attr('y1', e.pos[1] - availableHeight);
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .disty-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-disty-' + e.pointIndex)
.attr('x2', e.pos[0] + distX.size());
e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
@ -328,9 +328,9 @@ nv.models.scatterChart = function() {
scatter.dispatch.on('elementMouseout.tooltip', function(e) {
dispatch.tooltipHide(e);
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .distx-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distx-' + e.pointIndex)
.attr('y1', 0);
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .disty-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-disty-' + e.pointIndex)
.attr('x2', distY.size());
});
dispatch.on('tooltipHide', function() {
@ -372,10 +372,10 @@ nv.models.scatterChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
distX.color(_);
distY.color(_);
color = nv.utils.getColor(_);
legend.color(color);
distX.color(color);
distY.color(color);
return chart;
};

87
src/models/scatterFisheyeChart.js
Unescape Escape View File

@ -3,7 +3,7 @@ nv.models.scatterFisheyeChart = function() {
var margin = {top: 30, right: 20, bottom: 50, left: 60},
width = null,
height = null,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
showDistX = false,
showDistY = false,
showLegend = true,
@ -74,29 +74,29 @@ nv.models.scatterFisheyeChart = function() {
y0 = y0 || scatter.yScale();
var wrap = container.selectAll('g.wrap.scatterChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 scatterChart chart-' + scatter.id()).append('g');
var wrap = container.selectAll('g.nv-wrap.nv-scatterChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-scatterChart nv-chart-' + scatter.id()).append('g');
gEnter.append('rect')
.attr('class', 'nvd3 background')
.attr('class', 'nvd3 nv-background')
.attr('width', availableWidth)
.attr('height', availableHeight);
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'scatterWrap');
gEnter.append('g').attr('class', 'controlsWrap');
//gEnter.append('g').attr('class', 'distWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-scatterWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
//gEnter.append('g').attr('class', 'nv-distWrap');
var g = wrap.select('g')
if (showLegend) {
legend.width( availableWidth / 2 );
wrap.select('.legendWrap')
wrap.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -106,7 +106,7 @@ nv.models.scatterFisheyeChart = function() {
- margin.top - margin.bottom;
}
wrap.select('.legendWrap')
wrap.select('.nv-legendWrap')
.attr('transform', 'translate(' + (availableWidth / 2) + ',' + (-margin.top) +')');
}
@ -115,13 +115,13 @@ nv.models.scatterFisheyeChart = function() {
.width(availableWidth)
.height(availableHeight)
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }))
if (showControls) {
controls.width(180).color(['#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
@ -131,7 +131,7 @@ nv.models.scatterFisheyeChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var scatterWrap = wrap.select('.scatterWrap')
var scatterWrap = wrap.select('.nv-scatterWrap')
.datum(data.filter(function(d) { return !d.disabled }));
d3.transition(scatterWrap).call(scatter);
@ -140,9 +140,9 @@ nv.models.scatterFisheyeChart = function() {
.ticks( availableWidth / 100 )
.tickSize( -availableHeight , 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + y.range()[0] + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
@ -150,7 +150,7 @@ nv.models.scatterFisheyeChart = function() {
.ticks( availableHeight / 36 )
.tickSize( -availableWidth, 0);
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
@ -158,27 +158,27 @@ nv.models.scatterFisheyeChart = function() {
//TODO abstract Distribution into its own component
if ( showDistX || showDistY) {
var distWrap = scatterWrap.selectAll('g.distribution')
var distWrap = scatterWrap.selectAll('g.nv-distribution')
.data(function(d) { return d }, function(d) { return d.key });
distWrap.enter().append('g').attr('class', function(d,i) { return 'distribution series-' + i })
distWrap.enter().append('g').attr('class', function(d,i) { return 'nv-distribution nv-series-' + i })
distWrap.style('stroke', function(d,i) { return color.filter(function(d,i) { return data[i] && !data[i].disabled })[i % color.length] })
}
if (showDistX) {
var distX = distWrap.selectAll('line.distX')
var distX = distWrap.selectAll('line.nv-distX')
.data(function(d) { return d.values })
distX.enter().append('line')
.attr('x1', function(d,i) { return x0(scatter.x()(d,i)) })
.attr('x2', function(d,i) { return x0(scatter.x()(d,i)) })
//d3.transition(distX.exit())
d3.transition(distWrap.exit().selectAll('line.distX'))
d3.transition(distWrap.exit().selectAll('line.nv-distX'))
.attr('x1', function(d,i) { return x(scatter.x()(d,i)) })
.attr('x2', function(d,i) { return x(scatter.x()(d,i)) })
.remove();
distX
.attr('class', function(d,i) { return 'distX distX-' + i })
.attr('class', function(d,i) { return 'nv-distX nv-distX-' + i })
.attr('y1', y.range()[0])
.attr('y2', y.range()[0] + 8);
d3.transition(distX)
@ -188,22 +188,23 @@ nv.models.scatterFisheyeChart = function() {
if (showDistY) {
var distY = distWrap.selectAll('line.distY')
var distY = distWrap.selectAll('line.nv-distY')
.data(function(d) { return d.values })
distY.enter().append('line')
.attr('y1', function(d,i) { return y0(scatter.y()(d,i)) })
.attr('y2', function(d,i) { return y0(scatter.y()(d,i)) });
//d3.transition(distY.exit())
d3.transition(distWrap.exit().selectAll('line.distY'))
d3.transition(distWrap.exit().selectAll('line.nv-distY'))
.attr('y1', function(d,i) { return y(scatter.y()(d,i)) })
.attr('y2', function(d,i) { return y(scatter.y()(d,i)) })
.remove();
distY
.attr('class', function(d,i) { return 'distY distY-' + i })
.attr('class', function(d,i) { return 'nv-distY nv-distY-' + i })
.attr('x1', x.range()[0])
.attr('x2', x.range()[0] - 8)
d3.transition(distY)
.attr('y1', function(d,i) { return y(scatter.y()(d,i)) }) .attr('y2', function(d,i) { return y(scatter.y()(d,i)) });
.attr('y1', function(d,i) { return y(scatter.y()(d,i)) })
.attr('y2', function(d,i) { return y(scatter.y()(d,i)) });
}
@ -215,7 +216,7 @@ nv.models.scatterFisheyeChart = function() {
if (!data.filter(function(d) { return !d.disabled }).length) {
data.map(function(d) {
d.disabled = false;
wrap.selectAll('.series').classed('disabled', false);
wrap.selectAll('.nv-series').classed('disabled', false);
return d;
});
}
@ -227,7 +228,7 @@ nv.models.scatterFisheyeChart = function() {
d.disabled = !d.disabled;
fisheye = d.disabled ? 0 : 2.5;
g.select('.background').style('pointer-events', d.disabled ? 'none' : 'all');
g.select('.nv-background').style('pointer-events', d.disabled ? 'none' : 'all');
scatter.interactive(d.disabled);
tooltips = d.disabled;
@ -236,8 +237,8 @@ nv.models.scatterFisheyeChart = function() {
y.distortion(fisheye).focus(0);
scatterWrap.call(scatter);
g.select(".x.axis").call(xAxis);
g.select(".y.axis").call(yAxis);
g.select('.nv-x.nv-axis').call(xAxis);
g.select('.nv-y.nv-axis').call(yAxis);
}
selection.transition().call(chart);
@ -258,28 +259,28 @@ nv.models.scatterFisheyeChart = function() {
scatter.dispatch.on('elementMouseover.tooltip', function(e) {
//scatterWrap.select('.series-' + e.seriesIndex + ' .distX-' + e.pointIndex)
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .distX-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distX-' + e.pointIndex)
.attr('y1', e.pos[1]);
//scatterWrap.select('.series-' + e.seriesIndex + ' .distY-' + e.pointIndex)
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .distY-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distY-' + e.pointIndex)
.attr('x1', e.pos[0]);
e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
dispatch.tooltipShow(e);
});
//if (tooltips) dispatch.on('tooltipShow', function(e) { showTooltip(e, container[0][0].parentNode) } ); // TODO: maybe merge with above?
dispatch.on('tooltipShow', function(e) {
if (tooltips) showTooltip(e, that.parentNode);
dispatch.on('tooltipShow', function(e) {
if (tooltips) showTooltip(e, that.parentNode);
});
scatter.dispatch.on('elementMouseout.tooltip', function(e) {
dispatch.tooltipHide(e);
//scatterWrap.select('.series-' + e.seriesIndex + ' .distX-' + e.pointIndex)
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .distX-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distX-' + e.pointIndex)
.attr('y1', y.range()[0]);
//scatterWrap.select('.series-' + e.seriesIndex + ' .distY-' + e.pointIndex)
d3.select('.chart-' + scatter.id() + ' .series-' + e.seriesIndex + ' .distY-' + e.pointIndex)
d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distY-' + e.pointIndex)
.attr('x1', x.range()[0]);
});
dispatch.on('tooltipHide', nv.tooltip.cleanup);
@ -287,8 +288,8 @@ nv.models.scatterFisheyeChart = function() {
//TODO: get distributions to work with fisheye
g.select('.background').on("mousemove", updateFisheye);
g.select('.point-paths').on("mousemove", updateFisheye);
g.select('.nv-background').on('mousemove', updateFisheye);
g.select('.nv-point-paths').on('mousemove', updateFisheye);
function updateFisheye() {
var mouse = d3.mouse(this);
@ -296,8 +297,8 @@ nv.models.scatterFisheyeChart = function() {
y.distortion(fisheye).focus(mouse[1]);
scatterWrap.call(scatter);
g.select(".x.axis").call(xAxis);
g.select(".y.axis").call(yAxis);
g.select('.nv-x.nv-axis').call(xAxis);
g.select('.nv-y.nv-axis').call(yAxis);
}
//store old scales for use in transitions on update, to animate from old to new positions, and sizes
@ -338,8 +339,8 @@ nv.models.scatterFisheyeChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

12
src/models/sparkline.js
Unescape Escape View File

@ -6,7 +6,7 @@ nv.models.sparkline = function() {
animate = true,
getX = function(d) { return d.x },
getY = function(d) { return d.y },
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
xDomain, yDomain;
var x = d3.scale.linear(),
@ -25,14 +25,14 @@ nv.models.sparkline = function() {
.range([availableHeight, 0]);
var wrap = d3.select(this).selectAll('g.sparkline').data([data]);
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-sparkline').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 sparkline');
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sparkline');
//var gEnter = svg.enter().append('svg').append('g');
//gEnter.append('g').attr('class', 'sparkline')
gEnter
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
.style('stroke', function(d,i) { return d.color || color[i * color.length] });
.style('stroke', function(d,i) { return d.color || color(d, i) });
/*
d3.select(this)
@ -54,9 +54,9 @@ nv.models.sparkline = function() {
// TODO: Add CURRENT data point (Need Min, Mac, Current / Most recent)
var points = gEnter.selectAll('circle.point')
var points = gEnter.selectAll('circle.nv-point')
.data(function(d) { return d.filter(function(p,i) { return y.domain().indexOf(getY(p,i)) != -1 || getX(p,i) == x.domain()[1] }) });
points.enter().append('circle').attr('class', 'point');
points.enter().append('circle').attr('class', 'nv-point');
points.exit().remove();
points
.attr('cx', function(d,i) { return x(getX(d,i)) })

31
src/models/sparklinePlus.js
Unescape Escape View File

@ -6,7 +6,7 @@ nv.models.sparklinePlus = function() {
animate = true,
getX = function(d) { return d.x },
getY = function(d) { return d.y },
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(),
id = Math.floor(Math.random() * 100000), //Create semi-unique ID incase user doesn't selet one
xTickFormat = d3.format(',r'),
yTickFormat = d3.format(',.2f');
@ -27,14 +27,14 @@ nv.models.sparklinePlus = function() {
.range([availableHeight, 0]);
var wrap = d3.select(this).selectAll('g.sparklineplus').data([data]);
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-sparklineplus').data([data]);
var gEnter = wrap.enter().append('g')
//var gEnter = svg.enter().append('svg').append('g');
var sparklineWrap = gEnter.append('g').attr('class', 'nvd3 sparklineplus')
var sparklineWrap = gEnter.append('g').attr('class', 'nvd3 nv-wrap nv-sparklineplus')
.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
.style('stroke', function(d, i){ return d.color || color[i % color.length] });
.style('stroke', function(d, i){ return d.color || color(d, i) });
sparkline
.xDomain(x.domain())
@ -46,8 +46,8 @@ nv.models.sparklinePlus = function() {
//.attr('height', height)
.call(sparkline);
var hoverValue = sparklineWrap.append('g').attr('class', 'hoverValue');
var hoverArea = sparklineWrap.append('g').attr('class', 'hoverArea');
var hoverValue = sparklineWrap.append('g').attr('class', 'nv-hoverValue');
var hoverArea = sparklineWrap.append('g').attr('class', 'nv-hoverArea');
hoverValue.attr('transform', function(d) { return 'translate(' + x(d) + ',0)' });
@ -58,11 +58,11 @@ nv.models.sparklinePlus = function() {
.attr('x2', x.range()[1])
.attr('y2', height)
var hoverX = hoverValue.append('text').attr('class', 'xValue')
var hoverX = hoverValue.append('text').attr('class', 'nv-xValue')
.attr('text-anchor', 'end')
.attr('dy', '.9em')
var hoverY = hoverValue.append('text').attr('class', 'yValue')
var hoverY = hoverValue.append('text').attr('class', 'nv-yValue')
//.attr('transform', function(d) { return 'translate(' + x(d) + ',0)' })
.attr('text-anchor', 'start')
.attr('dy', '.9em')
@ -75,7 +75,7 @@ nv.models.sparklinePlus = function() {
function sparklineHover() {
function sparklineHover() {
var pos = d3.event.offsetX - margin.left;
hoverLine
@ -86,11 +86,22 @@ nv.models.sparklinePlus = function() {
.attr('transform', function(d) { return 'translate(' + (pos - 6) + ',' + (-margin.top) + ')' })
//.text(xTickFormat(pos));
.text(xTickFormat(Math.round(x.invert(pos)))); //TODO: refactor this line
var f = function(data, x){
var distance = Math.abs(getX(data[0]) - x) ;
var closestIndex = 0;
for (var i = 0; i < data.length; i++){
if (Math.abs(getX(data[i]) - x) < distance) {
distance = Math.abs(getX(data[i]) -x);
closestIndex = i;
}
}
return closestIndex;
}
hoverY
.attr('transform', function(d) { return 'translate(' + (pos + 6) + ',' + (-margin.top) + ')' })
//.text(data[pos] && yTickFormat(data[pos].y));
.text(yTickFormat(getY(data[Math.round(x.invert(pos))]))); //TODO: refactor this line
.text(yTickFormat(getY(data[f(data, Math.round(x.invert(pos)))]))); //TODO: refactor this line
}
});

34
src/models/stackedArea.js
Unescape Escape View File

@ -8,7 +8,7 @@ nv.models.stackedArea = function() {
var margin = {top: 0, right: 0, bottom: 0, left: 0},
width = 960,
height = 500,
color = d3.scale.category20().range(), // array of colors to be used in order
color = nv.utils.defaultColor(), // a function that computes the color
id = Math.floor(Math.random() * 100000), //Create semi-unique ID incase user doesn't selet one
getX = function(d) { return d.x }, // accessor to get the x value from a data point
getY = function(d) { return d.y }, // accessor to get the y value from a data point
@ -94,13 +94,13 @@ nv.models.stackedArea = function() {
(data);
var wrap = d3.select(this).selectAll('g.wrap.stackedarea').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 stackedarea');
var wrap = d3.select(this).selectAll('g.nv-wrap.nv-stackedarea').data([data]);
var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-stackedarea');
var defsEnter = wrapEnter.append('defs');
var gEnter = wrapEnter.append('g');
var g = wrap.select('g');
gEnter.append('g').attr('class', 'areaWrap');
gEnter.append('g').attr('class', 'nv-areaWrap');
scatter
@ -110,12 +110,12 @@ nv.models.stackedArea = function() {
.y(function(d) { return d.display.y + d.display.y0 })
.forceY([0])
.color(data.map(function(d,i) {
return d.color || color[i % color.length];
return d.color || color(d, i);
}).filter(function(d,i) { return !data[i].disabled }));
gEnter.append('g').attr('class', 'scatterWrap');
var scatterWrap = g.select('.scatterWrap')
gEnter.append('g').attr('class', 'nv-scatterWrap');
var scatterWrap = g.select('.nv-scatterWrap')
.datum(data.filter(function(d) { return !d.disabled }))
d3.transition(scatterWrap).call(scatter);
@ -126,14 +126,14 @@ nv.models.stackedArea = function() {
defsEnter.append('clipPath')
.attr('id', 'edge-clip-' + id)
.attr('id', 'nv-edge-clip-' + id)
.append('rect');
wrap.select('#edge-clip-' + id + ' rect')
wrap.select('#nv-edge-clip-' + id + ' rect')
.attr('width', availableWidth)
.attr('height', availableHeight);
g .attr('clip-path', clipEdge ? 'url(#edge-clip-' + id + ')' : '');
g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
@ -149,10 +149,10 @@ nv.models.stackedArea = function() {
.y1(function(d) { return y(d.display.y0) });
var path = g.select('.areaWrap').selectAll('path.area')
var path = g.select('.nv-areaWrap').selectAll('path.nv-area')
.data(function(d) { return d });
//.data(function(d) { return d }, function(d) { return d.key });
path.enter().append('path').attr('class', function(d,i) { return 'area area-' + i })
path.enter().append('path').attr('class', function(d,i) { return 'nv-area nv-area-' + i })
.on('mouseover', function(d,i) {
d3.select(this).classed('hover', true);
dispatch.areaMouseover({
@ -184,8 +184,8 @@ nv.models.stackedArea = function() {
.attr('d', function(d,i) { return zeroArea(d.values,i) })
.remove();
path
.style('fill', function(d,i){ return d.color || color[i % color.length] })
.style('stroke', function(d,i){ return d.color || color[i % color.length] });
.style('fill', function(d,i){ return d.color || color(d, i) })
.style('stroke', function(d,i){ return d.color || color(d, i) });
d3.transition(path)
.attr('d', function(d,i) { return area(d.values,i) })
@ -195,10 +195,10 @@ nv.models.stackedArea = function() {
//------------------------------------------------------------
scatter.dispatch.on('elementMouseover.area', function(e) {
g.select('.chart-' + id + ' .area-' + e.seriesIndex).classed('hover', true);
g.select('.nv-chart-' + id + ' .nv-area-' + e.seriesIndex).classed('hover', true);
});
scatter.dispatch.on('elementMouseout.area', function(e) {
g.select('.chart-' + id + ' .area-' + e.seriesIndex).classed('hover', false);
g.select('.nv-chart-' + id + ' .nv-area-' + e.seriesIndex).classed('hover', false);
});
});
@ -272,7 +272,7 @@ nv.models.stackedArea = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
color = nv.utils.getColor(_);
return chart;
};

35
src/models/stackedAreaChart.js
Unescape Escape View File

@ -8,7 +8,8 @@ nv.models.stackedAreaChart = function() {
var margin = {top: 30, right: 25, bottom: 50, left: 60},
width = null,
height = null,
color = d3.scale.category20().range(),
color = nv.utils.defaultColor(), // a function that takes in d, i and
//returns color
showControls = true,
showLegend = true,
tooltips = true,
@ -61,14 +62,14 @@ nv.models.stackedAreaChart = function() {
x = stacked.xScale();
y = stacked.yScale();
var wrap = container.selectAll('g.wrap.stackedAreaChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 stackedAreaChart').append('g');
var wrap = container.selectAll('g.nv-wrap.nv-stackedAreaChart').data([data]);
var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-stackedAreaChart').append('g');
gEnter.append('g').attr('class', 'x axis');
gEnter.append('g').attr('class', 'y axis');
gEnter.append('g').attr('class', 'stackedWrap');
gEnter.append('g').attr('class', 'legendWrap');
gEnter.append('g').attr('class', 'controlsWrap');
gEnter.append('g').attr('class', 'nv-x nv-axis');
gEnter.append('g').attr('class', 'nv-y nv-axis');
gEnter.append('g').attr('class', 'nv-stackedWrap');
gEnter.append('g').attr('class', 'nv-legendWrap');
gEnter.append('g').attr('class', 'nv-controlsWrap');
var g = wrap.select('g');
@ -78,7 +79,7 @@ nv.models.stackedAreaChart = function() {
legend
.width( availableWidth / 2 );
g.select('.legendWrap')
g.select('.nv-legendWrap')
.datum(data)
.call(legend);
@ -88,7 +89,7 @@ nv.models.stackedAreaChart = function() {
- margin.top - margin.bottom;
}
g.select('.legendWrap')
g.select('.nv-legendWrap')
.attr('transform', 'translate(' + ( availableWidth / 2 ) + ',' + (-margin.top) +')');
}
@ -101,7 +102,7 @@ nv.models.stackedAreaChart = function() {
if (showControls) {
controls.width(280).color(['#444', '#444', '#444']);
g.select('.controlsWrap')
g.select('.nv-controlsWrap')
.datum(controlsData)
.attr('transform', 'translate(0,' + (-margin.top) +')')
.call(controls);
@ -111,7 +112,7 @@ nv.models.stackedAreaChart = function() {
g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
var stackedWrap = g.select('.stackedWrap')
var stackedWrap = g.select('.nv-stackedWrap')
.datum(data);
d3.transition(stackedWrap).call(stacked);
@ -121,9 +122,9 @@ nv.models.stackedAreaChart = function() {
.ticks( availableWidth / 100 )
.tickSize( -availableHeight, 0);
g.select('.x.axis')
g.select('.nv-x.nv-axis')
.attr('transform', 'translate(0,' + availableHeight + ')');
d3.transition(g.select('.x.axis'))
d3.transition(g.select('.nv-x.nv-axis'))
.call(xAxis);
yAxis
@ -132,7 +133,7 @@ nv.models.stackedAreaChart = function() {
.tickSize(-availableWidth, 0)
.tickFormat(stacked.offset() == 'expand' ? d3.format('%') : d3.format(',.2f')); //TODO: stacked format should be set by caller
d3.transition(g.select('.y.axis'))
d3.transition(g.select('.nv-y.nv-axis'))
.call(yAxis);
@ -265,8 +266,8 @@ nv.models.stackedAreaChart = function() {
chart.color = function(_) {
if (!arguments.length) return color;
color = _;
legend.color(_);
color = nv.utils.getColor(_);
legend.color(color);
return chart;
};

226
src/nv.d3.css
Unescape Escape View File

@ -94,7 +94,7 @@ svg .title {
font: bold 14px Arial;
}
.nvd3 .background {
.nvd3 .nv-background {
fill: none;
/*
pointer-events: none;
@ -106,46 +106,22 @@ svg .title {
* Brush
*/
.brush .extent {
.nv-brush .extent {
fill-opacity: .125;
shape-rendering: crispEdges;
}
/**********
* Historical Stock
*/
.nvd3.historicalStockChart .dragTarget {
fill-opacity: 0;
stroke: none;
cursor: move;
}
.nvd3.historicalStockChart .brush .extent {
/*
cursor: ew-resize !important;
*/
fill-opacity: 0 !important;
}
.nvd3.historicalStockChart .brushBackground rect {
stroke: #000;
stroke-width: .4;
fill: #fff;
fill-opacity: .5;
}
/**********
* Legend
*/
.nvd3 .legend .series {
.nvd3 .nv-legend .nv-series {
cursor: pointer;
}
.nvd3 .legend .disabled circle {
.nvd3 .nv-legend .disabled circle {
fill-opacity: 0;
}
@ -155,29 +131,29 @@ svg .title {
* Axes
*/
.nvd3 .axis path {
.nvd3 .nv-axis path {
fill: none;
stroke: #000;
stroke-opacity: .75;
shape-rendering: crispEdges;
}
.nvd3 .axis path.domain {
.nvd3 .nv-axis path.domain {
stroke-opacity: .75;
}
.nvd3 .axis line {
.nvd3 .nv-axis line {
fill: none;
stroke: #000;
stroke-opacity: .25;
shape-rendering: crispEdges;
}
.nvd3 .axis line.zero {
.nvd3 .nv-axis line.zero {
stroke-opacity: .75;
}
.nvd3 .axis .axisMaxMin text {
.nvd3 .nv-axis .nv-axisMaxMin text {
font-weight: bold;
}
@ -186,7 +162,7 @@ svg .title {
* Brush
*/
.brush .resize path {
.nv-brush .resize path {
fill: #eee;
stroke: #666;
}
@ -197,12 +173,12 @@ svg .title {
* Bars
*/
.nvd3 .bars .negative rect {
.nvd3 .nv-bars .negative rect {
zfill: brown;
cursor: pointer;
}
.nvd3 .bars rect {
.nvd3 .nv-bars rect {
zfill: steelblue;
cursor: pointer;
fill-opacity: .75;
@ -212,23 +188,23 @@ svg .title {
-webkit-transition: fill-opacity 250ms linear;
}
.nvd3 .bars rect:hover {
.nvd3 .nv-bars rect:hover {
fill-opacity: 1;
}
.nvd3 .bars .hover rect {
.nvd3 .nv-bars .hover rect {
fill: lightblue;
}
.nvd3 .bars text {
.nvd3 .nv-bars text {
fill: rgba(0,0,0,0);
}
.nvd3 .bars .hover text {
.nvd3 .nv-bars .hover text {
fill: rgba(0,0,0,1);
}
.nvd3 .x.axis text {
.nvd3 .nv-x.nv-axis text {
transform: rotate(90);
}
@ -237,9 +213,9 @@ svg .title {
* Bars
*/
.nvd3 .multibar .groups rect,
.nvd3 .multibarHorizontal .groups rect,
.nvd3 .discretebar .groups rect {
.nvd3 .nv-multibar .nv-groups rect,
.nvd3 .nv-multibarHorizontal .nv-groups rect,
.nvd3 .nv-discretebar .nv-groups rect {
stroke-opacity: 0;
transition: fill-opacity 250ms linear;
@ -247,14 +223,14 @@ svg .title {
-webkit-transition: fill-opacity 250ms linear;
}
.nvd3 .multibar .groups rect:hover,
.nvd3 .multibarHorizontal .groups rect:hover,
.nvd3 .discretebar .groups rect:hover {
.nvd3 .nv-multibar .nv-groups rect:hover,
.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
.nvd3 .nv-discretebar .nv-groups rect:hover {
fill-opacity: 1;
}
.nvd3 .discretebar .groups text,
.nvd3 .multibarHorizontal .groups text {
.nvd3 .nv-discretebar .nv-groups text,
.nvd3 .nv-multibarHorizontal .nv-groups text {
font-weight: bold;
fill: rgba(0,0,0,1);
stroke: rgba(0,0,0,0);
@ -264,7 +240,7 @@ svg .title {
* Pie Chart
*/
.nvd3 .pie path {
.nvd3.nv-pie path {
stroke-opacity: 0;
transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
@ -273,18 +249,18 @@ svg .title {
}
.nvd3 .pie .slice text {
.nvd3.nv-pie .nv-slice text {
stroke: #000;
stroke-width: 0;
}
.nvd3 .pie path {
.nvd3.nv-pie path {
stroke: #fff;
stroke-width: 1px;
stroke-opacity: 1;
}
.nvd3 .pie .hover path {
.nvd3.nv-pie .hover path {
fill-opacity: .7;
/*
stroke-width: 6px;
@ -296,7 +272,7 @@ svg .title {
* Lines
*/
.nvd3 .groups path.line {
.nvd3 .nv-groups path.nv-line {
fill: none;
stroke-width: 2.5px;
stroke-linecap: round;
@ -313,7 +289,7 @@ svg .title {
*/
}
.nvd3 .groups path.area {
.nvd3 .nv-groups path.nv-area {
stroke: none;
stroke-linecap: round;
shape-rendering: geometricPrecision;
@ -330,7 +306,7 @@ svg .title {
*/
}
.nvd3 .line.hover path {
.nvd3 .nv-line.hover path {
stroke-width: 6px;
}
@ -341,32 +317,32 @@ svg .title {
}
*/
.nvd3.line .nvd3.scatter .groups .point {
.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
fill-opacity: 0;
stroke-opacity: 0;
}
.nvd3.scatter.single-point .groups .point {
.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
fill-opacity: .5;
stroke-opacity: .5;
}
.nvd3 .groups .point {
.nvd3 .nv-groups .nv-point {
transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-moz-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
-webkit-transition: stroke-width 250ms linear, stroke-opacity 250ms linear;
}
.nvd3.scatter .groups .point.hover,
.nvd3 .groups .point.hover {
.nvd3.nv-scatter .nv-groups .nv-point.hover,
.nvd3 .nv-groups .nv-point.hover {
stroke-width: 20px;
fill-opacity: .5 !important;
stroke-opacity: .5 !important;
}
.nvd3 .point-paths path {
.nvd3 .nv-point-paths path {
stroke: #aaa;
stroke-opacity: 0;
fill: #eee;
@ -375,7 +351,7 @@ svg .title {
.nvd3 .indexLine {
.nvd3 .nv-indexLine {
cursor: ew-resize;
}
@ -384,7 +360,7 @@ svg .title {
* Distribution
*/
.nvd3 .distribution {
.nvd3 .nv-distribution {
pointer-events: none;
}
@ -394,21 +370,21 @@ svg .title {
* Scatter
*/
.nvd3 .groups .point {
.nvd3 .nv-groups .nv-point {
pointer-events: none;
}
.nvd3 .groups .point.hover {
.nvd3 .nv-groups .nv-point.hover {
stroke-width: 20px;
stroke-opacity: .5;
}
.nvd3 .scatter .point.hover {
.nvd3 .nv-scatter .nv-point.hover {
fill-opacity: 1;
}
/*
.group.hover .point {
.nv-group.hover .nv-point {
fill-opacity: 1;
}
*/
@ -418,7 +394,7 @@ svg .title {
* Stacked Area
*/
.nvd3 .stackedarea path.area {
.nvd3.nv-stackedarea path.nv-area {
fill-opacity: .7;
/*
stroke-opacity: .65;
@ -438,7 +414,7 @@ svg .title {
}
.nvd3 .stackedarea path.area.hover {
.nvd3.nv-stackedarea path.nv-area.hover {
fill-opacity: .9;
/*
stroke-opacity: .85;
@ -452,12 +428,12 @@ svg .title {
.nvd3.stackedarea .groups .point {
.nvd3.nv-stackedarea .nv-groups .nv-point {
stroke-opacity: 0;
fill-opacity: 0;
}
.nvd3.stackedarea .groups .point.hover {
.nvd3.nv-stackedarea .nv-groups .nv-point.hover {
stroke-width: 20px;
stroke-opacity: .75;
fill-opacity: 1;
@ -469,11 +445,11 @@ svg .title {
* Line Plus Bar
*/
.nvd3 .linePlusBar .bar rect {
.nvd3.nv-linePlusBar .nv-bar rect {
fill-opacity: .75;
}
.nvd3 .linePlusBar .bar rect:hover {
.nvd3.nv-linePlusBar .nv-bar rect:hover {
fill-opacity: 1;
}
@ -482,19 +458,19 @@ svg .title {
* Bullet
*/
.nvd3.bullet { font: 10px sans-serif; cursor: pointer; }
.nvd3.bullet rect { fill-opacity: .6; }
.nvd3.bullet rect:hover { fill-opacity: 1; }
.nvd3.bullet .marker { stroke: #000; stroke-width: 2px; }
.nvd3.bullet .markerTriangle { stroke: #000; fill: #fff; stroke-width: 1.5px; }
.nvd3.bullet .tick line { stroke: #666; stroke-width: .5px; }
.nvd3.bullet .range.s0 { fill: #eee; }
.nvd3.bullet .range.s1 { fill: #ddd; }
.nvd3.bullet .range.s2 { fill: #ccc; }
.nvd3.bullet .measure.s0 { fill: steelblue; }
.nvd3.bullet .measure.s1 { fill: darkblue; }
.nvd3.bullet .title { font-size: 14px; font-weight: bold; }
.nvd3.bullet .subtitle { fill: #999; }
.nvd3.nv-bullet { font: 10px sans-serif; cursor: pointer; }
.nvd3.nv-bullet rect { fill-opacity: .6; }
.nvd3.nv-bullet rect:hover { fill-opacity: 1; }
.nvd3.nv-bullet .nv-marker { stroke: #000; stroke-width: 2px; }
.nvd3.nv-bullet .nv-markerTriangle { stroke: #000; fill: #fff; stroke-width: 1.5px; }
.nvd3.nv-bullet .nv-tick line { stroke: #666; stroke-width: .5px; }
.nvd3.nv-bullet .nv-range.nv-s0 { fill: #eee; }
.nvd3.nv-bullet .nv-range.nv-s1 { fill: #ddd; }
.nvd3.nv-bullet .nv-range.nv-s2 { fill: #ccc; }
.nvd3.nv-bullet .nv-measure.nv-s0 { fill: steelblue; }
.nvd3.nv-bullet .nv-measure.nv-s1 { fill: darkblue; }
.nvd3.nv-bullet .nv-title { font-size: 14px; font-weight: bold; }
.nvd3.nv-bullet .nv-subtitle { fill: #999; }
@ -503,29 +479,29 @@ svg .title {
* Sparkline plus
*/
.nvd3 .sparklineplus .hoverValue line {
.nvd3.nv-sparklineplus .nv-hoverValue line {
stroke: #f44;
stroke-width: 1.5px;
}
.nvd3 .sparklineplus,
.nvd3 .sparklineplus g {
.nvd3.nv-sparklineplus,
.nvd3.nv-sparklineplus g {
pointer-events: all;
}
.nvd3 .hoverArea {
.nvd3 .nv-hoverArea {
fill-opacity: 0;
stroke-opacity: 0;
}
.nvd3 .sparklineplus .xValue,
.nvd3 .sparklineplus .yValue {
.nvd3.nv-sparklineplus .nv-xValue,
.nvd3.nv-sparklineplus .nv-yValue {
stroke: #666;
font-size: .5em;
font-weight: normal;
}
.nvd3 .sparklineplus .yValue {
.nvd3.nv-sparklineplus .nv-yValue {
stroke: #f66;
}
@ -534,62 +510,88 @@ svg .title {
* historical stock
*/
.nvd3.historicalStock .ticks .tick {
.nvd3.nv-ohlcBar .nv-ticks .nv-tick {
stroke-width: 2px;
}
.nvd3.historicalStock .ticks .tick.hover {
.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
stroke-width: 4px;
}
.nvd3.historicalStock .ticks .tick.positive {
.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
stroke: #2ca02c;
}
.nvd3.historicalStock .ticks .tick.negative {
.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
stroke: #d62728;
}
.nvd3.historicalStockChart .axis .axislabel {
.nvd3.nv-historicalStockChart .nv-axis .nv-axislabel {
font-weight: bold;
}
.nvd3.nv-historicalStockChart .nv-dragTarget {
fill-opacity: 0;
stroke: none;
cursor: move;
}
.nvd3 .nv-brush .extent {
/*
cursor: ew-resize !important;
*/
fill-opacity: 0 !important;
}
.nvd3 .nv-brushBackground rect {
stroke: #000;
stroke-width: .4;
fill: #fff;
fill-opacity: .7;
}
/**********
* Indented Tree
*/
.indentedtree .name {
/**
* TODO: the following 3 selectors are based on classes used in the example. I should either make them standard and leave them here, or move to a CSS file not included in the library
*/
.nvd3.nv-indentedtree .name {
margin-left: 5px;
}
.indentedtree .childrenCount {
.nvd3.nv-indentedtree .clickable {
color: #08C;
cursor: pointer;
}
.nvd3.nv-indentedtree span.clickable:hover {
color: #005580;
text-decoration: underline;
}
.nvd3.nv-indentedtree .nv-childrenCount {
display: inline-block;
margin-left: 5px;
}
.indentedtree .treeicon {
.nvd3.nv-indentedtree .nv-treeicon {
cursor: pointer;
/*
cursor: n-resize;
*/
}
.indentedtree .treeicon.folded {
.nvd3.nv-indentedtree .nv-treeicon.nv-folded {
cursor: pointer;
/*
cursor: s-resize;
*/
}
.nvd3.indentedtree .clickable {
color: #08C;
cursor: pointer;
}
.nvd3.indentedtree span.clickable:hover {
color: #005580;
text-decoration: underline;
}

21
src/utils.js
Unescape Escape View File

@ -37,3 +37,24 @@ nv.utils.windowResize = function(fun){
fun(e);
}
}
// Backwards compatible way to implement more d3-like coloring of graphs.
// If passed an array, wrap it in a function which implements the old default
// behaviour
nv.utils.getColor = function(color){
if( Object.prototype.toString.call( color ) === '[object Array]' )
return function(d, i) { return d.color || color[i % color.length]; };
else
return color;
//can't really help it if someone passes rubish as color
}
// Default color chooser uses the index of an object as before.
//
//
nv.utils.defaultColor = function(){
var colors = d3.scale.category20().range();
return function(d, i) {return colors[i % colors.length]};
}

Write Preview
Loading…
Cancel
Save