summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorOlivier Dony <odo@openerp.com>2015-10-30 10:46:57 +0100
committerOlivier Dony <odo@openerp.com>2015-10-30 10:47:13 +0100
commitff2069eb69213651a8f77ea7252ba8dc3a708dd7 (patch)
tree9294cf27839f0de29f946650fd800138304f502f
parent23d7caa8d50de8b5307936af2750c2ffe9c82540 (diff)
parent9a3e9291ffa1509f4afa0f35f9d8d71b6e0932d0 (diff)
[MERGE] Forward-port 9.0 up to 9a3e9291ffa1509f4afa0f35f9d8d71b6e0932d1
-rw-r--r--addons/account/static/src/js/account_journal_dashboard_widget.js27
-rw-r--r--addons/account/static/src/less/account_journal_dashboard.less8
-rw-r--r--addons/account_asset/views/account_asset_view.xml2
-rw-r--r--addons/crm/crm_lead_view.xml20
-rw-r--r--addons/google_calendar/google_calendar.py6
-rw-r--r--addons/im_livechat/i18n/en_US.po21
-rw-r--r--addons/im_livechat/models/im_livechat_channel.py2
-rw-r--r--addons/mass_mailing/models/mail_mail.py5
-rw-r--r--addons/payment/models/payment_acquirer.py2
-rw-r--r--addons/point_of_sale/report/pos_order_report_view.xml4
-rw-r--r--addons/point_of_sale/static/src/js/screens.js5
-rw-r--r--addons/point_of_sale/views/report_sessionsummary.xml3
-rw-r--r--addons/portal/wizard/portal_wizard.py2
-rw-r--r--addons/sale/report/sale_report_view.xml2
-rw-r--r--addons/sale/sales_team.py2
-rw-r--r--addons/stock/stock.py13
-rw-r--r--addons/stock/wizard/stock_change_product_qty.py2
-rw-r--r--addons/stock_landed_costs/stock_landed_costs.py2
-rw-r--r--addons/stock_landed_costs/stock_landed_costs_view.xml2
-rw-r--r--addons/warning/warning.py2
-rw-r--r--addons/web/controllers/main.py6
-rwxr-xr-xaddons/web/static/lib/nvd3/d3.v3.js8353
-rwxr-xr-xaddons/web/static/lib/nvd3/nv.d3.css1393
-rwxr-xr-xaddons/web/static/lib/nvd3/nv.d3.js24528
-rw-r--r--addons/web/static/src/js/framework/data.js2
-rw-r--r--addons/web/static/src/js/views/form_widgets.js2
-rw-r--r--addons/web/static/src/js/views/graph_widget.js4
-rw-r--r--addons/web/static/src/js/widgets/progress_bar.js3
-rw-r--r--addons/web/static/src/xml/base.xml24
-rw-r--r--addons/web_editor/static/src/js/snippets.editor.js21
-rw-r--r--addons/web_editor/static/src/js/summernote.js29
-rw-r--r--addons/web_editor/static/src/js/tour.rte.js2
-rw-r--r--addons/web_editor/static/src/js/widgets.js6
-rw-r--r--addons/web_editor/static/src/less/web_editor.less8
-rw-r--r--addons/web_kanban/static/src/xml/web_kanban.xml2
-rw-r--r--addons/website/controllers/main.py36
-rw-r--r--addons/website/models/website.py2
-rw-r--r--addons/website/static/src/css/editor.css10
-rw-r--r--addons/website/static/src/css/editor.sass10
-rw-r--r--addons/website/static/src/css/website.editor.css10
-rw-r--r--addons/website/static/src/css/website.editor.sass10
-rw-r--r--addons/website/static/src/js/website.snippets.gallery.js2
-rw-r--r--addons/website/static/src/js/website.theme.js81
-rw-r--r--addons/website_forum/models/forum.py2
-rw-r--r--addons/website_links/static/src/js/website_links_charts.js2
-rw-r--r--addons/website_membership/controllers/main.py20
-rw-r--r--addons/website_payment/views/website_payment_templates.xml4
-rw-r--r--addons/website_quote/controllers/main.py6
-rw-r--r--addons/website_quote/static/src/js/website_quotation.js30
-rw-r--r--addons/website_quote/views/website_quotation.xml10
-rw-r--r--addons/website_sale/models/sale_order.py37
-rw-r--r--addons/website_sale/tests/test_website_sale_pricelist.py1
-rw-r--r--addons/website_sale/views/templates.xml34
-rw-r--r--addons/website_sale_options/views/templates.xml6
-rw-r--r--doc/cla/individual/barsi.md11
-rw-r--r--doc/howtos/web.rst2
-rw-r--r--openerp/addons/base/ir/ir_ui_view.py2
-rw-r--r--openerp/addons/base/res/res_company_view.xml4
-rw-r--r--openerp/addons/base/res/res_currency_data.xml2
-rw-r--r--openerp/addons/base/tests/test_ir_filters.py24
-rw-r--r--openerp/addons/base/tests/test_views.py4
-rw-r--r--openerp/models.py8
-rw-r--r--openerp/service/model.py7
63 files changed, 17376 insertions, 17516 deletions
diff --git a/addons/account/static/src/js/account_journal_dashboard_widget.js b/addons/account/static/src/js/account_journal_dashboard_widget.js
index 1bb09a4154c..eb3ffbbeaa9 100644
--- a/addons/account/static/src/js/account_journal_dashboard_widget.js
+++ b/addons/account/static/src/js/account_journal_dashboard_widget.js
@@ -27,10 +27,6 @@ var JournalDashboardGraph = kanban_widgets.AbstractField.extend({
margin: {'left': 0, 'right': 0, 'top': 0, 'bottom': 0},
showYAxis: false,
showLegend: false,
- tooltips: true,
- tooltipContent: function(key, x, y, e, graph) {
- return self.create_tooltip(x, y, e);
- },
});
self.chart.xAxis
.tickFormat(function(d) {
@@ -55,11 +51,7 @@ var JournalDashboardGraph = kanban_widgets.AbstractField.extend({
.y(function(d) { return d.value })
.showValues(false)
.showYAxis(false)
- .margin({'left': 0, 'right': 0, 'top': 0, 'bottom': 40})
- .tooltips(true)
- .tooltipContent(function(key, x, y, e, graph) {
- return self.create_tooltip(x, y, e);
- });
+ .margin({'left': 0, 'right': 0, 'top': 0, 'bottom': 40});
self.chart.xAxis.axisLabel(self.data[0].title);
self.chart.yAxis.tickFormat(d3.format(',.2f'));
@@ -94,23 +86,6 @@ var JournalDashboardGraph = kanban_widgets.AbstractField.extend({
}
},
- create_tooltip: function(x, y, e){
- var header = _.findWhere(e.series.values, {x: x})
- header = header && header.name || x;
-
- var $tooltip = $('<div>').addClass('o_tooltip');
-
- $('<b>')
- .addClass('o_tooltip_title')
- .html(header)
- .appendTo($tooltip)
- $('<div>')
- .addClass('o_tooltip_content')
- .html('Balance ' + y)
- .appendTo($tooltip)
- return $tooltip[0].outerHTML;
- },
-
destroy: function(){
nv.utils.offWindowResize(this.on_resize);
this._super();
diff --git a/addons/account/static/src/less/account_journal_dashboard.less b/addons/account/static/src/less/account_journal_dashboard.less
index c5538003e5e..564f39b4006 100644
--- a/addons/account/static/src/less/account_journal_dashboard.less
+++ b/addons/account/static/src/less/account_journal_dashboard.less
@@ -37,14 +37,6 @@
.o_kanban_graph_section {
.o-position-absolute(auto, 0, 0, 0);
-
- .nvtooltip {
- padding: 0 8px;
- .o_tooltip_content {
- color: @odoo-brand-primary;
- font-weight: bold;
- }
- }
.o_graph_linechart {
> svg {
height: 75px;
diff --git a/addons/account_asset/views/account_asset_view.xml b/addons/account_asset/views/account_asset_view.xml
index 50838035f3c..8a63fd15ea6 100644
--- a/addons/account_asset/views/account_asset_view.xml
+++ b/addons/account_asset/views/account_asset_view.xml
@@ -128,7 +128,7 @@
<label for="partner_id" string="Vendor" attrs="{'invisible': [('type','!=','purchase')]}"/>
</div>
<field name="partner_id" string="Partner" nolabel="1"/>
- <field name="invoice_id" string="Invoice"/>
+ <field name="invoice_id" string="Invoice" options="{'no_create': True}"/>
</group>
</group>
<notebook colspan="4">
diff --git a/addons/crm/crm_lead_view.xml b/addons/crm/crm_lead_view.xml
index 7c3acb048ef..fdadc2773b3 100644
--- a/addons/crm/crm_lead_view.xml
+++ b/addons/crm/crm_lead_view.xml
@@ -47,7 +47,6 @@
<form string="Sales Tags">
<group>
<field name="name"/>
- <field name="team_id"/>
<field name="color"/>
</group>
</form>
@@ -60,7 +59,6 @@
<field name="arch" type="xml">
<tree string="Sales Tags">
<field name="name"/>
- <field name="team_id"/>
<field name="color"/>
</tree>
</field>
@@ -371,7 +369,7 @@
help="No salesperson"/>
<separator />
<filter string="Important Messages" name="message_needaction" domain="[('message_needaction','=',True)]"/>
- <filter string="Archived" domain="[('active', '=', False)]"/>
+ <filter string="Archived" name="archived" domain="[('active', '=', False)]"/>
<separator />
<filter string="Followup" name="activities"
domain="[('date_action', '&lt;=', datetime.datetime.now().replace(hour=23, minute=59, second=59))]"/>
@@ -380,15 +378,15 @@
name='not_opt_out' domain="[('opt_out', '=', False)]"
help="Leads that did not ask not to be included in mass mailing campaigns"/>
<group expand="0" string="Group By">
- <filter string="Salesperson" domain="[]" context="{'group_by':'user_id'}"/>
- <filter string="Sales Team" domain="[]" context="{'group_by':'team_id'}"/>
- <filter string="Stage" domain="[]" context="{'group_by':'stage_id'}"/>
+ <filter string="Salesperson" name="groupby_salesperson" domain="[]" context="{'group_by':'user_id'}"/>
+ <filter string="Sales Team" name="groupby_team" domain="[]" context="{'group_by':'team_id'}"/>
+ <filter string="Stage" name="groupby_stage" domain="[]" context="{'group_by':'stage_id'}"/>
<filter name="customer" string="Customer" help="Partner" domain="[]" context="{'group_by':'partner_id'}"/>
- <filter string="Campaign" domain="[]" context="{'group_by':'campaign_id'}"/>
- <filter string="Source" domain="[]" context="{'group_by':'source_id'}"/>
- <filter string="Channel" domain="[]" context="{'group_by':'medium_id'}"/>
- <filter string="Creation Month" domain="[]" context="{'group_by':'create_date'}"/>
- <filter string="Expected Closing" domain="[]" context="{'group_by':'date_deadline'}"/>
+ <filter string="Campaign" name="groupby_campaign" domain="[]" context="{'group_by':'campaign_id'}"/>
+ <filter string="Source" name="groupby_source" domain="[]" context="{'group_by':'source_id'}"/>
+ <filter string="Channel" name="groupby_channel" domain="[]" context="{'group_by':'medium_id'}"/>
+ <filter string="Creation Month" name="groupby_createmonth" domain="[]" context="{'group_by':'create_date'}"/>
+ <filter string="Expected Closing" name="groupby_expectclosing" domain="[]" context="{'group_by':'date_deadline'}"/>
</group>
</search>
</field>
diff --git a/addons/google_calendar/google_calendar.py b/addons/google_calendar/google_calendar.py
index 7e17d1aaf45..e00b97a8336 100644
--- a/addons/google_calendar/google_calendar.py
+++ b/addons/google_calendar/google_calendar.py
@@ -857,11 +857,9 @@ class google_calendar(osv.AbstractModel):
if actSrc == 'GG':
try:
self.delete_an_event(cr, uid, current_event[0], context=context)
- except Exception, e:
- error = json.loads(e.read())
- error_nr = error.get('error', {}).get('code')
+ except urllib2.HTTPError, e:
# if already deleted from gmail or never created
- if error_nr in (404, 410,):
+ if e.code in (404, 410,):
pass
else:
raise e
diff --git a/addons/im_livechat/i18n/en_US.po b/addons/im_livechat/i18n/en_US.po
new file mode 100644
index 00000000000..c3509e10c1a
--- /dev/null
+++ b/addons/im_livechat/i18n/en_US.po
@@ -0,0 +1,21 @@
+# Translation of Odoo Server.
+# This file contains the translation of the following modules:
+# * im_livechat
+#
+msgid ""
+msgstr ""
+"Project-Id-Version: Odoo Server 9.0\n"
+"Report-Msgid-Bugs-To: \n"
+"POT-Creation-Date: 2015-10-09 09:20+0000\n"
+"PO-Revision-Date: 2015-10-09 09:20+0000\n"
+"Last-Translator: <>\n"
+"Language-Team: \n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+"Content-Transfer-Encoding: \n"
+"Plural-Forms: \n"
+
+#. module: im_livechat
+#: model:ir.model.fields,field_description:im_livechat.field_im_livechat_report_channel_partner_id
+msgid "Opertor"
+msgstr "Operator"
diff --git a/addons/im_livechat/models/im_livechat_channel.py b/addons/im_livechat/models/im_livechat_channel.py
index 4ffb7e7246e..128a3de7220 100644
--- a/addons/im_livechat/models/im_livechat_channel.py
+++ b/addons/im_livechat/models/im_livechat_channel.py
@@ -199,7 +199,7 @@ class ImLivechatChannel(models.Model):
if country_code:
country_ids = self.env['res.country'].sudo().search([('code', '=', country_code)])
if country_ids:
- country_id = country_ids[0]
+ country_id = country_ids[0].id
# extract url
url = request.httprequest.headers.get('Referer') or request.httprequest.base_url
# find the match rule for the given country and url
diff --git a/addons/mass_mailing/models/mail_mail.py b/addons/mass_mailing/models/mail_mail.py
index 7ad891944ac..4efc67fffda 100644
--- a/addons/mass_mailing/models/mail_mail.py
+++ b/addons/mass_mailing/models/mail_mail.py
@@ -82,8 +82,9 @@ class MailMail(osv.Model):
body = tools.append_content_to_html(base, body, plaintext=False, container_tag='div')
# resolve relative image url to absolute for outlook.com
def _sub_relative2absolute(match):
- return match.group(1) + urlparse.urljoin(domain, match.group(2)) + '"'
- body = re.sub('(<img(?=\s)[^>]*\ssrc=")(/[^/][^"]+)"', _sub_relative2absolute, body)
+ return match.group(1) + urlparse.urljoin(domain, match.group(2))
+ body = re.sub('(<img(?=\s)[^>]*\ssrc=")(/[^/][^"]+)', _sub_relative2absolute, body)
+ body = re.sub(r'(<[^>]+\bstyle="[^"]+\burl\(\'?)(/[^/\'][^\'")]+)', _sub_relative2absolute, body)
# generate tracking URL
if mail.statistics_ids:
diff --git a/addons/payment/models/payment_acquirer.py b/addons/payment/models/payment_acquirer.py
index 7576b12d767..b32bb3fe6ff 100644
--- a/addons/payment/models/payment_acquirer.py
+++ b/addons/payment/models/payment_acquirer.py
@@ -393,7 +393,7 @@ class PaymentTransaction(osv.Model):
custom_method_name = '%s_compute_fees' % acquirer.provider
if hasattr(Acquirer, custom_method_name):
fees = getattr(Acquirer, custom_method_name)(
- cr, uid, acquirer.id, values.get('amount', 0.0), values.get('currency_id'), values.get('country_id'), context=None)
+ cr, uid, acquirer.id, values.get('amount', 0.0), values.get('currency_id'), values.get('partner_country_id'), context=None)
values['fees'] = float_round(fees, 2)
# custom create
diff --git a/addons/point_of_sale/report/pos_order_report_view.xml b/addons/point_of_sale/report/pos_order_report_view.xml
index 724136b1bb3..56eb552b557 100644
--- a/addons/point_of_sale/report/pos_order_report_view.xml
+++ b/addons/point_of_sale/report/pos_order_report_view.xml
@@ -40,8 +40,8 @@
<field name="config_id"/>
<field name="partner_id"/>
<field name="user_id"/>
- <field name="partner_id"/>
- <field name="user_id"/>
+ <field name="product_id"/>
+ <field name="product_categ_id"/>
<group expand="1" string="Group By">
<filter string="Salesperson" name="User" context="{'group_by':'user_id'}"/>
<filter string="Product Category" context="{'group_by':'product_categ_id'}"/>
diff --git a/addons/point_of_sale/static/src/js/screens.js b/addons/point_of_sale/static/src/js/screens.js
index a731d50b4c4..e6c7bb260ca 100644
--- a/addons/point_of_sale/static/src/js/screens.js
+++ b/addons/point_of_sale/static/src/js/screens.js
@@ -1809,6 +1809,11 @@ var PaymentScreenWidget = ScreenWidget.extend({
return;
}
+ // get rid of payment lines with an amount of 0, because
+ // since accounting v9 we cannot have bank statement lines
+ // with an amount of 0
+ order.clean_empty_paymentlines();
+
var plines = order.get_paymentlines();
for (var i = 0; i < plines.length; i++) {
if (plines[i].get_type() === 'bank' && plines[i].get_amount() < 0) {
diff --git a/addons/point_of_sale/views/report_sessionsummary.xml b/addons/point_of_sale/views/report_sessionsummary.xml
index 483fadd99aa..052ce7c2e70 100644
--- a/addons/point_of_sale/views/report_sessionsummary.xml
+++ b/addons/point_of_sale/views/report_sessionsummary.xml
@@ -79,8 +79,7 @@
t-field-options='{"widget": "monetary", "display_currency": "statement.currency_id"}'/>
</td>
<td class="text-right" groups="base.group_multi_currency">
- <span t-field="statement.currency"
- t-field-options='{"widget": "monetary", "display_currency": "statement.currency"}'/>
+ <span t-field="statement.currency"/>
</td>
<td class="text-right"><span t-field="statement.state"/></td>
</tr>
diff --git a/addons/portal/wizard/portal_wizard.py b/addons/portal/wizard/portal_wizard.py
index 74bbc7d1237..a48d730ad03 100644
--- a/addons/portal/wizard/portal_wizard.py
+++ b/addons/portal/wizard/portal_wizard.py
@@ -140,8 +140,8 @@ class wizard_user(osv.osv_memory):
wizard_user.user_id.write({'active': True, 'groups_id': [(4, portal.id)]})
# prepare for the signup process
wizard_user.user_id.partner_id.signup_prepare()
+ self._send_email(cr, uid, wizard_user.id, context)
wizard_user.refresh()
- self._send_email(cr, uid, wizard_user.id, context)
else:
# remove the user (if it exists) from the portal group
if wizard_user.user_id and (portal in wizard_user.user_id.groups_id):
diff --git a/addons/sale/report/sale_report_view.xml b/addons/sale/report/sale_report_view.xml
index ec87e15eb8b..7e26b9fb9d5 100644
--- a/addons/sale/report/sale_report_view.xml
+++ b/addons/sale/report/sale_report_view.xml
@@ -66,7 +66,7 @@
<field name="product_id"/>
<field name="user_id"/>
<group expand="0" string="Extended Filters">
- <field name="categ_id"/>
+ <field name="categ_id" filter_domain="[('categ_id', 'child_of', self)]"/>
<field name="company_id" groups="base.group_multi_company"/>
</group>
<group expand="1" string="Group By">
diff --git a/addons/sale/sales_team.py b/addons/sale/sales_team.py
index ecdecea782f..c4a593cf11d 100644
--- a/addons/sale/sales_team.py
+++ b/addons/sale/sales_team.py
@@ -62,4 +62,4 @@ class crm_team(osv.Model):
}
def update_invoiced_target(self, cr, uid, id, value, context=None):
- return self.write(cr, uid, [id], {'invoiced_target': round(float(value))}, context=context)
+ return self.write(cr, uid, [id], {'invoiced_target': round(float(value or 0))}, context=context)
diff --git a/addons/stock/stock.py b/addons/stock/stock.py
index 1b568b681d3..2de7f0def26 100644
--- a/addons/stock/stock.py
+++ b/addons/stock/stock.py
@@ -2341,7 +2341,7 @@ class stock_move(osv.osv):
context = context or {}
quant_obj = self.pool.get("stock.quant")
uom_obj = self.pool['product.uom']
- to_assign_moves = []
+ to_assign_moves = set()
main_domain = {}
todo_moves = []
operations = set()
@@ -2349,12 +2349,12 @@ class stock_move(osv.osv):
if move.state not in ('confirmed', 'waiting', 'assigned'):
continue
if move.location_id.usage in ('supplier', 'inventory', 'production'):
- to_assign_moves.append(move.id)
+ to_assign_moves.add(move.id)
#in case the move is returned, we want to try to find quants before forcing the assignment
if not move.origin_returned_move_id:
continue
if move.product_id.type == 'consu':
- to_assign_moves.append(move.id)
+ to_assign_moves.add(move.id)
continue
else:
todo_moves.append(move)
@@ -2419,7 +2419,7 @@ class stock_move(osv.osv):
#force assignation of consumable products and incoming from supplier/inventory/production
# Do not take force_assign as it would create pack operations
if to_assign_moves:
- self.write(cr, uid, to_assign_moves, {'state': 'assigned'}, context=context)
+ self.write(cr, uid, list(to_assign_moves), {'state': 'assigned'}, context=context)
if not no_prepare:
self.check_recompute_pack_op(cr, uid, ids, context=context)
@@ -2783,12 +2783,15 @@ class stock_move(osv.osv):
'product_uom_qty': uom_qty,
'procure_method': 'make_to_stock',
'restrict_lot_id': restrict_lot_id,
- 'restrict_partner_id': restrict_partner_id,
'split_from': move.id,
'procurement_id': move.procurement_id.id,
'move_dest_id': move.move_dest_id.id,
'origin_returned_move_id': move.origin_returned_move_id.id,
}
+
+ if restrict_partner_id:
+ defaults['restrict_partner_id'] = restrict_partner_id
+
if context.get('source_location_id'):
defaults['location_id'] = context['source_location_id']
new_move = self.copy(cr, uid, move.id, defaults, context=context)
diff --git a/addons/stock/wizard/stock_change_product_qty.py b/addons/stock/wizard/stock_change_product_qty.py
index c21d61b9a3b..0216dce3367 100644
--- a/addons/stock/wizard/stock_change_product_qty.py
+++ b/addons/stock/wizard/stock_change_product_qty.py
@@ -44,7 +44,7 @@ class stock_change_product_qty(osv.osv_memory):
try:
self.pool.get('stock.location').check_access_rule(cr, uid, [location_id], 'read', context=context)
except (AccessError):
- pass
+ location_id = False
res['location_id'] = location_id
return res
diff --git a/addons/stock_landed_costs/stock_landed_costs.py b/addons/stock_landed_costs/stock_landed_costs.py
index 83d96f44035..20a81845924 100644
--- a/addons/stock_landed_costs/stock_landed_costs.py
+++ b/addons/stock_landed_costs/stock_landed_costs.py
@@ -182,13 +182,13 @@ class stock_landed_cost(osv.osv):
if not cost.valuation_adjustment_lines or not self._check_sum(cr, uid, cost, context=context):
raise UserError(_('You cannot validate a landed cost which has no valid valuation adjustments lines. Did you click on Compute?'))
move_id = self._create_account_move(cr, uid, cost, context=context)
- quant_dict = {}
for line in cost.valuation_adjustment_lines:
if not line.move_id:
continue
per_unit = line.final_cost / line.quantity
diff = per_unit - line.former_cost_per_unit
quants = [quant for quant in line.move_id.quant_ids]
+ quant_dict = {}
for quant in quants:
if quant.id not in quant_dict:
quant_dict[quant.id] = quant.cost + diff
diff --git a/addons/stock_landed_costs/stock_landed_costs_view.xml b/addons/stock_landed_costs/stock_landed_costs_view.xml
index ee57b5e8e0a..b4a7e6c4861 100644
--- a/addons/stock_landed_costs/stock_landed_costs_view.xml
+++ b/addons/stock_landed_costs/stock_landed_costs_view.xml
@@ -189,7 +189,7 @@
<group>
<field name="split_method"/>
<field name="standard_price"/>
- <field name="property_account_expense_id"/>
+ <field name="property_account_expense_id" domain="[('internal_type','=','other'),('deprecated', '=', False)]"/>
</group>
<group>
<field name="company_id" groups="base.group_multi_company" options="{'no_create': True}"/>
diff --git a/addons/warning/warning.py b/addons/warning/warning.py
index 5966a7631ff..206f5ea7fb6 100644
--- a/addons/warning/warning.py
+++ b/addons/warning/warning.py
@@ -108,7 +108,7 @@ class purchase_order(osv.Model):
class account_invoice(osv.osv):
_inherit = 'account.invoice'
- @api.onchange('partner_id')
+ @api.onchange('partner_id', 'company_id')
def _onchange_partner_id(self):
result = super(account_invoice, self)._onchange_partner_id()
partner = self.partner_id
diff --git a/addons/web/controllers/main.py b/addons/web/controllers/main.py
index 543f1b9bd7f..701dc6824a1 100644
--- a/addons/web/controllers/main.py
+++ b/addons/web/controllers/main.py
@@ -34,7 +34,6 @@ import openerp
import openerp.modules.registry
from openerp.addons.base.ir.ir_qweb import AssetsBundle, QWebTemplateNotFound
from openerp.modules import get_module_resource
-from openerp.service import model as service_model
from openerp.tools import topological_sort
from openerp.tools.translate import _
from openerp.tools import ustr
@@ -964,10 +963,7 @@ class DataSet(http.Controller):
if method.startswith('_'):
raise AccessError(_("Underscore prefixed methods cannot be remotely called"))
- @service_model.check
- def checked_call(__dbname, *args, **kwargs):
- return getattr(request.registry.get(model), method)(request.cr, request.uid, *args, **kwargs)
- return checked_call(request.db, *args, **kwargs)
+ return getattr(request.registry.get(model), method)(request.cr, request.uid, *args, **kwargs)
@http.route('/web/dataset/call', type='json', auth="user")
def call(self, model, method, args, domain_id=None, context_id=None):
diff --git a/addons/web/static/lib/nvd3/d3.v3.js b/addons/web/static/lib/nvd3/d3.v3.js
index 8dd7ffe7419..e4d8664329e 100755
--- a/addons/web/static/lib/nvd3/d3.v3.js
+++ b/addons/web/static/lib/nvd3/d3.v3.js
@@ -1,32 +1,67 @@
-d3 = function() {
+!function() {
var d3 = {
- version: "3.1.5"
+ version: "3.5.6"
};
+ var d3_arraySlice = [].slice, d3_array = function(list) {
+ return d3_arraySlice.call(list);
+ };
+ var d3_document = this.document;
+ function d3_documentElement(node) {
+ return node && (node.ownerDocument || node.document || node).documentElement;
+ }
+ function d3_window(node) {
+ return node && (node.ownerDocument && node.ownerDocument.defaultView || node.document && node || node.defaultView);
+ }
+ if (d3_document) {
+ try {
+ d3_array(d3_document.documentElement.childNodes)[0].nodeType;
+ } catch (e) {
+ d3_array = function(list) {
+ var i = list.length, array = new Array(i);
+ while (i--) array[i] = list[i];
+ return array;
+ };
+ }
+ }
if (!Date.now) Date.now = function() {
return +new Date();
};
- var d3_document = document, d3_window = window;
- try {
- d3_document.createElement("div").style.setProperty("opacity", 0, "");
- } catch (error) {
- var d3_style_prototype = d3_window.CSSStyleDeclaration.prototype, d3_style_setProperty = d3_style_prototype.setProperty;
- d3_style_prototype.setProperty = function(name, value, priority) {
- d3_style_setProperty.call(this, name, value + "", priority);
- };
+ if (d3_document) {
+ try {
+ d3_document.createElement("DIV").style.setProperty("opacity", 0, "");
+ } catch (error) {
+ var d3_element_prototype = this.Element.prototype, d3_element_setAttribute = d3_element_prototype.setAttribute, d3_element_setAttributeNS = d3_element_prototype.setAttributeNS, d3_style_prototype = this.CSSStyleDeclaration.prototype, d3_style_setProperty = d3_style_prototype.setProperty;
+ d3_element_prototype.setAttribute = function(name, value) {
+ d3_element_setAttribute.call(this, name, value + "");
+ };
+ d3_element_prototype.setAttributeNS = function(space, local, value) {
+ d3_element_setAttributeNS.call(this, space, local, value + "");
+ };
+ d3_style_prototype.setProperty = function(name, value, priority) {
+ d3_style_setProperty.call(this, name, value + "", priority);
+ };
+ }
}
- d3.ascending = function(a, b) {
+ d3.ascending = d3_ascending;
+ function d3_ascending(a, b) {
return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
- };
+ }
d3.descending = function(a, b) {
return b < a ? -1 : b > a ? 1 : b >= a ? 0 : NaN;
};
d3.min = function(array, f) {
var i = -1, n = array.length, a, b;
if (arguments.length === 1) {
- while (++i < n && ((a = array[i]) == null || a != a)) a = undefined;
+ while (++i < n) if ((b = array[i]) != null && b >= b) {
+ a = b;
+ break;
+ }
while (++i < n) if ((b = array[i]) != null && a > b) a = b;
} else {
- while (++i < n && ((a = f.call(array, array[i], i)) == null || a != a)) a = undefined;
+ while (++i < n) if ((b = f.call(array, array[i], i)) != null && b >= b) {
+ a = b;
+ break;
+ }
while (++i < n) if ((b = f.call(array, array[i], i)) != null && a > b) a = b;
}
return a;
@@ -34,10 +69,16 @@ d3 = function() {
d3.max = function(array, f) {
var i = -1, n = array.length, a, b;
if (arguments.length === 1) {
- while (++i < n && ((a = array[i]) == null || a != a)) a = undefined;
+ while (++i < n) if ((b = array[i]) != null && b >= b) {
+ a = b;
+ break;
+ }
while (++i < n) if ((b = array[i]) != null && b > a) a = b;
} else {
- while (++i < n && ((a = f.call(array, array[i], i)) == null || a != a)) a = undefined;
+ while (++i < n) if ((b = f.call(array, array[i], i)) != null && b >= b) {
+ a = b;
+ break;
+ }
while (++i < n) if ((b = f.call(array, array[i], i)) != null && b > a) a = b;
}
return a;
@@ -45,13 +86,19 @@ d3 = function() {
d3.extent = function(array, f) {
var i = -1, n = array.length, a, b, c;
if (arguments.length === 1) {
- while (++i < n && ((a = c = array[i]) == null || a != a)) a = c = undefined;
+ while (++i < n) if ((b = array[i]) != null && b >= b) {
+ a = c = b;
+ break;
+ }
while (++i < n) if ((b = array[i]) != null) {
if (a > b) a = b;
if (c < b) c = b;
}
} else {
- while (++i < n && ((a = c = f.call(array, array[i], i)) == null || a != a)) a = undefined;
+ while (++i < n) if ((b = f.call(array, array[i], i)) != null && b >= b) {
+ a = c = b;
+ break;
+ }
while (++i < n) if ((b = f.call(array, array[i], i)) != null) {
if (a > b) a = b;
if (c < b) c = b;
@@ -59,44 +106,76 @@ d3 = function() {
}
return [ a, c ];
};
+ function d3_number(x) {
+ return x === null ? NaN : +x;
+ }
+ function d3_numeric(x) {
+ return !isNaN(x);
+ }
d3.sum = function(array, f) {
var s = 0, n = array.length, a, i = -1;
if (arguments.length === 1) {
- while (++i < n) if (!isNaN(a = +array[i])) s += a;
+ while (++i < n) if (d3_numeric(a = +array[i])) s += a;
} else {
- while (++i < n) if (!isNaN(a = +f.call(array, array[i], i))) s += a;
+ while (++i < n) if (d3_numeric(a = +f.call(array, array[i], i))) s += a;
}
return s;
};
- function d3_number(x) {
- return x != null && !isNaN(x);
- }
d3.mean = function(array, f) {
- var n = array.length, a, m = 0, i = -1, j = 0;
+ var s = 0, n = array.length, a, i = -1, j = n;
if (arguments.length === 1) {
- while (++i < n) if (d3_number(a = array[i])) m += (a - m) / ++j;
+ while (++i < n) if (d3_numeric(a = d3_number(array[i]))) s += a; else --j;
} else {
- while (++i < n) if (d3_number(a = f.call(array, array[i], i))) m += (a - m) / ++j;
+ while (++i < n) if (d3_numeric(a = d3_number(f.call(array, array[i], i)))) s += a; else --j;
}
- return j ? m : undefined;
+ if (j) return s / j;
};
d3.quantile = function(values, p) {
var H = (values.length - 1) * p + 1, h = Math.floor(H), v = +values[h - 1], e = H - h;
return e ? v + e * (values[h] - v) : v;
};
d3.median = function(array, f) {
- if (arguments.length > 1) array = array.map(f);
- array = array.filter(d3_number);
- return array.length ? d3.quantile(array.sort(d3.ascending), .5) : undefined;
+ var numbers = [], n = array.length, a, i = -1;
+ if (arguments.length === 1) {
+ while (++i < n) if (d3_numeric(a = d3_number(array[i]))) numbers.push(a);
+ } else {
+ while (++i < n) if (d3_numeric(a = d3_number(f.call(array, array[i], i)))) numbers.push(a);
+ }
+ if (numbers.length) return d3.quantile(numbers.sort(d3_ascending), .5);
};
- d3.bisector = function(f) {
+ d3.variance = function(array, f) {
+ var n = array.length, m = 0, a, d, s = 0, i = -1, j = 0;
+ if (arguments.length === 1) {
+ while (++i < n) {
+ if (d3_numeric(a = d3_number(array[i]))) {
+ d = a - m;
+ m += d / ++j;
+ s += d * (a - m);
+ }
+ }
+ } else {
+ while (++i < n) {
+ if (d3_numeric(a = d3_number(f.call(array, array[i], i)))) {
+ d = a - m;
+ m += d / ++j;
+ s += d * (a - m);
+ }
+ }
+ }
+ if (j > 1) return s / (j - 1);
+ };
+ d3.deviation = function() {
+ var v = d3.variance.apply(this, arguments);
+ return v ? Math.sqrt(v) : v;
+ };
+ function d3_bisector(compare) {
return {
left: function(a, x, lo, hi) {
if (arguments.length < 3) lo = 0;
if (arguments.length < 4) hi = a.length;
while (lo < hi) {
var mid = lo + hi >>> 1;
- if (f.call(a, a[mid], mid) < x) lo = mid + 1; else hi = mid;
+ if (compare(a[mid], x) < 0) lo = mid + 1; else hi = mid;
}
return lo;
},
@@ -105,30 +184,42 @@ d3 = function() {
if (arguments.length < 4) hi = a.length;
while (lo < hi) {
var mid = lo + hi >>> 1;
- if (x < f.call(a, a[mid], mid)) hi = mid; else lo = mid + 1;
+ if (compare(a[mid], x) > 0) hi = mid; else lo = mid + 1;
}
return lo;
}
};
+ }
+ var d3_bisect = d3_bisector(d3_ascending);
+ d3.bisectLeft = d3_bisect.left;
+ d3.bisect = d3.bisectRight = d3_bisect.right;
+ d3.bisector = function(f) {
+ return d3_bisector(f.length === 1 ? function(d, x) {
+ return d3_ascending(f(d), x);
+ } : f);
};
- var d3_bisector = d3.bisector(function(d) {
- return d;
- });
- d3.bisectLeft = d3_bisector.left;
- d3.bisect = d3.bisectRight = d3_bisector.right;
- d3.shuffle = function(array) {
- var m = array.length, t, i;
+ d3.shuffle = function(array, i0, i1) {
+ if ((m = arguments.length) < 3) {
+ i1 = array.length;
+ if (m < 2) i0 = 0;
+ }
+ var m = i1 - i0, t, i;
while (m) {
i = Math.random() * m-- | 0;
- t = array[m], array[m] = array[i], array[i] = t;
+ t = array[m + i0], array[m + i0] = array[i + i0], array[i + i0] = t;
}
return array;
};
d3.permute = function(array, indexes) {
- var permutes = [], i = -1, n = indexes.length;
- while (++i < n) permutes[i] = array[indexes[i]];
+ var i = indexes.length, permutes = new Array(i);
+ while (i--) permutes[i] = array[indexes[i]];
return permutes;
};
+ d3.pairs = function(array) {
+ var i = 0, n = array.length - 1, p0, p1 = array[0], pairs = new Array(n < 0 ? 0 : n);
+ while (i < n) pairs[i] = [ p0 = p1, p1 = array[++i] ];
+ return pairs;
+ };
d3.zip = function() {
if (!(n = arguments.length)) return [];
for (var i = -1, m = d3.min(arguments, d3_zipLength), zips = new Array(m); ++i < m; ) {
@@ -163,8 +254,19 @@ d3 = function() {
return entries;
};
d3.merge = function(arrays) {
- return Array.prototype.concat.apply([], arrays);
+ var n = arrays.length, m, i = -1, j = 0, merged, array;
+ while (++i < n) j += arrays[i].length;
+ merged = new Array(j);
+ while (--n >= 0) {
+ array = arrays[n];
+ m = array.length;
+ while (--m >= 0) {
+ merged[--j] = array[m];
+ }
+ }
+ return merged;
};
+ var abs = Math.abs;
d3.range = function(start, stop, step) {
if (arguments.length < 3) {
step = 1;
@@ -174,7 +276,7 @@ d3 = function() {
}
}
if ((stop - start) / step === Infinity) throw new Error("infinite range");
- var range = [], k = d3_range_integerScale(Math.abs(step)), i = -1, j;
+ var range = [], k = d3_range_integerScale(abs(step)), i = -1, j;
start *= k, stop *= k, step *= k;
if (step < 0) while ((j = start + step * ++i) > stop) range.push(j / k); else while ((j = start + step * ++i) < stop) range.push(j / k);
return range;
@@ -185,70 +287,86 @@ d3 = function() {
return k;
}
function d3_class(ctor, properties) {
- try {
- for (var key in properties) {
- Object.defineProperty(ctor.prototype, key, {
- value: properties[key],
- enumerable: false
- });
- }
- } catch (e) {
- ctor.prototype = properties;
+ for (var key in properties) {
+ Object.defineProperty(ctor.prototype, key, {
+ value: properties[key],
+ enumerable: false
+ });
}
}
- d3.map = function(object) {
+ d3.map = function(object, f) {
var map = new d3_Map();
- for (var key in object) map.set(key, object[key]);
+ if (object instanceof d3_Map) {
+ object.forEach(function(key, value) {
+ map.set(key, value);
+ });
+ } else if (Array.isArray(object)) {
+ var i = -1, n = object.length, o;
+ if (arguments.length === 1) while (++i < n) map.set(i, object[i]); else while (++i < n) map.set(f.call(object, o = object[i], i), o);
+ } else {
+ for (var key in object) map.set(key, object[key]);
+ }
return map;
};
- function d3_Map() {}
+ function d3_Map() {
+ this._ = Object.create(null);
+ }
+ var d3_map_proto = "__proto__", d3_map_zero = "\x00";
d3_class(d3_Map, {
- has: function(key) {
- return d3_map_prefix + key in this;
- },
+ has: d3_map_has,
get: function(key) {
- return this[d3_map_prefix + key];
+ return this._[d3_map_escape(key)];
},
set: function(key, value) {
- return this[d3_map_prefix + key] = value;
- },
- remove: function(key) {
- key = d3_map_prefix + key;
- return key in this && delete this[key];
- },
- keys: function() {
- var keys = [];
- this.forEach(function(key) {
- keys.push(key);
- });
- return keys;
+ return this._[d3_map_escape(key)] = value;
},
+ remove: d3_map_remove,
+ keys: d3_map_keys,
values: function() {
var values = [];
- this.forEach(function(key, value) {
- values.push(value);
- });
+ for (var key in this._) values.push(this._[key]);
return values;
},
entries: function() {
var entries = [];
- this.forEach(function(key, value) {
- entries.push({
- key: key,
- value: value
- });
+ for (var key in this._) entries.push({
+ key: d3_map_unescape(key),
+ value: this._[key]
});
return entries;
},
+ size: d3_map_size,
+ empty: d3_map_empty,
forEach: function(f) {
- for (var key in this) {
- if (key.charCodeAt(0) === d3_map_prefixCode) {
- f.call(this, key.substring(1), this[key]);
- }
- }
+ for (var key in this._) f.call(this, d3_map_unescape(key), this._[key]);
}
});
- var d3_map_prefix = "\0", d3_map_prefixCode = d3_map_prefix.charCodeAt(0);
+ function d3_map_escape(key) {
+ return (key += "") === d3_map_proto || key[0] === d3_map_zero ? d3_map_zero + key : key;
+ }
+ function d3_map_unescape(key) {
+ return (key += "")[0] === d3_map_zero ? key.slice(1) : key;
+ }
+ function d3_map_has(key) {
+ return d3_map_escape(key) in this._;
+ }
+ function d3_map_remove(key) {
+ return (key = d3_map_escape(key)) in this._ && delete this._[key];
+ }
+ function d3_map_keys() {
+ var keys = [];
+ for (var key in this._) keys.push(d3_map_unescape(key));
+ return keys;
+ }
+ function d3_map_size() {
+ var size = 0;
+ for (var key in this._) ++size;
+ return size;
+ }
+ function d3_map_empty() {
+ for (var key in this._) return false;
+ return true;
+ }
d3.nest = function() {
var nest = {}, keys = [], sortKeys = [], sortValues, rollup;
function map(mapType, array, depth) {
@@ -314,38 +432,30 @@ d3 = function() {
};
d3.set = function(array) {
var set = new d3_Set();
- if (array) for (var i = 0; i < array.length; i++) set.add(array[i]);
+ if (array) for (var i = 0, n = array.length; i < n; ++i) set.add(array[i]);
return set;
};
- function d3_Set() {}
+ function d3_Set() {
+ this._ = Object.create(null);
+ }
d3_class(d3_Set, {
- has: function(value) {
- return d3_map_prefix + value in this;
- },
- add: function(value) {
- this[d3_map_prefix + value] = true;
- return value;
- },
- remove: function(value) {
- value = d3_map_prefix + value;
- return value in this && delete this[value];
- },
- values: function() {
- var values = [];
- this.forEach(function(value) {
- values.push(value);
- });
- return values;
+ has: d3_map_has,
+ add: function(key) {
+ this._[d3_map_escape(key += "")] = true;
+ return key;
},
+ remove: d3_map_remove,
+ values: d3_map_keys,
+ size: d3_map_size,
+ empty: d3_map_empty,
forEach: function(f) {
- for (var value in this) {
- if (value.charCodeAt(0) === d3_map_prefixCode) {
- f.call(this, value.substring(1));
- }
- }
+ for (var key in this._) f.call(this, d3_map_unescape(key));
}
});
d3.behavior = {};
+ function d3_identity(d) {
+ return d;
+ }
d3.rebind = function(target, source) {
var i = 1, n = arguments.length, method;
while (++i < n) target[method = arguments[i]] = d3_rebind(target, source, source[method]);
@@ -357,6 +467,16 @@ d3 = function() {
return value === source ? target : value;
};
}
+ function d3_vendorSymbol(object, name) {
+ if (name in object) return name;
+ name = name.charAt(0).toUpperCase() + name.slice(1);
+ for (var i = 0, n = d3_vendorPrefixes.length; i < n; ++i) {
+ var prefixName = d3_vendorPrefixes[i] + name;
+ if (prefixName in object) return prefixName;
+ }
+ }
+ var d3_vendorPrefixes = [ "webkit", "ms", "moz", "Moz", "o", "O" ];
+ function d3_noop() {}
d3.dispatch = function() {
var dispatch = new d3_dispatch(), i = -1, n = arguments.length;
while (++i < n) dispatch[arguments[i]] = d3_dispatch_event(dispatch);
@@ -366,8 +486,8 @@ d3 = function() {
d3_dispatch.prototype.on = function(type, listener) {
var i = type.indexOf("."), name = "";
if (i >= 0) {
- name = type.substring(i + 1);
- type = type.substring(0, i);
+ name = type.slice(i + 1);
+ type = type.slice(0, i);
}
if (type) return arguments.length < 2 ? this[type].on(name) : this[type].on(name, listener);
if (arguments.length === 2) {
@@ -400,8 +520,7 @@ d3 = function() {
return event;
}
d3.event = null;
- function d3_eventCancel() {
- d3.event.stopPropagation();
+ function d3_eventPreventDefault() {
d3.event.preventDefault();
}
function d3_eventSource() {
@@ -409,16 +528,6 @@ d3 = function() {
while (s = e.sourceEvent) e = s;
return e;
}
- function d3_eventSuppress(target, type) {
- function off() {
- target.on(type, null);
- }
- target.on(type, function() {
- d3_eventCancel();
- off();
- }, true);
- setTimeout(off, 0);
- }
function d3_eventDispatch(target) {
var dispatch = new d3_dispatch(), i = 0, n = arguments.length;
while (++i < n) dispatch[arguments[i]] = d3_dispatch_event(dispatch);
@@ -436,150 +545,50 @@ d3 = function() {
};
return dispatch;
}
- d3.mouse = function(container) {
- return d3_mousePoint(container, d3_eventSource());
- };
- var d3_mouse_bug44083 = /WebKit/.test(d3_window.navigator.userAgent) ? -1 : 0;
- function d3_mousePoint(container, e) {
- var svg = container.ownerSVGElement || container;
- if (svg.createSVGPoint) {
- var point = svg.createSVGPoint();
- if (d3_mouse_bug44083 < 0 && (d3_window.scrollX || d3_window.scrollY)) {
- svg = d3.select(d3_document.body).append("svg").style("position", "absolute").style("top", 0).style("left", 0);
- var ctm = svg[0][0].getScreenCTM();
- d3_mouse_bug44083 = !(ctm.f || ctm.e);
- svg.remove();
- }
- if (d3_mouse_bug44083) {
- point.x = e.pageX;
- point.y = e.pageY;
- } else {
- point.x = e.clientX;
- point.y = e.clientY;
- }
- point = point.matrixTransform(container.getScreenCTM().inverse());
- return [ point.x, point.y ];
- }
- var rect = container.getBoundingClientRect();
- return [ e.clientX - rect.left - container.clientLeft, e.clientY - rect.top - container.clientTop ];
- }
- var d3_array = d3_arraySlice;
- function d3_arrayCopy(pseudoarray) {
- var i = -1, n = pseudoarray.length, array = [];
- while (++i < n) array.push(pseudoarray[i]);
- return array;
- }
- function d3_arraySlice(pseudoarray) {
- return Array.prototype.slice.call(pseudoarray);
- }
- try {
- d3_array(d3_document.documentElement.childNodes)[0].nodeType;
- } catch (e) {
- d3_array = d3_arrayCopy;
- }
- var d3_arraySubclass = [].__proto__ ? function(array, prototype) {
- array.__proto__ = prototype;
- } : function(array, prototype) {
- for (var property in prototype) array[property] = prototype[property];
- };
- d3.touches = function(container, touches) {
- if (arguments.length < 2) touches = d3_eventSource().touches;
- return touches ? d3_array(touches).map(function(touch) {
- var point = d3_mousePoint(container, touch);
- point.identifier = touch.identifier;
- return point;
- }) : [];
+ d3.requote = function(s) {
+ return s.replace(d3_requote_re, "\\$&");
};
- d3.behavior.drag = function() {
- var event = d3_eventDispatch(drag, "drag", "dragstart", "dragend"), origin = null;
- function drag() {
- this.on("mousedown.drag", mousedown).on("touchstart.drag", mousedown);
- }
- function mousedown() {
- var target = this, event_ = event.of(target, arguments), eventTarget = d3.event.target, touchId = d3.event.touches ? d3.event.changedTouches[0].identifier : null, offset, origin_ = point(), moved = 0;
- var w = d3.select(d3_window).on(touchId != null ? "touchmove.drag-" + touchId : "mousemove.drag", dragmove).on(touchId != null ? "touchend.drag-" + touchId : "mouseup.drag", dragend, true);
- if (origin) {
- offset = origin.apply(target, arguments);
- offset = [ offset.x - origin_[0], offset.y - origin_[1] ];
- } else {
- offset = [ 0, 0 ];
- }
- if (touchId == null) d3_eventCancel();
- event_({
- type: "dragstart"
- });
- function point() {
- var p = target.parentNode;
- return touchId != null ? d3.touches(p).filter(function(p) {
- return p.identifier === touchId;
- })[0] : d3.mouse(p);
- }
- function dragmove() {
- if (!target.parentNode) return dragend();
- var p = point(), dx = p[0] - origin_[0], dy = p[1] - origin_[1];
- moved |= dx | dy;
- origin_ = p;
- d3_eventCancel();
- event_({
- type: "drag",
- x: p[0] + offset[0],
- y: p[1] + offset[1],
- dx: dx,
- dy: dy
- });
- }
- function dragend() {
- event_({
- type: "dragend"
- });
- if (moved) {
- d3_eventCancel();
- if (d3.event.target === eventTarget) d3_eventSuppress(w, "click");
- }
- w.on(touchId != null ? "touchmove.drag-" + touchId : "mousemove.drag", null).on(touchId != null ? "touchend.drag-" + touchId : "mouseup.drag", null);
- }
- }
- drag.origin = function(x) {
- if (!arguments.length) return origin;
- origin = x;
- return drag;
- };
- return d3.rebind(drag, event, "on");
+ var d3_requote_re = /[\\\^\$\*\+\?\|\[\]\(\)\.\{\}]/g;
+ var d3_subclass = {}.__proto__ ? function(object, prototype) {
+ object.__proto__ = prototype;
+ } : function(object, prototype) {
+ for (var property in prototype) object[property] = prototype[property];
};
function d3_selection(groups) {
- d3_arraySubclass(groups, d3_selectionPrototype);
+ d3_subclass(groups, d3_selectionPrototype);
return groups;
}
var d3_select = function(s, n) {
return n.querySelector(s);
}, d3_selectAll = function(s, n) {
return n.querySelectorAll(s);
- }, d3_selectRoot = d3_document.documentElement, d3_selectMatcher = d3_selectRoot.matchesSelector || d3_selectRoot.webkitMatchesSelector || d3_selectRoot.mozMatchesSelector || d3_selectRoot.msMatchesSelector || d3_selectRoot.oMatchesSelector, d3_selectMatches = function(n, s) {
- return d3_selectMatcher.call(n, s);
+ }, d3_selectMatches = function(n, s) {
+ var d3_selectMatcher = n.matches || n[d3_vendorSymbol(n, "matchesSelector")];
+ d3_selectMatches = function(n, s) {
+ return d3_selectMatcher.call(n, s);
+ };
+ return d3_selectMatches(n, s);
};
if (typeof Sizzle === "function") {
d3_select = function(s, n) {
return Sizzle(s, n)[0] || null;
};
- d3_selectAll = function(s, n) {
- return Sizzle.uniqueSort(Sizzle(s, n));
- };
+ d3_selectAll = Sizzle;
d3_selectMatches = Sizzle.matchesSelector;
}
- var d3_selectionPrototype = [];
d3.selection = function() {
- return d3_selectionRoot;
+ return d3.select(d3_document.documentElement);
};
- d3.selection.prototype = d3_selectionPrototype;
+ var d3_selectionPrototype = d3.selection.prototype = [];
d3_selectionPrototype.select = function(selector) {
var subgroups = [], subgroup, subnode, group, node;
- if (typeof selector !== "function") selector = d3_selection_selector(selector);
+ selector = d3_selection_selector(selector);
for (var j = -1, m = this.length; ++j < m; ) {
subgroups.push(subgroup = []);
subgroup.parentNode = (group = this[j]).parentNode;
for (var i = -1, n = group.length; ++i < n; ) {
if (node = group[i]) {
- subgroup.push(subnode = selector.call(node, node.__data__, i));
+ subgroup.push(subnode = selector.call(node, node.__data__, i, j));
if (subnode && "__data__" in node) subnode.__data__ = node.__data__;
} else {
subgroup.push(null);
@@ -589,17 +598,17 @@ d3 = function() {
return d3_selection(subgroups);
};
function d3_selection_selector(selector) {
- return function() {
+ return typeof selector === "function" ? selector : function() {
return d3_select(selector, this);
};
}
d3_selectionPrototype.selectAll = function(selector) {
var subgroups = [], subgroup, node;
- if (typeof selector !== "function") selector = d3_selection_selectorAll(selector);
+ selector = d3_selection_selectorAll(selector);
for (var j = -1, m = this.length; ++j < m; ) {
for (var group = this[j], i = -1, n = group.length; ++i < n; ) {
if (node = group[i]) {
- subgroups.push(subgroup = d3_array(selector.call(node, node.__data__, i)));
+ subgroups.push(subgroup = d3_array(selector.call(node, node.__data__, i, j)));
subgroup.parentNode = node;
}
}
@@ -607,7 +616,7 @@ d3 = function() {
return d3_selection(subgroups);
};
function d3_selection_selectorAll(selector) {
- return function() {
+ return typeof selector === "function" ? selector : function() {
return d3_selectAll(selector, this);
};
}
@@ -623,8 +632,8 @@ d3 = function() {
qualify: function(name) {
var i = name.indexOf(":"), prefix = name;
if (i >= 0) {
- prefix = name.substring(0, i);
- name = name.substring(i + 1);
+ prefix = name.slice(0, i);
+ name = name.slice(i + 1);
}
return d3_nsPrefix.hasOwnProperty(prefix) ? {
space: d3_nsPrefix[prefix],
@@ -671,14 +680,10 @@ d3 = function() {
function d3_collapse(s) {
return s.trim().replace(/\s+/g, " ");
}
- d3.requote = function(s) {
- return s.replace(d3_requote_re, "\\$&");
- };
- var d3_requote_re = /[\\\^\$\*\+\?\|\[\]\(\)\.\{\}]/g;
d3_selectionPrototype.classed = function(name, value) {
if (arguments.length < 2) {
if (typeof name === "string") {
- var node = this.node(), n = (name = name.trim().split(/^|\s+/g)).length, i = -1;
+ var node = this.node(), n = (name = d3_selection_classes(name)).length, i = -1;
if (value = node.classList) {
while (++i < n) if (!value.contains(name[i])) return false;
} else {
@@ -695,8 +700,11 @@ d3 = function() {
function d3_selection_classedRe(name) {
return new RegExp("(?:^|\\s+)" + d3.requote(name) + "(?:\\s+|$)", "g");
}
+ function d3_selection_classes(name) {
+ return (name + "").trim().split(/^|\s+/);
+ }
function d3_selection_classed(name, value) {
- name = name.trim().split(/\s+/).map(d3_selection_classedName);
+ name = d3_selection_classes(name).map(d3_selection_classedName);
var n = name.length;
function classedConstant() {
var i = -1;
@@ -729,7 +737,10 @@ d3 = function() {
for (priority in name) this.each(d3_selection_style(priority, name[priority], value));
return this;
}
- if (n < 2) return d3_window.getComputedStyle(this.node(), null).getPropertyValue(name);
+ if (n < 2) {
+ var node = this.node();
+ return d3_window(node).getComputedStyle(node, null).getPropertyValue(name);
+ }
priority = "";
}
return this.each(d3_selection_style(name, value, priority));
@@ -789,32 +800,35 @@ d3 = function() {
}) : this.node().innerHTML;
};
d3_selectionPrototype.append = function(name) {
- name = d3.ns.qualify(name);
- function append() {
- return this.appendChild(d3_document.createElementNS(this.namespaceURI, name));
- }
- function appendNS() {
- return this.appendChild(d3_document.createElementNS(name.space, name.local));
- }
- return this.select(name.local ? appendNS : append);
+ name = d3_selection_creator(name);
+ return this.select(function() {
+ return this.appendChild(name.apply(this, arguments));
+ });
};
- d3_selectionPrototype.insert = function(name, before) {
- name = d3.ns.qualify(name);
- if (typeof before !== "function") before = d3_selection_selector(before);
- function insert(d, i) {
- return this.insertBefore(d3_document.createElementNS(this.namespaceURI, name), before.call(this, d, i));
+ function d3_selection_creator(name) {
+ function create() {
+ var document = this.ownerDocument, namespace = this.namespaceURI;
+ return namespace ? document.createElementNS(namespace, name) : document.createElement(name);
}
- function insertNS(d, i) {
- return this.insertBefore(d3_document.createElementNS(name.space, name.local), before.call(this, d, i));
+ function createNS() {
+ return this.ownerDocument.createElementNS(name.space, name.local);
}
- return this.select(name.local ? insertNS : insert);
+ return typeof name === "function" ? name : (name = d3.ns.qualify(name)).local ? createNS : create;
+ }
+ d3_selectionPrototype.insert = function(name, before) {
+ name = d3_selection_creator(name);
+ before = d3_selection_selector(before);
+ return this.select(function() {
+ return this.insertBefore(name.apply(this, arguments), before.apply(this, arguments) || null);
+ });
};
d3_selectionPrototype.remove = function() {
- return this.each(function() {
- var parent = this.parentNode;
- if (parent) parent.removeChild(this);
- });
+ return this.each(d3_selectionRemove);
};
+ function d3_selectionRemove() {
+ var parent = this.parentNode;
+ if (parent) parent.removeChild(this);
+ }
d3_selectionPrototype.data = function(value, key) {
var i = -1, n = this.length, group, node;
if (!arguments.length) {
@@ -829,29 +843,26 @@ d3 = function() {
function bind(group, groupData) {
var i, n = group.length, m = groupData.length, n0 = Math.min(n, m), updateNodes = new Array(m), enterNodes = new Array(m), exitNodes = new Array(n), node, nodeData;
if (key) {
- var nodeByKeyValue = new d3_Map(), dataByKeyValue = new d3_Map(), keyValues = [], keyValue;
+ var nodeByKeyValue = new d3_Map(), keyValues = new Array(n), keyValue;
for (i = -1; ++i < n; ) {
- keyValue = key.call(node = group[i], node.__data__, i);
- if (nodeByKeyValue.has(keyValue)) {
+ if (nodeByKeyValue.has(keyValue = key.call(node = group[i], node.__data__, i))) {
exitNodes[i] = node;
} else {
nodeByKeyValue.set(keyValue, node);
}
- keyValues.push(keyValue);
+ keyValues[i] = keyValue;
}
for (i = -1; ++i < m; ) {
- keyValue = key.call(groupData, nodeData = groupData[i], i);
- if (node = nodeByKeyValue.get(keyValue)) {
+ if (!(node = nodeByKeyValue.get(keyValue = key.call(groupData, nodeData = groupData[i], i)))) {
+ enterNodes[i] = d3_selection_dataNode(nodeData);
+ } else if (node !== true) {
updateNodes[i] = node;
node.__data__ = nodeData;
- } else if (!dataByKeyValue.has(keyValue)) {
- enterNodes[i] = d3_selection_dataNode(nodeData);
}
- dataByKeyValue.set(keyValue, nodeData);
- nodeByKeyValue.remove(keyValue);
+ nodeByKeyValue.set(keyValue, true);
}
for (i = -1; ++i < n; ) {
- if (nodeByKeyValue.has(keyValues[i])) {
+ if (nodeByKeyValue.get(keyValues[i]) !== true) {
exitNodes[i] = group[i];
}
}
@@ -912,7 +923,7 @@ d3 = function() {
subgroups.push(subgroup = []);
subgroup.parentNode = (group = this[j]).parentNode;
for (var i = 0, n = group.length; i < n; i++) {
- if ((node = group[i]) && filter.call(node, node.__data__, i)) {
+ if ((node = group[i]) && filter.call(node, node.__data__, i, j)) {
subgroup.push(node);
}
}
@@ -941,12 +952,113 @@ d3 = function() {
return this.order();
};
function d3_selection_sortComparator(comparator) {
- if (!arguments.length) comparator = d3.ascending;
+ if (!arguments.length) comparator = d3_ascending;
return function(a, b) {
- return !a - !b || comparator(a.__data__, b.__data__);
+ return a && b ? comparator(a.__data__, b.__data__) : !a - !b;
};
}
- function d3_noop() {}
+ d3_selectionPrototype.each = function(callback) {
+ return d3_selection_each(this, function(node, i, j) {
+ callback.call(node, node.__data__, i, j);
+ });
+ };
+ function d3_selection_each(groups, callback) {
+ for (var j = 0, m = groups.length; j < m; j++) {
+ for (var group = groups[j], i = 0, n = group.length, node; i < n; i++) {
+ if (node = group[i]) callback(node, i, j);
+ }
+ }
+ return groups;
+ }
+ d3_selectionPrototype.call = function(callback) {
+ var args = d3_array(arguments);
+ callback.apply(args[0] = this, args);
+ return this;
+ };
+ d3_selectionPrototype.empty = function() {
+ return !this.node();
+ };
+ d3_selectionPrototype.node = function() {
+ for (var j = 0, m = this.length; j < m; j++) {
+ for (var group = this[j], i = 0, n = group.length; i < n; i++) {
+ var node = group[i];
+ if (node) return node;
+ }
+ }
+ return null;
+ };
+ d3_selectionPrototype.size = function() {
+ var n = 0;
+ d3_selection_each(this, function() {
+ ++n;
+ });
+ return n;
+ };
+ function d3_selection_enter(selection) {
+ d3_subclass(selection, d3_selection_enterPrototype);
+ return selection;
+ }
+ var d3_selection_enterPrototype = [];
+ d3.selection.enter = d3_selection_enter;
+ d3.selection.enter.prototype = d3_selection_enterPrototype;
+ d3_selection_enterPrototype.append = d3_selectionPrototype.append;
+ d3_selection_enterPrototype.empty = d3_selectionPrototype.empty;
+ d3_selection_enterPrototype.node = d3_selectionPrototype.node;
+ d3_selection_enterPrototype.call = d3_selectionPrototype.call;
+ d3_selection_enterPrototype.size = d3_selectionPrototype.size;
+ d3_selection_enterPrototype.select = function(selector) {
+ var subgroups = [], subgroup, subnode, upgroup, group, node;
+ for (var j = -1, m = this.length; ++j < m; ) {
+ upgroup = (group = this[j]).update;
+ subgroups.push(subgroup = []);
+ subgroup.parentNode = group.parentNode;
+ for (var i = -1, n = group.length; ++i < n; ) {
+ if (node = group[i]) {
+ subgroup.push(upgroup[i] = subnode = selector.call(group.parentNode, node.__data__, i, j));
+ subnode.__data__ = node.__data__;
+ } else {
+ subgroup.push(null);
+ }
+ }
+ }
+ return d3_selection(subgroups);
+ };
+ d3_selection_enterPrototype.insert = function(name, before) {
+ if (arguments.length < 2) before = d3_selection_enterInsertBefore(this);
+ return d3_selectionPrototype.insert.call(this, name, before);
+ };
+ function d3_selection_enterInsertBefore(enter) {
+ var i0, j0;
+ return function(d, i, j) {
+ var group = enter[j].update, n = group.length, node;
+ if (j != j0) j0 = j, i0 = 0;
+ if (i >= i0) i0 = i + 1;
+ while (!(node = group[i0]) && ++i0 < n) ;
+ return node;
+ };
+ }
+ d3.select = function(node) {
+ var group;
+ if (typeof node === "string") {
+ group = [ d3_select(node, d3_document) ];
+ group.parentNode = d3_document.documentElement;
+ } else {
+ group = [ node ];
+ group.parentNode = d3_documentElement(node);
+ }
+ return d3_selection([ group ]);
+ };
+ d3.selectAll = function(nodes) {
+ var group;
+ if (typeof nodes === "string") {
+ group = d3_array(d3_selectAll(nodes, d3_document));
+ group.parentNode = d3_document.documentElement;
+ } else {
+ group = nodes;
+ group.parentNode = null;
+ }
+ return d3_selection([ group ]);
+ };
d3_selectionPrototype.on = function(type, listener, capture) {
var n = arguments.length;
if (n < 3) {
@@ -962,7 +1074,7 @@ d3 = function() {
};
function d3_selection_on(type, listener, capture) {
var name = "__on" + type, i = type.indexOf("."), wrap = d3_selection_onListener;
- if (i > 0) type = type.substring(0, i);
+ if (i > 0) type = type.slice(0, i);
var filter = d3_selection_onFilters.get(type);
if (filter) type = filter, wrap = d3_selection_onFilter;
function onRemove() {
@@ -994,9 +1106,11 @@ d3 = function() {
mouseenter: "mouseover",
mouseleave: "mouseout"
});
- d3_selection_onFilters.forEach(function(k) {
- if ("on" + k in d3_document) d3_selection_onFilters.remove(k);
- });
+ if (d3_document) {
+ d3_selection_onFilters.forEach(function(k) {
+ if ("on" + k in d3_document) d3_selection_onFilters.remove(k);
+ });
+ }
function d3_selection_onListener(listener, argumentz) {
return function(e) {
var o = d3.event;
@@ -1018,255 +1132,469 @@ d3 = function() {
}
};
}
- d3_selectionPrototype.each = function(callback) {
- return d3_selection_each(this, function(node, i, j) {
- callback.call(node, node.__data__, i, j);
- });
- };
- function d3_selection_each(groups, callback) {
- for (var j = 0, m = groups.length; j < m; j++) {
- for (var group = groups[j], i = 0, n = group.length, node; i < n; i++) {
- if (node = group[i]) callback(node, i, j);
- }
+ var d3_event_dragSelect, d3_event_dragId = 0;
+ function d3_event_dragSuppress(node) {
+ var name = ".dragsuppress-" + ++d3_event_dragId, click = "click" + name, w = d3.select(d3_window(node)).on("touchmove" + name, d3_eventPreventDefault).on("dragstart" + name, d3_eventPreventDefault).on("selectstart" + name, d3_eventPreventDefault);
+ if (d3_event_dragSelect == null) {
+ d3_event_dragSelect = "onselectstart" in node ? false : d3_vendorSymbol(node.style, "userSelect");
}
- return groups;
+ if (d3_event_dragSelect) {
+ var style = d3_documentElement(node).style, select = style[d3_event_dragSelect];
+ style[d3_event_dragSelect] = "none";
+ }
+ return function(suppressClick) {
+ w.on(name, null);
+ if (d3_event_dragSelect) style[d3_event_dragSelect] = select;
+ if (suppressClick) {
+ var off = function() {
+ w.on(click, null);
+ };
+ w.on(click, function() {
+ d3_eventPreventDefault();
+ off();
+ }, true);
+ setTimeout(off, 0);
+ }
+ };
}
- d3_selectionPrototype.call = function(callback) {
- var args = d3_array(arguments);
- callback.apply(args[0] = this, args);
- return this;
- };
- d3_selectionPrototype.empty = function() {
- return !this.node();
+ d3.mouse = function(container) {
+ return d3_mousePoint(container, d3_eventSource());
};
- d3_selectionPrototype.node = function() {
- for (var j = 0, m = this.length; j < m; j++) {
- for (var group = this[j], i = 0, n = group.length; i < n; i++) {
- var node = group[i];
- if (node) return node;
+ var d3_mouse_bug44083 = this.navigator && /WebKit/.test(this.navigator.userAgent) ? -1 : 0;
+ function d3_mousePoint(container, e) {
+ if (e.changedTouches) e = e.changedTouches[0];
+ var svg = container.ownerSVGElement || container;
+ if (svg.createSVGPoint) {
+ var point = svg.createSVGPoint();
+ if (d3_mouse_bug44083 < 0) {
+ var window = d3_window(container);
+ if (window.scrollX || window.scrollY) {
+ svg = d3.select("body").append("svg").style({
+ position: "absolute",
+ top: 0,
+ left: 0,
+ margin: 0,
+ padding: 0,
+ border: "none"
+ }, "important");
+ var ctm = svg[0][0].getScreenCTM();
+ d3_mouse_bug44083 = !(ctm.f || ctm.e);
+ svg.remove();
+ }
+ }
+ if (d3_mouse_bug44083) point.x = e.pageX, point.y = e.pageY; else point.x = e.clientX,
+ point.y = e.clientY;
+ point = point.matrixTransform(container.getScreenCTM().inverse());
+ return [ point.x, point.y ];
+ }
+ var rect = container.getBoundingClientRect();
+ return [ e.clientX - rect.left - container.clientLeft, e.clientY - rect.top - container.clientTop ];
+ }
+ d3.touch = function(container, touches, identifier) {
+ if (arguments.length < 3) identifier = touches, touches = d3_eventSource().changedTouches;
+ if (touches) for (var i = 0, n = touches.length, touch; i < n; ++i) {
+ if ((touch = touches[i]).identifier === identifier) {
+ return d3_mousePoint(container, touch);
}
}
- return null;
};
- function d3_selection_enter(selection) {
- d3_arraySubclass(selection, d3_selection_enterPrototype);
- return selection;
- }
- var d3_selection_enterPrototype = [];
- d3.selection.enter = d3_selection_enter;
- d3.selection.enter.prototype = d3_selection_enterPrototype;
- d3_selection_enterPrototype.append = d3_selectionPrototype.append;
- d3_selection_enterPrototype.insert = d3_selectionPrototype.insert;
- d3_selection_enterPrototype.empty = d3_selectionPrototype.empty;
- d3_selection_enterPrototype.node = d3_selectionPrototype.node;
- d3_selection_enterPrototype.select = function(selector) {
- var subgroups = [], subgroup, subnode, upgroup, group, node;
- for (var j = -1, m = this.length; ++j < m; ) {
- upgroup = (group = this[j]).update;
- subgroups.push(subgroup = []);
- subgroup.parentNode = group.parentNode;
- for (var i = -1, n = group.length; ++i < n; ) {
- if (node = group[i]) {
- subgroup.push(upgroup[i] = subnode = selector.call(group.parentNode, node.__data__, i));
- subnode.__data__ = node.__data__;
+ d3.behavior.drag = function() {
+ var event = d3_eventDispatch(drag, "drag", "dragstart", "dragend"), origin = null, mousedown = dragstart(d3_noop, d3.mouse, d3_window, "mousemove", "mouseup"), touchstart = dragstart(d3_behavior_dragTouchId, d3.touch, d3_identity, "touchmove", "touchend");
+ function drag() {
+ this.on("mousedown.drag", mousedown).on("touchstart.drag", touchstart);
+ }
+ function dragstart(id, position, subject, move, end) {
+ return function() {
+ var that = this, target = d3.event.target, parent = that.parentNode, dispatch = event.of(that, arguments), dragged = 0, dragId = id(), dragName = ".drag" + (dragId == null ? "" : "-" + dragId), dragOffset, dragSubject = d3.select(subject(target)).on(move + dragName, moved).on(end + dragName, ended), dragRestore = d3_event_dragSuppress(target), position0 = position(parent, dragId);
+ if (origin) {
+ dragOffset = origin.apply(that, arguments);
+ dragOffset = [ dragOffset.x - position0[0], dragOffset.y - position0[1] ];
} else {
- subgroup.push(null);
+ dragOffset = [ 0, 0 ];
}
- }
+ dispatch({
+ type: "dragstart"
+ });
+ function moved() {
+ var position1 = position(parent, dragId), dx, dy;
+ if (!position1) return;
+ dx = position1[0] - position0[0];
+ dy = position1[1] - position0[1];
+ dragged |= dx | dy;
+ position0 = position1;
+ dispatch({
+ type: "drag",
+ x: position1[0] + dragOffset[0],
+ y: position1[1] + dragOffset[1],
+ dx: dx,
+ dy: dy
+ });
+ }
+ function ended() {
+ if (!position(parent, dragId)) return;
+ dragSubject.on(move + dragName, null).on(end + dragName, null);
+ dragRestore(dragged && d3.event.target === target);
+ dispatch({
+ type: "dragend"
+ });
+ }
+ };
}
- return d3_selection(subgroups);
+ drag.origin = function(x) {
+ if (!arguments.length) return origin;
+ origin = x;
+ return drag;
+ };
+ return d3.rebind(drag, event, "on");
};
- d3_selectionPrototype.transition = function() {
- var id = d3_transitionInheritId || ++d3_transitionId, subgroups = [], subgroup, node, transition = Object.create(d3_transitionInherit);
- transition.time = Date.now();
- for (var j = -1, m = this.length; ++j < m; ) {
- subgroups.push(subgroup = []);
- for (var group = this[j], i = -1, n = group.length; ++i < n; ) {
- if (node = group[i]) d3_transitionNode(node, i, id, transition);
- subgroup.push(node);
+ function d3_behavior_dragTouchId() {
+ return d3.event.changedTouches[0].identifier;
+ }
+ d3.touches = function(container, touches) {
+ if (arguments.length < 2) touches = d3_eventSource().touches;
+ return touches ? d3_array(touches).map(function(touch) {
+ var point = d3_mousePoint(container, touch);
+ point.identifier = touch.identifier;
+ return point;
+ }) : [];
+ };
+ var ε = 1e-6, ε2 = ε * ε, π = Math.PI, τ = 2 * π, τε = τ - ε, halfπ = π / 2, d3_radians = π / 180, d3_degrees = 180 / π;
+ function d3_sgn(x) {
+ return x > 0 ? 1 : x < 0 ? -1 : 0;
+ }
+ function d3_cross2d(a, b, c) {
+ return (b[0] - a[0]) * (c[1] - a[1]) - (b[1] - a[1]) * (c[0] - a[0]);
+ }
+ function d3_acos(x) {
+ return x > 1 ? 0 : x < -1 ? π : Math.acos(x);
+ }
+ function d3_asin(x) {
+ return x > 1 ? halfπ : x < -1 ? -halfπ : Math.asin(x);
+ }
+ function d3_sinh(x) {
+ return ((x = Math.exp(x)) - 1 / x) / 2;
+ }
+ function d3_cosh(x) {
+ return ((x = Math.exp(x)) + 1 / x) / 2;
+ }
+ function d3_tanh(x) {
+ return ((x = Math.exp(2 * x)) - 1) / (x + 1);
+ }
+ function d3_haversin(x) {
+ return (x = Math.sin(x / 2)) * x;
+ }
+ var ρ = Math.SQRT2, ρ2 = 2, ρ4 = 4;
+ d3.interpolateZoom = function(p0, p1) {
+ var ux0 = p0[0], uy0 = p0[1], w0 = p0[2], ux1 = p1[0], uy1 = p1[1], w1 = p1[2];
+ var dx = ux1 - ux0, dy = uy1 - uy0, d2 = dx * dx + dy * dy, d1 = Math.sqrt(d2), b0 = (w1 * w1 - w0 * w0 + ρ4 * d2) / (2 * w0 * ρ2 * d1), b1 = (w1 * w1 - w0 * w0 - ρ4 * d2) / (2 * w1 * ρ2 * d1), r0 = Math.log(Math.sqrt(b0 * b0 + 1) - b0), r1 = Math.log(Math.sqrt(b1 * b1 + 1) - b1), dr = r1 - r0, S = (dr || Math.log(w1 / w0)) / ρ;
+ function interpolate(t) {
+ var s = t * S;
+ if (dr) {
+ var coshr0 = d3_cosh(r0), u = w0 / (ρ2 * d1) * (coshr0 * d3_tanh(ρ * s + r0) - d3_sinh(r0));
+ return [ ux0 + u * dx, uy0 + u * dy, w0 * coshr0 / d3_cosh(ρ * s + r0) ];
}
+ return [ ux0 + t * dx, uy0 + t * dy, w0 * Math.exp(ρ * s) ];
}
- return d3_transition(subgroups, id);
- };
- var d3_selectionRoot = d3_selection([ [ d3_document ] ]);
- d3_selectionRoot[0].parentNode = d3_selectRoot;
- d3.select = function(selector) {
- return typeof selector === "string" ? d3_selectionRoot.select(selector) : d3_selection([ [ selector ] ]);
- };
- d3.selectAll = function(selector) {
- return typeof selector === "string" ? d3_selectionRoot.selectAll(selector) : d3_selection([ d3_array(selector) ]);
+ interpolate.duration = S * 1e3;
+ return interpolate;
};
d3.behavior.zoom = function() {
- var translate = [ 0, 0 ], translate0, scale = 1, scale0, scaleExtent = d3_behavior_zoomInfinity, event = d3_eventDispatch(zoom, "zoom"), x0, x1, y0, y1, touchtime;
- function zoom() {
- this.on("mousedown.zoom", mousedown).on("mousemove.zoom", mousemove).on(d3_behavior_zoomWheel + ".zoom", mousewheel).on("dblclick.zoom", dblclick).on("touchstart.zoom", touchstart).on("touchmove.zoom", touchmove).on("touchend.zoom", touchstart);
- }
- zoom.translate = function(x) {
- if (!arguments.length) return translate;
- translate = x.map(Number);
+ var view = {
+ x: 0,
+ y: 0,
+ k: 1
+ }, translate0, center0, center, size = [ 960, 500 ], scaleExtent = d3_behavior_zoomInfinity, duration = 250, zooming = 0, mousedown = "mousedown.zoom", mousemove = "mousemove.zoom", mouseup = "mouseup.zoom", mousewheelTimer, touchstart = "touchstart.zoom", touchtime, event = d3_eventDispatch(zoom, "zoomstart", "zoom", "zoomend"), x0, x1, y0, y1;
+ if (!d3_behavior_zoomWheel) {
+ d3_behavior_zoomWheel = "onwheel" in d3_document ? (d3_behavior_zoomDelta = function() {
+ return -d3.event.deltaY * (d3.event.deltaMode ? 120 : 1);
+ }, "wheel") : "onmousewheel" in d3_document ? (d3_behavior_zoomDelta = function() {
+ return d3.event.wheelDelta;
+ }, "mousewheel") : (d3_behavior_zoomDelta = function() {
+ return -d3.event.detail;
+ }, "MozMousePixelScroll");
+ }
+ function zoom(g) {
+ g.on(mousedown, mousedowned).on(d3_behavior_zoomWheel + ".zoom", mousewheeled).on("dblclick.zoom", dblclicked).on(touchstart, touchstarted);
+ }
+ zoom.event = function(g) {
+ g.each(function() {
+ var dispatch = event.of(this, arguments), view1 = view;
+ if (d3_transitionInheritId) {
+ d3.select(this).transition().each("start.zoom", function() {
+ view = this.__chart__ || {
+ x: 0,
+ y: 0,
+ k: 1
+ };
+ zoomstarted(dispatch);
+ }).tween("zoom:zoom", function() {
+ var dx = size[0], dy = size[1], cx = center0 ? center0[0] : dx / 2, cy = center0 ? center0[1] : dy / 2, i = d3.interpolateZoom([ (cx - view.x) / view.k, (cy - view.y) / view.k, dx / view.k ], [ (cx - view1.x) / view1.k, (cy - view1.y) / view1.k, dx / view1.k ]);
+ return function(t) {
+ var l = i(t), k = dx / l[2];
+ this.__chart__ = view = {
+ x: cx - l[0] * k,
+ y: cy - l[1] * k,
+ k: k
+ };
+ zoomed(dispatch);
+ };
+ }).each("interrupt.zoom", function() {
+ zoomended(dispatch);
+ }).each("end.zoom", function() {
+ zoomended(dispatch);
+ });
+ } else {
+ this.__chart__ = view;
+ zoomstarted(dispatch);
+ zoomed(dispatch);
+ zoomended(dispatch);
+ }
+ });
+ };
+ zoom.translate = function(_) {
+ if (!arguments.length) return [ view.x, view.y ];
+ view = {
+ x: +_[0],
+ y: +_[1],
+ k: view.k
+ };
rescale();
return zoom;
};
- zoom.scale = function(x) {
- if (!arguments.length) return scale;
- scale = +x;
+ zoom.scale = function(_) {
+ if (!arguments.length) return view.k;
+ view = {
+ x: view.x,
+ y: view.y,
+ k: +_
+ };
rescale();
return zoom;
};
- zoom.scaleExtent = function(x) {
+ zoom.scaleExtent = function(_) {
if (!arguments.length) return scaleExtent;
- scaleExtent = x == null ? d3_behavior_zoomInfinity : x.map(Number);
+ scaleExtent = _ == null ? d3_behavior_zoomInfinity : [ +_[0], +_[1] ];
+ return zoom;
+ };
+ zoom.center = function(_) {
+ if (!arguments.length) return center;
+ center = _ && [ +_[0], +_[1] ];
+ return zoom;
+ };
+ zoom.size = function(_) {
+ if (!arguments.length) return size;
+ size = _ && [ +_[0], +_[1] ];
+ return zoom;
+ };
+ zoom.duration = function(_) {
+ if (!arguments.length) return duration;
+ duration = +_;
return zoom;
};
zoom.x = function(z) {
if (!arguments.length) return x1;
x1 = z;
x0 = z.copy();
- translate = [ 0, 0 ];
- scale = 1;
+ view = {
+ x: 0,
+ y: 0,
+ k: 1
+ };
return zoom;
};
zoom.y = function(z) {
if (!arguments.length) return y1;
y1 = z;
y0 = z.copy();
- translate = [ 0, 0 ];
- scale = 1;
+ view = {
+ x: 0,
+ y: 0,
+ k: 1
+ };
return zoom;
};
function location(p) {
- return [ (p[0] - translate[0]) / scale, (p[1] - translate[1]) / scale ];
+ return [ (p[0] - view.x) / view.k, (p[1] - view.y) / view.k ];
}
function point(l) {
- return [ l[0] * scale + translate[0], l[1] * scale + translate[1] ];
+ return [ l[0] * view.k + view.x, l[1] * view.k + view.y ];
}
function scaleTo(s) {
- scale = Math.max(scaleExtent[0], Math.min(scaleExtent[1], s));
+ view.k = Math.max(scaleExtent[0], Math.min(scaleExtent[1], s));
}
function translateTo(p, l) {
l = point(l);
- translate[0] += p[0] - l[0];
- translate[1] += p[1] - l[1];
+ view.x += p[0] - l[0];
+ view.y += p[1] - l[1];
+ }
+ function zoomTo(that, p, l, k) {
+ that.__chart__ = {
+ x: view.x,
+ y: view.y,
+ k: view.k
+ };
+ scaleTo(Math.pow(2, k));
+ translateTo(center0 = p, l);
+ that = d3.select(that);
+ if (duration > 0) that = that.transition().duration(duration);
+ that.call(zoom.event);
}
function rescale() {
if (x1) x1.domain(x0.range().map(function(x) {
- return (x - translate[0]) / scale;
+ return (x - view.x) / view.k;
}).map(x0.invert));
if (y1) y1.domain(y0.range().map(function(y) {
- return (y - translate[1]) / scale;
+ return (y - view.y) / view.k;
}).map(y0.invert));
}
- function dispatch(event) {
+ function zoomstarted(dispatch) {
+ if (!zooming++) dispatch({
+ type: "zoomstart"
+ });
+ }
+ function zoomed(dispatch) {
rescale();
- d3.event.preventDefault();
- event({
+ dispatch({
type: "zoom",
- scale: scale,
- translate: translate
+ scale: view.k,
+ translate: [ view.x, view.y ]
});
}
- function mousedown() {
- var target = this, event_ = event.of(target, arguments), eventTarget = d3.event.target, moved = 0, w = d3.select(d3_window).on("mousemove.zoom", mousemove).on("mouseup.zoom", mouseup), l = location(d3.mouse(target));
- d3_window.focus();
- d3_eventCancel();
- function mousemove() {
- moved = 1;
- translateTo(d3.mouse(target), l);
- dispatch(event_);
- }
- function mouseup() {
- if (moved) d3_eventCancel();
- w.on("mousemove.zoom", null).on("mouseup.zoom", null);
- if (moved && d3.event.target === eventTarget) d3_eventSuppress(w, "click.zoom");
- }
- }
- function mousewheel() {
- if (!translate0) translate0 = location(d3.mouse(this));
- scaleTo(Math.pow(2, d3_behavior_zoomDelta() * .002) * scale);
- translateTo(d3.mouse(this), translate0);
- dispatch(event.of(this, arguments));
- }
- function mousemove() {
- translate0 = null;
- }
- function dblclick() {
- var p = d3.mouse(this), l = location(p), k = Math.log(scale) / Math.LN2;
- scaleTo(Math.pow(2, d3.event.shiftKey ? Math.ceil(k) - 1 : Math.floor(k) + 1));
- translateTo(p, l);
- dispatch(event.of(this, arguments));
- }
- function touchstart() {
- var touches = d3.touches(this), now = Date.now();
- scale0 = scale;
- translate0 = {};
- touches.forEach(function(t) {
- translate0[t.identifier] = location(t);
- });
- d3_eventCancel();
- if (touches.length === 1) {
- if (now - touchtime < 500) {
- var p = touches[0], l = location(touches[0]);
- scaleTo(scale * 2);
- translateTo(p, l);
- dispatch(event.of(this, arguments));
+ function zoomended(dispatch) {
+ if (!--zooming) dispatch({
+ type: "zoomend"
+ }), center0 = null;
+ }
+ function mousedowned() {
+ var that = this, target = d3.event.target, dispatch = event.of(that, arguments), dragged = 0, subject = d3.select(d3_window(that)).on(mousemove, moved).on(mouseup, ended), location0 = location(d3.mouse(that)), dragRestore = d3_event_dragSuppress(that);
+ d3_selection_interrupt.call(that);
+ zoomstarted(dispatch);
+ function moved() {
+ dragged = 1;
+ translateTo(d3.mouse(that), location0);
+ zoomed(dispatch);
+ }
+ function ended() {
+ subject.on(mousemove, null).on(mouseup, null);
+ dragRestore(dragged && d3.event.target === target);
+ zoomended(dispatch);
+ }
+ }
+ function touchstarted() {
+ var that = this, dispatch = event.of(that, arguments), locations0 = {}, distance0 = 0, scale0, zoomName = ".zoom-" + d3.event.changedTouches[0].identifier, touchmove = "touchmove" + zoomName, touchend = "touchend" + zoomName, targets = [], subject = d3.select(that), dragRestore = d3_event_dragSuppress(that);
+ started();
+ zoomstarted(dispatch);
+ subject.on(mousedown, null).on(touchstart, started);
+ function relocate() {
+ var touches = d3.touches(that);
+ scale0 = view.k;
+ touches.forEach(function(t) {
+ if (t.identifier in locations0) locations0[t.identifier] = location(t);
+ });
+ return touches;
+ }
+ function started() {
+ var target = d3.event.target;
+ d3.select(target).on(touchmove, moved).on(touchend, ended);
+ targets.push(target);
+ var changed = d3.event.changedTouches;
+ for (var i = 0, n = changed.length; i < n; ++i) {
+ locations0[changed[i].identifier] = null;
+ }
+ var touches = relocate(), now = Date.now();
+ if (touches.length === 1) {
+ if (now - touchtime < 500) {
+ var p = touches[0];
+ zoomTo(that, p, locations0[p.identifier], Math.floor(Math.log(view.k) / Math.LN2) + 1);
+ d3_eventPreventDefault();
+ }
+ touchtime = now;
+ } else if (touches.length > 1) {
+ var p = touches[0], q = touches[1], dx = p[0] - q[0], dy = p[1] - q[1];
+ distance0 = dx * dx + dy * dy;
+ }
+ }
+ function moved() {
+ var touches = d3.touches(that), p0, l0, p1, l1;
+ d3_selection_interrupt.call(that);
+ for (var i = 0, n = touches.length; i < n; ++i, l1 = null) {
+ p1 = touches[i];
+ if (l1 = locations0[p1.identifier]) {
+ if (l0) break;
+ p0 = p1, l0 = l1;
+ }
}
- touchtime = now;
- }
- }
- function touchmove() {
- var touches = d3.touches(this), p0 = touches[0], l0 = translate0[p0.identifier];
- if (p1 = touches[1]) {
- var p1, l1 = translate0[p1.identifier];
- p0 = [ (p0[0] + p1[0]) / 2, (p0[1] + p1[1]) / 2 ];
- l0 = [ (l0[0] + l1[0]) / 2, (l0[1] + l1[1]) / 2 ];
- scaleTo(d3.event.scale * scale0);
- }
- translateTo(p0, l0);
- touchtime = null;
- dispatch(event.of(this, arguments));
+ if (l1) {
+ var distance1 = (distance1 = p1[0] - p0[0]) * distance1 + (distance1 = p1[1] - p0[1]) * distance1, scale1 = distance0 && Math.sqrt(distance1 / distance0);
+ p0 = [ (p0[0] + p1[0]) / 2, (p0[1] + p1[1]) / 2 ];
+ l0 = [ (l0[0] + l1[0]) / 2, (l0[1] + l1[1]) / 2 ];
+ scaleTo(scale1 * scale0);
+ }
+ touchtime = null;
+ translateTo(p0, l0);
+ zoomed(dispatch);
+ }
+ function ended() {
+ if (d3.event.touches.length) {
+ var changed = d3.event.changedTouches;
+ for (var i = 0, n = changed.length; i < n; ++i) {
+ delete locations0[changed[i].identifier];
+ }
+ for (var identifier in locations0) {
+ return void relocate();
+ }
+ }
+ d3.selectAll(targets).on(zoomName, null);
+ subject.on(mousedown, mousedowned).on(touchstart, touchstarted);
+ dragRestore();
+ zoomended(dispatch);
+ }
+ }
+ function mousewheeled() {
+ var dispatch = event.of(this, arguments);
+ if (mousewheelTimer) clearTimeout(mousewheelTimer); else d3_selection_interrupt.call(this),
+ translate0 = location(center0 = center || d3.mouse(this)), zoomstarted(dispatch);
+ mousewheelTimer = setTimeout(function() {
+ mousewheelTimer = null;
+ zoomended(dispatch);
+ }, 50);
+ d3_eventPreventDefault();
+ scaleTo(Math.pow(2, d3_behavior_zoomDelta() * .002) * view.k);
+ translateTo(center0, translate0);
+ zoomed(dispatch);
+ }
+ function dblclicked() {
+ var p = d3.mouse(this), k = Math.log(view.k) / Math.LN2;
+ zoomTo(this, p, location(p), d3.event.shiftKey ? Math.ceil(k) - 1 : Math.floor(k) + 1);
}
return d3.rebind(zoom, event, "on");
};
- var d3_behavior_zoomInfinity = [ 0, Infinity ];
- var d3_behavior_zoomDelta, d3_behavior_zoomWheel = "onwheel" in d3_document ? (d3_behavior_zoomDelta = function() {
- return -d3.event.deltaY * (d3.event.deltaMode ? 120 : 1);
- }, "wheel") : "onmousewheel" in d3_document ? (d3_behavior_zoomDelta = function() {
- return d3.event.wheelDelta;
- }, "mousewheel") : (d3_behavior_zoomDelta = function() {
- return -d3.event.detail;
- }, "MozMousePixelScroll");
- function d3_Color() {}
- d3_Color.prototype.toString = function() {
+ var d3_behavior_zoomInfinity = [ 0, Infinity ], d3_behavior_zoomDelta, d3_behavior_zoomWheel;
+ d3.color = d3_color;
+ function d3_color() {}
+ d3_color.prototype.toString = function() {
return this.rgb() + "";
};
- d3.hsl = function(h, s, l) {
- return arguments.length === 1 ? h instanceof d3_Hsl ? d3_hsl(h.h, h.s, h.l) : d3_rgb_parse("" + h, d3_rgb_hsl, d3_hsl) : d3_hsl(+h, +s, +l);
- };
+ d3.hsl = d3_hsl;
function d3_hsl(h, s, l) {
- return new d3_Hsl(h, s, l);
- }
- function d3_Hsl(h, s, l) {
- this.h = h;
- this.s = s;
- this.l = l;
+ return this instanceof d3_hsl ? void (this.h = +h, this.s = +s, this.l = +l) : arguments.length < 2 ? h instanceof d3_hsl ? new d3_hsl(h.h, h.s, h.l) : d3_rgb_parse("" + h, d3_rgb_hsl, d3_hsl) : new d3_hsl(h, s, l);
}
- var d3_hslPrototype = d3_Hsl.prototype = new d3_Color();
+ var d3_hslPrototype = d3_hsl.prototype = new d3_color();
d3_hslPrototype.brighter = function(k) {
k = Math.pow(.7, arguments.length ? k : 1);
- return d3_hsl(this.h, this.s, this.l / k);
+ return new d3_hsl(this.h, this.s, this.l / k);
};
d3_hslPrototype.darker = function(k) {
k = Math.pow(.7, arguments.length ? k : 1);
- return d3_hsl(this.h, this.s, k * this.l);
+ return new d3_hsl(this.h, this.s, k * this.l);
};
d3_hslPrototype.rgb = function() {
return d3_hsl_rgb(this.h, this.s, this.l);
};
function d3_hsl_rgb(h, s, l) {
var m1, m2;
- h = h % 360;
- if (h < 0) h += 360;
- s = s < 0 ? 0 : s > 1 ? 1 : s;
+ h = isNaN(h) ? 0 : (h %= 360) < 0 ? h + 360 : h;
+ s = isNaN(s) ? 0 : s < 0 ? 0 : s > 1 ? 1 : s;
l = l < 0 ? 0 : l > 1 ? 1 : l;
m2 = l <= .5 ? l * (1 + s) : l + s - l * s;
m1 = 2 * l - m2;
@@ -1280,70 +1608,39 @@ d3 = function() {
function vv(h) {
return Math.round(v(h) * 255);
}
- return d3_rgb(vv(h + 120), vv(h), vv(h - 120));
+ return new d3_rgb(vv(h + 120), vv(h), vv(h - 120));
}
- var π = Math.PI, ε = 1e-6, d3_radians = π / 180, d3_degrees = 180 / π;
- function d3_sgn(x) {
- return x > 0 ? 1 : x < 0 ? -1 : 0;
- }
- function d3_acos(x) {
- return Math.acos(Math.max(-1, Math.min(1, x)));
- }
- function d3_asin(x) {
- return x > 1 ? π / 2 : x < -1 ? -π / 2 : Math.asin(x);
- }
- function d3_sinh(x) {
- return (Math.exp(x) - Math.exp(-x)) / 2;
- }
- function d3_cosh(x) {
- return (Math.exp(x) + Math.exp(-x)) / 2;
- }
- function d3_haversin(x) {
- return (x = Math.sin(x / 2)) * x;
- }
- d3.hcl = function(h, c, l) {
- return arguments.length === 1 ? h instanceof d3_Hcl ? d3_hcl(h.h, h.c, h.l) : h instanceof d3_Lab ? d3_lab_hcl(h.l, h.a, h.b) : d3_lab_hcl((h = d3_rgb_lab((h = d3.rgb(h)).r, h.g, h.b)).l, h.a, h.b) : d3_hcl(+h, +c, +l);
- };
+ d3.hcl = d3_hcl;
function d3_hcl(h, c, l) {
- return new d3_Hcl(h, c, l);
- }
- function d3_Hcl(h, c, l) {
- this.h = h;
- this.c = c;
- this.l = l;
+ return this instanceof d3_hcl ? void (this.h = +h, this.c = +c, this.l = +l) : arguments.length < 2 ? h instanceof d3_hcl ? new d3_hcl(h.h, h.c, h.l) : h instanceof d3_lab ? d3_lab_hcl(h.l, h.a, h.b) : d3_lab_hcl((h = d3_rgb_lab((h = d3.rgb(h)).r, h.g, h.b)).l, h.a, h.b) : new d3_hcl(h, c, l);
}
- var d3_hclPrototype = d3_Hcl.prototype = new d3_Color();
+ var d3_hclPrototype = d3_hcl.prototype = new d3_color();
d3_hclPrototype.brighter = function(k) {
- return d3_hcl(this.h, this.c, Math.min(100, this.l + d3_lab_K * (arguments.length ? k : 1)));
+ return new d3_hcl(this.h, this.c, Math.min(100, this.l + d3_lab_K * (arguments.length ? k : 1)));
};
d3_hclPrototype.darker = function(k) {
- return d3_hcl(this.h, this.c, Math.max(0, this.l - d3_lab_K * (arguments.length ? k : 1)));
+ return new d3_hcl(this.h, this.c, Math.max(0, this.l - d3_lab_K * (arguments.length ? k : 1)));
};
d3_hclPrototype.rgb = function() {
return d3_hcl_lab(this.h, this.c, this.l).rgb();
};
function d3_hcl_lab(h, c, l) {
- return d3_lab(l, Math.cos(h *= d3_radians) * c, Math.sin(h) * c);
+ if (isNaN(h)) h = 0;
+ if (isNaN(c)) c = 0;
+ return new d3_lab(l, Math.cos(h *= d3_radians) * c, Math.sin(h) * c);
}
- d3.lab = function(l, a, b) {
- return arguments.length === 1 ? l instanceof d3_Lab ? d3_lab(l.l, l.a, l.b) : l instanceof d3_Hcl ? d3_hcl_lab(l.l, l.c, l.h) : d3_rgb_lab((l = d3.rgb(l)).r, l.g, l.b) : d3_lab(+l, +a, +b);
- };
+ d3.lab = d3_lab;
function d3_lab(l, a, b) {
- return new d3_Lab(l, a, b);
- }
- function d3_Lab(l, a, b) {
- this.l = l;
- this.a = a;
- this.b = b;
+ return this instanceof d3_lab ? void (this.l = +l, this.a = +a, this.b = +b) : arguments.length < 2 ? l instanceof d3_lab ? new d3_lab(l.l, l.a, l.b) : l instanceof d3_hcl ? d3_hcl_lab(l.h, l.c, l.l) : d3_rgb_lab((l = d3_rgb(l)).r, l.g, l.b) : new d3_lab(l, a, b);
}
var d3_lab_K = 18;
var d3_lab_X = .95047, d3_lab_Y = 1, d3_lab_Z = 1.08883;
- var d3_labPrototype = d3_Lab.prototype = new d3_Color();
+ var d3_labPrototype = d3_lab.prototype = new d3_color();
d3_labPrototype.brighter = function(k) {
- return d3_lab(Math.min(100, this.l + d3_lab_K * (arguments.length ? k : 1)), this.a, this.b);
+ return new d3_lab(Math.min(100, this.l + d3_lab_K * (arguments.length ? k : 1)), this.a, this.b);
};
d3_labPrototype.darker = function(k) {
- return d3_lab(Math.max(0, this.l - d3_lab_K * (arguments.length ? k : 1)), this.a, this.b);
+ return new d3_lab(Math.max(0, this.l - d3_lab_K * (arguments.length ? k : 1)), this.a, this.b);
};
d3_labPrototype.rgb = function() {
return d3_lab_rgb(this.l, this.a, this.b);
@@ -1353,10 +1650,10 @@ d3 = function() {
x = d3_lab_xyz(x) * d3_lab_X;
y = d3_lab_xyz(y) * d3_lab_Y;
z = d3_lab_xyz(z) * d3_lab_Z;
- return d3_rgb(d3_xyz_rgb(3.2404542 * x - 1.5371385 * y - .4985314 * z), d3_xyz_rgb(-.969266 * x + 1.8760108 * y + .041556 * z), d3_xyz_rgb(.0556434 * x - .2040259 * y + 1.0572252 * z));
+ return new d3_rgb(d3_xyz_rgb(3.2404542 * x - 1.5371385 * y - .4985314 * z), d3_xyz_rgb(-.969266 * x + 1.8760108 * y + .041556 * z), d3_xyz_rgb(.0556434 * x - .2040259 * y + 1.0572252 * z));
}
function d3_lab_hcl(l, a, b) {
- return d3_hcl(Math.atan2(b, a) * d3_degrees, Math.sqrt(a * a + b * b), l);
+ return l > 0 ? new d3_hcl(Math.atan2(b, a) * d3_degrees, Math.sqrt(a * a + b * b), l) : new d3_hcl(NaN, NaN, l);
}
function d3_lab_xyz(x) {
return x > .206893034 ? x * x * x : (x - 4 / 29) / 7.787037;
@@ -1367,30 +1664,29 @@ d3 = function() {
function d3_xyz_rgb(r) {
return Math.round(255 * (r <= .00304 ? 12.92 * r : 1.055 * Math.pow(r, 1 / 2.4) - .055));
}
- d3.rgb = function(r, g, b) {
- return arguments.length === 1 ? r instanceof d3_Rgb ? d3_rgb(r.r, r.g, r.b) : d3_rgb_parse("" + r, d3_rgb, d3_hsl_rgb) : d3_rgb(~~r, ~~g, ~~b);
- };
+ d3.rgb = d3_rgb;
function d3_rgb(r, g, b) {
- return new d3_Rgb(r, g, b);
+ return this instanceof d3_rgb ? void (this.r = ~~r, this.g = ~~g, this.b = ~~b) : arguments.length < 2 ? r instanceof d3_rgb ? new d3_rgb(r.r, r.g, r.b) : d3_rgb_parse("" + r, d3_rgb, d3_hsl_rgb) : new d3_rgb(r, g, b);
}
- function d3_Rgb(r, g, b) {
- this.r = r;
- this.g = g;
- this.b = b;
+ function d3_rgbNumber(value) {
+ return new d3_rgb(value >> 16, value >> 8 & 255, value & 255);
}
- var d3_rgbPrototype = d3_Rgb.prototype = new d3_Color();
+ function d3_rgbString(value) {
+ return d3_rgbNumber(value) + "";
+ }
+ var d3_rgbPrototype = d3_rgb.prototype = new d3_color();
d3_rgbPrototype.brighter = function(k) {
k = Math.pow(.7, arguments.length ? k : 1);
var r = this.r, g = this.g, b = this.b, i = 30;
- if (!r && !g && !b) return d3_rgb(i, i, i);
+ if (!r && !g && !b) return new d3_rgb(i, i, i);
if (r && r < i) r = i;
if (g && g < i) g = i;
if (b && b < i) b = i;
- return d3_rgb(Math.min(255, Math.floor(r / k)), Math.min(255, Math.floor(g / k)), Math.min(255, Math.floor(b / k)));
+ return new d3_rgb(Math.min(255, r / k), Math.min(255, g / k), Math.min(255, b / k));
};
d3_rgbPrototype.darker = function(k) {
k = Math.pow(.7, arguments.length ? k : 1);
- return d3_rgb(Math.floor(k * this.r), Math.floor(k * this.g), Math.floor(k * this.b));
+ return new d3_rgb(k * this.r, k * this.g, k * this.b);
};
d3_rgbPrototype.hsl = function() {
return d3_rgb_hsl(this.r, this.g, this.b);
@@ -1402,8 +1698,8 @@ d3 = function() {
return v < 16 ? "0" + Math.max(0, v).toString(16) : Math.min(255, v).toString(16);
}
function d3_rgb_parse(format, rgb, hsl) {
- var r = 0, g = 0, b = 0, m1, m2, name;
- m1 = /([a-z]+)\((.*)\)/i.exec(format);
+ var r = 0, g = 0, b = 0, m1, m2, color;
+ m1 = /([a-z]+)\((.*)\)/.exec(format = format.toLowerCase());
if (m1) {
m2 = m1[2].split(",");
switch (m1[1]) {
@@ -1418,23 +1714,22 @@ d3 = function() {
}
}
}
- if (name = d3_rgb_names.get(format)) return rgb(name.r, name.g, name.b);
- if (format != null && format.charAt(0) === "#") {
+ if (color = d3_rgb_names.get(format)) {
+ return rgb(color.r, color.g, color.b);
+ }
+ if (format != null && format.charAt(0) === "#" && !isNaN(color = parseInt(format.slice(1), 16))) {
if (format.length === 4) {
- r = format.charAt(1);
- r += r;
- g = format.charAt(2);
- g += g;
- b = format.charAt(3);
- b += b;
+ r = (color & 3840) >> 4;
+ r = r >> 4 | r;
+ g = color & 240;
+ g = g >> 4 | g;
+ b = color & 15;
+ b = b << 4 | b;
} else if (format.length === 7) {
- r = format.substring(1, 3);
- g = format.substring(3, 5);
- b = format.substring(5, 7);
+ r = (color & 16711680) >> 16;
+ g = (color & 65280) >> 8;
+ b = color & 255;
}
- r = parseInt(r, 16);
- g = parseInt(g, 16);
- b = parseInt(b, 16);
}
return rgb(r, g, b);
}
@@ -1445,9 +1740,10 @@ d3 = function() {
if (r == max) h = (g - b) / d + (g < b ? 6 : 0); else if (g == max) h = (b - r) / d + 2; else h = (r - g) / d + 4;
h *= 60;
} else {
- s = h = 0;
+ h = NaN;
+ s = l > 0 && l < 1 ? 0 : h;
}
- return d3_hsl(h, s, l);
+ return new d3_hsl(h, s, l);
}
function d3_rgb_lab(r, g, b) {
r = d3_rgb_xyz(r);
@@ -1464,156 +1760,157 @@ d3 = function() {
return c.charAt(c.length - 1) === "%" ? Math.round(f * 2.55) : f;
}
var d3_rgb_names = d3.map({
- aliceblue: "#f0f8ff",
- antiquewhite: "#faebd7",
- aqua: "#00ffff",
- aquamarine: "#7fffd4",
- azure: "#f0ffff",
- beige: "#f5f5dc",
- bisque: "#ffe4c4",
- black: "#000000",
- blanchedalmond: "#ffebcd",
- blue: "#0000ff",
- blueviolet: "#8a2be2",
- brown: "#a52a2a",
- burlywood: "#deb887",
- cadetblue: "#5f9ea0",
- chartreuse: "#7fff00",
- chocolate: "#d2691e",
- coral: "#ff7f50",
- cornflowerblue: "#6495ed",
- cornsilk: "#fff8dc",
- crimson: "#dc143c",
- cyan: "#00ffff",
- darkblue: "#00008b",
- darkcyan: "#008b8b",
- darkgoldenrod: "#b8860b",
- darkgray: "#a9a9a9",
- darkgreen: "#006400",
- darkgrey: "#a9a9a9",
- darkkhaki: "#bdb76b",
- darkmagenta: "#8b008b",
- darkolivegreen: "#556b2f",
- darkorange: "#ff8c00",
- darkorchid: "#9932cc",
- darkred: "#8b0000",
- darksalmon: "#e9967a",
- darkseagreen: "#8fbc8f",
- darkslateblue: "#483d8b",
- darkslategray: "#2f4f4f",
- darkslategrey: "#2f4f4f",
- darkturquoise: "#00ced1",
- darkviolet: "#9400d3",
- deeppink: "#ff1493",
- deepskyblue: "#00bfff",
- dimgray: "#696969",
- dimgrey: "#696969",
- dodgerblue: "#1e90ff",
- firebrick: "#b22222",
- floralwhite: "#fffaf0",
- forestgreen: "#228b22",
- fuchsia: "#ff00ff",
- gainsboro: "#dcdcdc",
- ghostwhite: "#f8f8ff",
- gold: "#ffd700",
- goldenrod: "#daa520",
- gray: "#808080",
- green: "#008000",
- greenyellow: "#adff2f",
- grey: "#808080",
- honeydew: "#f0fff0",
- hotpink: "#ff69b4",
- indianred: "#cd5c5c",
- indigo: "#4b0082",
- ivory: "#fffff0",
- khaki: "#f0e68c",
- lavender: "#e6e6fa",
- lavenderblush: "#fff0f5",
- lawngreen: "#7cfc00",
- lemonchiffon: "#fffacd",
- lightblue: "#add8e6",
- lightcoral: "#f08080",
- lightcyan: "#e0ffff",
- lightgoldenrodyellow: "#fafad2",
- lightgray: "#d3d3d3",
- lightgreen: "#90ee90",
- lightgrey: "#d3d3d3",
- lightpink: "#ffb6c1",
- lightsalmon: "#ffa07a",
- lightseagreen: "#20b2aa",
- lightskyblue: "#87cefa",
- lightslategray: "#778899",
- lightslategrey: "#778899",
- lightsteelblue: "#b0c4de",
- lightyellow: "#ffffe0",
- lime: "#00ff00",
- limegreen: "#32cd32",
- linen: "#faf0e6",
- magenta: "#ff00ff",
- maroon: "#800000",
- mediumaquamarine: "#66cdaa",
- mediumblue: "#0000cd",
- mediumorchid: "#ba55d3",
- mediumpurple: "#9370db",
- mediumseagreen: "#3cb371",
- mediumslateblue: "#7b68ee",
- mediumspringgreen: "#00fa9a",
- mediumturquoise: "#48d1cc",
- mediumvioletred: "#c71585",
- midnightblue: "#191970",
- mintcream: "#f5fffa",
- mistyrose: "#ffe4e1",
- moccasin: "#ffe4b5",
- navajowhite: "#ffdead",
- navy: "#000080",
- oldlace: "#fdf5e6",
- olive: "#808000",
- olivedrab: "#6b8e23",
- orange: "#ffa500",
- orangered: "#ff4500",
- orchid: "#da70d6",
- palegoldenrod: "#eee8aa",
- palegreen: "#98fb98",
- paleturquoise: "#afeeee",
- palevioletred: "#db7093",
- papayawhip: "#ffefd5",
- peachpuff: "#ffdab9",
- peru: "#cd853f",
- pink: "#ffc0cb",
- plum: "#dda0dd",
- powderblue: "#b0e0e6",
- purple: "#800080",
- red: "#ff0000",
- rosybrown: "#bc8f8f",
- royalblue: "#4169e1",
- saddlebrown: "#8b4513",
- salmon: "#fa8072",
- sandybrown: "#f4a460",
- seagreen: "#2e8b57",
- seashell: "#fff5ee",
- sienna: "#a0522d",
- silver: "#c0c0c0",
- skyblue: "#87ceeb",
- slateblue: "#6a5acd",
- slategray: "#708090",
- slategrey: "#708090",
- snow: "#fffafa",
- springgreen: "#00ff7f",
- steelblue: "#4682b4",
- tan: "#d2b48c",
- teal: "#008080",
- thistle: "#d8bfd8",
- tomato: "#ff6347",
- turquoise: "#40e0d0",
- violet: "#ee82ee",
- wheat: "#f5deb3",
- white: "#ffffff",
- whitesmoke: "#f5f5f5",
- yellow: "#ffff00",
- yellowgreen: "#9acd32"
+ aliceblue: 15792383,
+ antiquewhite: 16444375,
+ aqua: 65535,
+ aquamarine: 8388564,
+ azure: 15794175,
+ beige: 16119260,
+ bisque: 16770244,
+ black: 0,
+ blanchedalmond: 16772045,
+ blue: 255,
+ blueviolet: 9055202,
+ brown: 10824234,
+ burlywood: 14596231,
+ cadetblue: 6266528,
+ chartreuse: 8388352,
+ chocolate: 13789470,
+ coral: 16744272,
+ cornflowerblue: 6591981,
+ cornsilk: 16775388,
+ crimson: 14423100,
+ cyan: 65535,
+ darkblue: 139,
+ darkcyan: 35723,
+ darkgoldenrod: 12092939,
+ darkgray: 11119017,
+ darkgreen: 25600,
+ darkgrey: 11119017,
+ darkkhaki: 12433259,
+ darkmagenta: 9109643,
+ darkolivegreen: 5597999,
+ darkorange: 16747520,
+ darkorchid: 10040012,
+ darkred: 9109504,
+ darksalmon: 15308410,
+ darkseagreen: 9419919,
+ darkslateblue: 4734347,
+ darkslategray: 3100495,
+ darkslategrey: 3100495,
+ darkturquoise: 52945,
+ darkviolet: 9699539,
+ deeppink: 16716947,
+ deepskyblue: 49151,
+ dimgray: 6908265,
+ dimgrey: 6908265,
+ dodgerblue: 2003199,
+ firebrick: 11674146,
+ floralwhite: 16775920,
+ forestgreen: 2263842,
+ fuchsia: 16711935,
+ gainsboro: 14474460,
+ ghostwhite: 16316671,
+ gold: 16766720,
+ goldenrod: 14329120,
+ gray: 8421504,
+ green: 32768,
+ greenyellow: 11403055,
+ grey: 8421504,
+ honeydew: 15794160,
+ hotpink: 16738740,
+ indianred: 13458524,
+ indigo: 4915330,
+ ivory: 16777200,
+ khaki: 15787660,
+ lavender: 15132410,
+ lavenderblush: 16773365,
+ lawngreen: 8190976,
+ lemonchiffon: 16775885,
+ lightblue: 11393254,
+ lightcoral: 15761536,
+ lightcyan: 14745599,
+ lightgoldenrodyellow: 16448210,
+ lightgray: 13882323,
+ lightgreen: 9498256,
+ lightgrey: 13882323,
+ lightpink: 16758465,
+ lightsalmon: 16752762,
+ lightseagreen: 2142890,
+ lightskyblue: 8900346,
+ lightslategray: 7833753,
+ lightslategrey: 7833753,
+ lightsteelblue: 11584734,
+ lightyellow: 16777184,
+ lime: 65280,
+ limegreen: 3329330,
+ linen: 16445670,
+ magenta: 16711935,
+ maroon: 8388608,
+ mediumaquamarine: 6737322,
+ mediumblue: 205,
+ mediumorchid: 12211667,
+ mediumpurple: 9662683,
+ mediumseagreen: 3978097,
+ mediumslateblue: 8087790,
+ mediumspringgreen: 64154,
+ mediumturquoise: 4772300,
+ mediumvioletred: 13047173,
+ midnightblue: 1644912,
+ mintcream: 16121850,
+ mistyrose: 16770273,
+ moccasin: 16770229,
+ navajowhite: 16768685,
+ navy: 128,
+ oldlace: 16643558,
+ olive: 8421376,
+ olivedrab: 7048739,
+ orange: 16753920,
+ orangered: 16729344,
+ orchid: 14315734,
+ palegoldenrod: 15657130,
+ palegreen: 10025880,
+ paleturquoise: 11529966,
+ palevioletred: 14381203,
+ papayawhip: 16773077,
+ peachpuff: 16767673,
+ peru: 13468991,
+ pink: 16761035,
+ plum: 14524637,
+ powderblue: 11591910,
+ purple: 8388736,
+ rebeccapurple: 6697881,
+ red: 16711680,
+ rosybrown: 12357519,
+ royalblue: 4286945,
+ saddlebrown: 9127187,
+ salmon: 16416882,
+ sandybrown: 16032864,
+ seagreen: 3050327,
+ seashell: 16774638,
+ sienna: 10506797,
+ silver: 12632256,
+ skyblue: 8900331,
+ slateblue: 6970061,
+ slategray: 7372944,
+ slategrey: 7372944,
+ snow: 16775930,
+ springgreen: 65407,
+ steelblue: 4620980,
+ tan: 13808780,
+ teal: 32896,
+ thistle: 14204888,
+ tomato: 16737095,
+ turquoise: 4251856,
+ violet: 15631086,
+ wheat: 16113331,
+ white: 16777215,
+ whitesmoke: 16119285,
+ yellow: 16776960,
+ yellowgreen: 10145074
});
d3_rgb_names.forEach(function(key, value) {
- d3_rgb_names.set(key, d3_rgb_parse(value, d3_rgb, d3_hsl_rgb));
+ d3_rgb_names.set(key, d3_rgbNumber(value));
});
function d3_functor(v) {
return typeof v === "function" ? v : function() {
@@ -1621,17 +1918,33 @@ d3 = function() {
};
}
d3.functor = d3_functor;
- function d3_identity(d) {
- return d;
+ d3.xhr = d3_xhrType(d3_identity);
+ function d3_xhrType(response) {
+ return function(url, mimeType, callback) {
+ if (arguments.length === 2 && typeof mimeType === "function") callback = mimeType,
+ mimeType = null;
+ return d3_xhr(url, mimeType, response, callback);
+ };
}
- d3.xhr = function(url, mimeType, callback) {
- var xhr = {}, dispatch = d3.dispatch("progress", "load", "error"), headers = {}, response = d3_identity, request = new (d3_window.XDomainRequest && /^(http(s)?:)?\/\//.test(url) ? XDomainRequest : XMLHttpRequest)();
+ function d3_xhr(url, mimeType, response, callback) {
+ var xhr = {}, dispatch = d3.dispatch("beforesend", "progress", "load", "error"), headers = {}, request = new XMLHttpRequest(), responseType = null;
+ if (this.XDomainRequest && !("withCredentials" in request) && /^(http(s)?:)?\/\//.test(url)) request = new XDomainRequest();
"onload" in request ? request.onload = request.onerror = respond : request.onreadystatechange = function() {
request.readyState > 3 && respond();
};
function respond() {
- var s = request.status;
- !s && request.responseText || s >= 200 && s < 300 || s === 304 ? dispatch.load.call(xhr, response.call(xhr, request)) : dispatch.error.call(xhr, request);
+ var status = request.status, result;
+ if (!status && d3_xhrHasResponse(request) || status >= 200 && status < 300 || status === 304) {
+ try {
+ result = response.call(xhr, request);
+ } catch (e) {
+ dispatch.error.call(xhr, e);
+ return;
+ }
+ dispatch.load.call(xhr, result);
+ } else {
+ dispatch.error.call(xhr, request);
+ }
}
request.onprogress = function(event) {
var o = d3.event;
@@ -1653,6 +1966,11 @@ d3 = function() {
mimeType = value == null ? null : value + "";
return xhr;
};
+ xhr.responseType = function(value) {
+ if (!arguments.length) return responseType;
+ responseType = value;
+ return xhr;
+ };
xhr.response = function(value) {
response = value;
return xhr;
@@ -1668,9 +1986,11 @@ d3 = function() {
if (mimeType != null && !("accept" in headers)) headers["accept"] = mimeType + ",*/*";
if (request.setRequestHeader) for (var name in headers) request.setRequestHeader(name, headers[name]);
if (mimeType != null && request.overrideMimeType) request.overrideMimeType(mimeType);
+ if (responseType != null) request.responseType = responseType;
if (callback != null) xhr.on("error", callback).on("load", function(request) {
callback(null, request);
});
+ dispatch.beforesend.call(xhr, request);
request.send(data == null ? null : data);
return xhr;
};
@@ -1679,24 +1999,26 @@ d3 = function() {
return xhr;
};
d3.rebind(xhr, dispatch, "on");
- if (arguments.length === 2 && typeof mimeType === "function") callback = mimeType,
- mimeType = null;
return callback == null ? xhr : xhr.get(d3_xhr_fixCallback(callback));
- };
+ }
function d3_xhr_fixCallback(callback) {
return callback.length === 1 ? function(error, request) {
callback(error == null ? request : null);
} : callback;
}
- function d3_dsv(delimiter, mimeType) {
+ function d3_xhrHasResponse(request) {
+ var type = request.responseType;
+ return type && type !== "text" ? request.response : request.responseText;
+ }
+ d3.dsv = function(delimiter, mimeType) {
var reFormat = new RegExp('["' + delimiter + "\n]"), delimiterCode = delimiter.charCodeAt(0);
function dsv(url, row, callback) {
if (arguments.length < 3) callback = row, row = null;
- var xhr = d3.xhr(url, mimeType, callback);
+ var xhr = d3_xhr(url, mimeType, row == null ? response : typedResponse(row), callback);
xhr.row = function(_) {
return arguments.length ? xhr.response((row = _) == null ? response : typedResponse(_)) : row;
};
- return xhr.row(row);
+ return xhr;
}
function response(request) {
return dsv.parse(request.responseText);
@@ -1740,7 +2062,7 @@ d3 = function() {
} else if (c === 10) {
eol = true;
}
- return text.substring(j + 1, i).replace(/""/g, '"');
+ return text.slice(j + 1, i).replace(/""/g, '"');
}
while (I < N) {
var c = text.charCodeAt(I++), k = 1;
@@ -1748,9 +2070,9 @@ d3 = function() {
eol = true;
if (text.charCodeAt(I) === 10) ++I, ++k;
} else if (c !== delimiterCode) continue;
- return text.substring(j, I - k);
+ return text.slice(j, I - k);
}
- return text.substring(j);
+ return text.slice(j);
}
while ((t = token()) !== EOF) {
var a = [];
@@ -1758,7 +2080,7 @@ d3 = function() {
a.push(t);
t = token();
}
- if (f && !(a = f(a, n++))) continue;
+ if (f && (a = f(a, n++)) == null) continue;
rows.push(a);
}
return rows;
@@ -1789,25 +2111,24 @@ d3 = function() {
return reFormat.test(text) ? '"' + text.replace(/\"/g, '""') + '"' : text;
}
return dsv;
- }
- d3.csv = d3_dsv(",", "text/csv");
- d3.tsv = d3_dsv(" ", "text/tab-separated-values");
- var d3_timer_id = 0, d3_timer_byId = {}, d3_timer_queue = null, d3_timer_interval, d3_timer_timeout;
+ };
+ d3.csv = d3.dsv(",", "text/csv");
+ d3.tsv = d3.dsv(" ", "text/tab-separated-values");
+ var d3_timer_queueHead, d3_timer_queueTail, d3_timer_interval, d3_timer_timeout, d3_timer_active, d3_timer_frame = this[d3_vendorSymbol(this, "requestAnimationFrame")] || function(callback) {
+ setTimeout(callback, 17);
+ };
d3.timer = function(callback, delay, then) {
- if (arguments.length < 3) {
- if (arguments.length < 2) delay = 0; else if (!isFinite(delay)) return;
- then = Date.now();
- }
- var timer = d3_timer_byId[callback.id];
- if (timer && timer.callback === callback) {
- timer.then = then;
- timer.delay = delay;
- } else d3_timer_byId[callback.id = ++d3_timer_id] = d3_timer_queue = {
- callback: callback,
- then: then,
- delay: delay,
- next: d3_timer_queue
- };
+ var n = arguments.length;
+ if (n < 2) delay = 0;
+ if (n < 3) then = Date.now();
+ var time = then + delay, timer = {
+ c: callback,
+ t: time,
+ f: false,
+ n: null
+ };
+ if (d3_timer_queueTail) d3_timer_queueTail.n = timer; else d3_timer_queueHead = timer;
+ d3_timer_queueTail = timer;
if (!d3_timer_interval) {
d3_timer_timeout = clearTimeout(d3_timer_timeout);
d3_timer_interval = 1;
@@ -1815,13 +2136,7 @@ d3 = function() {
}
};
function d3_timer_step() {
- var elapsed, now = Date.now(), t1 = d3_timer_queue;
- while (t1) {
- elapsed = now - t1.then;
- if (elapsed >= t1.delay) t1.flush = t1.callback(elapsed);
- t1 = t1.next;
- }
- var delay = d3_timer_flush() - now;
+ var now = d3_timer_mark(), delay = d3_timer_sweep() - now;
if (delay > 24) {
if (isFinite(delay)) {
clearTimeout(d3_timer_timeout);
@@ -1834,31 +2149,37 @@ d3 = function() {
}
}
d3.timer.flush = function() {
- var elapsed, now = Date.now(), t1 = d3_timer_queue;
- while (t1) {
- elapsed = now - t1.then;
- if (!t1.delay) t1.flush = t1.callback(elapsed);
- t1 = t1.next;
- }
- d3_timer_flush();
+ d3_timer_mark();
+ d3_timer_sweep();
};
- function d3_timer_flush() {
- var t0 = null, t1 = d3_timer_queue, then = Infinity;
+ function d3_timer_mark() {
+ var now = Date.now();
+ d3_timer_active = d3_timer_queueHead;
+ while (d3_timer_active) {
+ if (now >= d3_timer_active.t) d3_timer_active.f = d3_timer_active.c(now - d3_timer_active.t);
+ d3_timer_active = d3_timer_active.n;
+ }
+ return now;
+ }
+ function d3_timer_sweep() {
+ var t0, t1 = d3_timer_queueHead, time = Infinity;
while (t1) {
- if (t1.flush) {
- delete d3_timer_byId[t1.callback.id];
- t1 = t0 ? t0.next = t1.next : d3_timer_queue = t1.next;
+ if (t1.f) {
+ t1 = t0 ? t0.n = t1.n : d3_timer_queueHead = t1.n;
} else {
- then = Math.min(then, t1.then + t1.delay);
- t1 = (t0 = t1).next;
+ if (t1.t < time) time = t1.t;
+ t1 = (t0 = t1).n;
}
}
- return then;
+ d3_timer_queueTail = t0;
+ return time;
}
- var d3_timer_frame = d3_window.requestAnimationFrame || d3_window.webkitRequestAnimationFrame || d3_window.mozRequestAnimationFrame || d3_window.oRequestAnimationFrame || d3_window.msRequestAnimationFrame || function(callback) {
- setTimeout(callback, 17);
+ function d3_format_precision(x, p) {
+ return p - (x ? Math.ceil(Math.log(x) / Math.LN10) : 1);
+ }
+ d3.round = function(x, n) {
+ return n ? Math.round(x * (n = Math.pow(10, n))) / n : Math.round(x);
};
- var d3_format_decimalPoint = ".", d3_format_thousandsSeparator = ",", d3_format_grouping = [ 3, 3 ];
var d3_formatPrefixes = [ "y", "z", "a", "f", "p", "n", "µ", "m", "", "k", "M", "G", "T", "P", "E", "Z", "Y" ].map(d3_formatPrefix);
d3.formatPrefix = function(value, precision) {
var i = 0;
@@ -1866,12 +2187,12 @@ d3 = function() {
if (value < 0) value *= -1;
if (precision) value = d3.round(value, d3_format_precision(value, precision));
i = 1 + Math.floor(1e-12 + Math.log(value) / Math.LN10);
- i = Math.max(-24, Math.min(24, Math.floor((i <= 0 ? i + 1 : i - 1) / 3) * 3));
+ i = Math.max(-24, Math.min(24, Math.floor((i - 1) / 3) * 3));
}
return d3_formatPrefixes[8 + i / 3];
};
function d3_formatPrefix(d, i) {
- var k = Math.pow(10, Math.abs(8 - i) * 3);
+ var k = Math.pow(10, abs(8 - i) * 3);
return {
scale: i > 8 ? function(d) {
return d / k;
@@ -1881,79 +2202,98 @@ d3 = function() {
symbol: d
};
}
- d3.round = function(x, n) {
- return n ? Math.round(x * (n = Math.pow(10, n))) / n : Math.round(x);
- };
- d3.format = function(specifier) {
- var match = d3_format_re.exec(specifier), fill = match[1] || " ", align = match[2] || ">", sign = match[3] || "", basePrefix = match[4] || "", zfill = match[5], width = +match[6], comma = match[7], precision = match[8], type = match[9], scale = 1, suffix = "", integer = false;
- if (precision) precision = +precision.substring(1);
- if (zfill || fill === "0" && align === "=") {
- zfill = fill = "0";
- align = "=";
- if (comma) width -= Math.floor((width - 1) / 4);
- }
- switch (type) {
- case "n":
- comma = true;
- type = "g";
- break;
+ function d3_locale_numberFormat(locale) {
+ var locale_decimal = locale.decimal, locale_thousands = locale.thousands, locale_grouping = locale.grouping, locale_currency = locale.currency, formatGroup = locale_grouping && locale_thousands ? function(value, width) {
+ var i = value.length, t = [], j = 0, g = locale_grouping[0], length = 0;
+ while (i > 0 && g > 0) {
+ if (length + g + 1 > width) g = Math.max(1, width - length);
+ t.push(value.substring(i -= g, i + g));
+ if ((length += g + 1) > width) break;
+ g = locale_grouping[j = (j + 1) % locale_grouping.length];
+ }
+ return t.reverse().join(locale_thousands);
+ } : d3_identity;
+ return function(specifier) {
+ var match = d3_format_re.exec(specifier), fill = match[1] || " ", align = match[2] || ">", sign = match[3] || "-", symbol = match[4] || "", zfill = match[5], width = +match[6], comma = match[7], precision = match[8], type = match[9], scale = 1, prefix = "", suffix = "", integer = false, exponent = true;
+ if (precision) precision = +precision.substring(1);
+ if (zfill || fill === "0" && align === "=") {
+ zfill = fill = "0";
+ align = "=";
+ }
+ switch (type) {
+ case "n":
+ comma = true;
+ type = "g";
+ break;
+
+ case "%":
+ scale = 100;
+ suffix = "%";
+ type = "f";
+ break;
- case "%":
- scale = 100;
- suffix = "%";
- type = "f";
- break;
+ case "p":
+ scale = 100;
+ suffix = "%";
+ type = "r";
+ break;
- case "p":
- scale = 100;
- suffix = "%";
- type = "r";
- break;
+ case "b":
+ case "o":
+ case "x":
+ case "X":
+ if (symbol === "#") prefix = "0" + type.toLowerCase();
- case "b":
- case "o":
- case "x":
- case "X":
- if (basePrefix) basePrefix = "0" + type.toLowerCase();
+ case "c":
+ exponent = false;
- case "c":
- case "d":
- integer = true;
- precision = 0;
- break;
+ case "d":
+ integer = true;
+ precision = 0;
+ break;
- case "s":
- scale = -1;
- type = "r";
- break;
- }
- if (basePrefix === "#") basePrefix = "";
- if (type == "r" && !precision) type = "g";
- if (precision != null) {
- if (type == "g") precision = Math.max(1, Math.min(21, precision)); else if (type == "e" || type == "f") precision = Math.max(0, Math.min(20, precision));
- }
- type = d3_format_types.get(type) || d3_format_typeDefault;
- var zcomma = zfill && comma;
- return function(value) {
- if (integer && value % 1) return "";
- var negative = value < 0 || value === 0 && 1 / value < 0 ? (value = -value, "-") : sign;
- if (scale < 0) {
- var prefix = d3.formatPrefix(value, precision);
- value = prefix.scale(value);
- suffix = prefix.symbol;
- } else {
- value *= scale;
+ case "s":
+ scale = -1;
+ type = "r";
+ break;
}
- value = type(value, precision);
- if (!zfill && comma) value = d3_format_group(value);
- var length = basePrefix.length + value.length + (zcomma ? 0 : negative.length), padding = length < width ? new Array(length = width - length + 1).join(fill) : "";
- if (zcomma) value = d3_format_group(padding + value);
- if (d3_format_decimalPoint) value.replace(".", d3_format_decimalPoint);
- negative += basePrefix;
- return (align === "<" ? negative + value + padding : align === ">" ? padding + negative + value : align === "^" ? padding.substring(0, length >>= 1) + negative + value + padding.substring(length) : negative + (zcomma ? value : padding + value)) + suffix;
+ if (symbol === "$") prefix = locale_currency[0], suffix = locale_currency[1];
+ if (type == "r" && !precision) type = "g";
+ if (precision != null) {
+ if (type == "g") precision = Math.max(1, Math.min(21, precision)); else if (type == "e" || type == "f") precision = Math.max(0, Math.min(20, precision));
+ }
+ type = d3_format_types.get(type) || d3_format_typeDefault;
+ var zcomma = zfill && comma;
+ return function(value) {
+ var fullSuffix = suffix;
+ if (integer && value % 1) return "";
+ var negative = value < 0 || value === 0 && 1 / value < 0 ? (value = -value, "-") : sign === "-" ? "" : sign;
+ if (scale < 0) {
+ var unit = d3.formatPrefix(value, precision);
+ value = unit.scale(value);
+ fullSuffix = unit.symbol + suffix;
+ } else {
+ value *= scale;
+ }
+ value = type(value, precision);
+ var i = value.lastIndexOf("."), before, after;
+ if (i < 0) {
+ var j = exponent ? value.lastIndexOf("e") : -1;
+ if (j < 0) before = value, after = ""; else before = value.substring(0, j), after = value.substring(j);
+ } else {
+ before = value.substring(0, i);
+ after = locale_decimal + value.substring(i + 1);
+ }
+ if (!zfill && comma) before = formatGroup(before, Infinity);
+ var length = prefix.length + before.length + after.length + (zcomma ? 0 : negative.length), padding = length < width ? new Array(length = width - length + 1).join(fill) : "";
+ if (zcomma) before = formatGroup(padding + before, padding.length ? width - after.length : Infinity);
+ negative += prefix;
+ value = before + after;
+ return (align === "<" ? negative + value + padding : align === ">" ? padding + negative + value : align === "^" ? padding.substring(0, length >>= 1) + negative + value + padding.substring(length) : negative + (zcomma ? value : padding + value)) + fullSuffix;
+ };
};
- };
- var d3_format_re = /(?:([^{])?([<>=^]))?([+\- ])?(#)?(0)?(\d+)?(,)?(\.-?\d+)?([a-z%])?/i;
+ }
+ var d3_format_re = /(?:([^{])?([<>=^]))?([+\- ])?([$#])?(0)?(\d+)?(,)?(\.-?\d+)?([a-z%])?/i;
var d3_format_types = d3.map({
b: function(x) {
return x.toString(2);
@@ -1983,26 +2323,544 @@ d3 = function() {
return (x = d3.round(x, d3_format_precision(x, p))).toFixed(Math.max(0, Math.min(20, d3_format_precision(x * (1 + 1e-15), p))));
}
});
- function d3_format_precision(x, p) {
- return p - (x ? Math.ceil(Math.log(x) / Math.LN10) : 1);
- }
function d3_format_typeDefault(x) {
return x + "";
}
- var d3_format_group = d3_identity;
- if (d3_format_grouping) {
- var d3_format_groupingLength = d3_format_grouping.length;
- d3_format_group = function(value) {
- var i = value.lastIndexOf("."), f = i >= 0 ? "." + value.substring(i + 1) : (i = value.length,
- ""), t = [], j = 0, g = d3_format_grouping[0];
- while (i > 0 && g > 0) {
- t.push(value.substring(i -= g, i + g));
- g = d3_format_grouping[j = (j + 1) % d3_format_groupingLength];
+ var d3_time = d3.time = {}, d3_date = Date;
+ function d3_date_utc() {
+ this._ = new Date(arguments.length > 1 ? Date.UTC.apply(this, arguments) : arguments[0]);
+ }
+ d3_date_utc.prototype = {
+ getDate: function() {
+ return this._.getUTCDate();
+ },
+ getDay: function() {
+ return this._.getUTCDay();
+ },
+ getFullYear: function() {
+ return this._.getUTCFullYear();
+ },
+ getHours: function() {
+ return this._.getUTCHours();
+ },
+ getMilliseconds: function() {
+ return this._.getUTCMilliseconds();
+ },
+ getMinutes: function() {
+ return this._.getUTCMinutes();
+ },
+ getMonth: function() {
+ return this._.getUTCMonth();
+ },
+ getSeconds: function() {
+ return this._.getUTCSeconds();
+ },
+ getTime: function() {
+ return this._.getTime();
+ },
+ getTimezoneOffset: function() {
+ return 0;
+ },
+ valueOf: function() {
+ return this._.valueOf();
+ },
+ setDate: function() {
+ d3_time_prototype.setUTCDate.apply(this._, arguments);
+ },
+ setDay: function() {
+ d3_time_prototype.setUTCDay.apply(this._, arguments);
+ },
+ setFullYear: function() {
+ d3_time_prototype.setUTCFullYear.apply(this._, arguments);
+ },
+ setHours: function() {
+ d3_time_prototype.setUTCHours.apply(this._, arguments);
+ },
+ setMilliseconds: function() {
+ d3_time_prototype.setUTCMilliseconds.apply(this._, arguments);
+ },
+ setMinutes: function() {
+ d3_time_prototype.setUTCMinutes.apply(this._, arguments);
+ },
+ setMonth: function() {
+ d3_time_prototype.setUTCMonth.apply(this._, arguments);
+ },
+ setSeconds: function() {
+ d3_time_prototype.setUTCSeconds.apply(this._, arguments);
+ },
+ setTime: function() {
+ d3_time_prototype.setTime.apply(this._, arguments);
+ }
+ };
+ var d3_time_prototype = Date.prototype;
+ function d3_time_interval(local, step, number) {
+ function round(date) {
+ var d0 = local(date), d1 = offset(d0, 1);
+ return date - d0 < d1 - date ? d0 : d1;
+ }
+ function ceil(date) {
+ step(date = local(new d3_date(date - 1)), 1);
+ return date;
+ }
+ function offset(date, k) {
+ step(date = new d3_date(+date), k);
+ return date;
+ }
+ function range(t0, t1, dt) {
+ var time = ceil(t0), times = [];
+ if (dt > 1) {
+ while (time < t1) {
+ if (!(number(time) % dt)) times.push(new Date(+time));
+ step(time, 1);
+ }
+ } else {
+ while (time < t1) times.push(new Date(+time)), step(time, 1);
+ }
+ return times;
+ }
+ function range_utc(t0, t1, dt) {
+ try {
+ d3_date = d3_date_utc;
+ var utc = new d3_date_utc();
+ utc._ = t0;
+ return range(utc, t1, dt);
+ } finally {
+ d3_date = Date;
+ }
+ }
+ local.floor = local;
+ local.round = round;
+ local.ceil = ceil;
+ local.offset = offset;
+ local.range = range;
+ var utc = local.utc = d3_time_interval_utc(local);
+ utc.floor = utc;
+ utc.round = d3_time_interval_utc(round);
+ utc.ceil = d3_time_interval_utc(ceil);
+ utc.offset = d3_time_interval_utc(offset);
+ utc.range = range_utc;
+ return local;
+ }
+ function d3_time_interval_utc(method) {
+ return function(date, k) {
+ try {
+ d3_date = d3_date_utc;
+ var utc = new d3_date_utc();
+ utc._ = date;
+ return method(utc, k)._;
+ } finally {
+ d3_date = Date;
}
- return t.reverse().join(d3_format_thousandsSeparator || "") + f;
};
}
+ d3_time.year = d3_time_interval(function(date) {
+ date = d3_time.day(date);
+ date.setMonth(0, 1);
+ return date;
+ }, function(date, offset) {
+ date.setFullYear(date.getFullYear() + offset);
+ }, function(date) {
+ return date.getFullYear();
+ });
+ d3_time.years = d3_time.year.range;
+ d3_time.years.utc = d3_time.year.utc.range;
+ d3_time.day = d3_time_interval(function(date) {
+ var day = new d3_date(2e3, 0);
+ day.setFullYear(date.getFullYear(), date.getMonth(), date.getDate());
+ return day;
+ }, function(date, offset) {
+ date.setDate(date.getDate() + offset);
+ }, function(date) {
+ return date.getDate() - 1;
+ });
+ d3_time.days = d3_time.day.range;
+ d3_time.days.utc = d3_time.day.utc.range;
+ d3_time.dayOfYear = function(date) {
+ var year = d3_time.year(date);
+ return Math.floor((date - year - (date.getTimezoneOffset() - year.getTimezoneOffset()) * 6e4) / 864e5);
+ };
+ [ "sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday" ].forEach(function(day, i) {
+ i = 7 - i;
+ var interval = d3_time[day] = d3_time_interval(function(date) {
+ (date = d3_time.day(date)).setDate(date.getDate() - (date.getDay() + i) % 7);
+ return date;
+ }, function(date, offset) {
+ date.setDate(date.getDate() + Math.floor(offset) * 7);
+ }, function(date) {
+ var day = d3_time.year(date).getDay();
+ return Math.floor((d3_time.dayOfYear(date) + (day + i) % 7) / 7) - (day !== i);
+ });
+ d3_time[day + "s"] = interval.range;
+ d3_time[day + "s"].utc = interval.utc.range;
+ d3_time[day + "OfYear"] = function(date) {
+ var day = d3_time.year(date).getDay();
+ return Math.floor((d3_time.dayOfYear(date) + (day + i) % 7) / 7);
+ };
+ });
+ d3_time.week = d3_time.sunday;
+ d3_time.weeks = d3_time.sunday.range;
+ d3_time.weeks.utc = d3_time.sunday.utc.range;
+ d3_time.weekOfYear = d3_time.sundayOfYear;
+ function d3_locale_timeFormat(locale) {
+ var locale_dateTime = locale.dateTime, locale_date = locale.date, locale_time = locale.time, locale_periods = locale.periods, locale_days = locale.days, locale_shortDays = locale.shortDays, locale_months = locale.months, locale_shortMonths = locale.shortMonths;
+ function d3_time_format(template) {
+ var n = template.length;
+ function format(date) {
+ var string = [], i = -1, j = 0, c, p, f;
+ while (++i < n) {
+ if (template.charCodeAt(i) === 37) {
+ string.push(template.slice(j, i));
+ if ((p = d3_time_formatPads[c = template.charAt(++i)]) != null) c = template.charAt(++i);
+ if (f = d3_time_formats[c]) c = f(date, p == null ? c === "e" ? " " : "0" : p);
+ string.push(c);
+ j = i + 1;
+ }
+ }
+ string.push(template.slice(j, i));
+ return string.join("");
+ }
+ format.parse = function(string) {
+ var d = {
+ y: 1900,
+ m: 0,
+ d: 1,
+ H: 0,
+ M: 0,
+ S: 0,
+ L: 0,
+ Z: null
+ }, i = d3_time_parse(d, template, string, 0);
+ if (i != string.length) return null;
+ if ("p" in d) d.H = d.H % 12 + d.p * 12;
+ var localZ = d.Z != null && d3_date !== d3_date_utc, date = new (localZ ? d3_date_utc : d3_date)();
+ if ("j" in d) date.setFullYear(d.y, 0, d.j); else if ("w" in d && ("W" in d || "U" in d)) {
+ date.setFullYear(d.y, 0, 1);
+ date.setFullYear(d.y, 0, "W" in d ? (d.w + 6) % 7 + d.W * 7 - (date.getDay() + 5) % 7 : d.w + d.U * 7 - (date.getDay() + 6) % 7);
+ } else date.setFullYear(d.y, d.m, d.d);
+ date.setHours(d.H + (d.Z / 100 | 0), d.M + d.Z % 100, d.S, d.L);
+ return localZ ? date._ : date;
+ };
+ format.toString = function() {
+ return template;
+ };
+ return format;
+ }
+ function d3_time_parse(date, template, string, j) {
+ var c, p, t, i = 0, n = template.length, m = string.length;
+ while (i < n) {
+ if (j >= m) return -1;
+ c = template.charCodeAt(i++);
+ if (c === 37) {
+ t = template.charAt(i++);
+ p = d3_time_parsers[t in d3_time_formatPads ? template.charAt(i++) : t];
+ if (!p || (j = p(date, string, j)) < 0) return -1;
+ } else if (c != string.charCodeAt(j++)) {
+ return -1;
+ }
+ }
+ return j;
+ }
+ d3_time_format.utc = function(template) {
+ var local = d3_time_format(template);
+ function format(date) {
+ try {
+ d3_date = d3_date_utc;
+ var utc = new d3_date();
+ utc._ = date;
+ return local(utc);
+ } finally {
+ d3_date = Date;
+ }
+ }
+ format.parse = function(string) {
+ try {
+ d3_date = d3_date_utc;
+ var date = local.parse(string);
+ return date && date._;
+ } finally {
+ d3_date = Date;
+ }
+ };
+ format.toString = local.toString;
+ return format;
+ };
+ d3_time_format.multi = d3_time_format.utc.multi = d3_time_formatMulti;
+ var d3_time_periodLookup = d3.map(), d3_time_dayRe = d3_time_formatRe(locale_days), d3_time_dayLookup = d3_time_formatLookup(locale_days), d3_time_dayAbbrevRe = d3_time_formatRe(locale_shortDays), d3_time_dayAbbrevLookup = d3_time_formatLookup(locale_shortDays), d3_time_monthRe = d3_time_formatRe(locale_months), d3_time_monthLookup = d3_time_formatLookup(locale_months), d3_time_monthAbbrevRe = d3_time_formatRe(locale_shortMonths), d3_time_monthAbbrevLookup = d3_time_formatLookup(locale_shortMonths);
+ locale_periods.forEach(function(p, i) {
+ d3_time_periodLookup.set(p.toLowerCase(), i);
+ });
+ var d3_time_formats = {
+ a: function(d) {
+ return locale_shortDays[d.getDay()];
+ },
+ A: function(d) {
+ return locale_days[d.getDay()];
+ },
+ b: function(d) {
+ return locale_shortMonths[d.getMonth()];
+ },
+ B: function(d) {
+ return locale_months[d.getMonth()];
+ },
+ c: d3_time_format(locale_dateTime),
+ d: function(d, p) {
+ return d3_time_formatPad(d.getDate(), p, 2);
+ },
+ e: function(d, p) {
+ return d3_time_formatPad(d.getDate(), p, 2);
+ },
+ H: function(d, p) {
+ return d3_time_formatPad(d.getHours(), p, 2);
+ },
+ I: function(d, p) {
+ return d3_time_formatPad(d.getHours() % 12 || 12, p, 2);
+ },
+ j: function(d, p) {
+ return d3_time_formatPad(1 + d3_time.dayOfYear(d), p, 3);
+ },
+ L: function(d, p) {
+ return d3_time_formatPad(d.getMilliseconds(), p, 3);
+ },
+ m: function(d, p) {
+ return d3_time_formatPad(d.getMonth() + 1, p, 2);
+ },
+ M: function(d, p) {
+ return d3_time_formatPad(d.getMinutes(), p, 2);
+ },
+ p: function(d) {
+ return locale_periods[+(d.getHours() >= 12)];
+ },
+ S: function(d, p) {
+ return d3_time_formatPad(d.getSeconds(), p, 2);
+ },
+ U: function(d, p) {
+ return d3_time_formatPad(d3_time.sundayOfYear(d), p, 2);
+ },
+ w: function(d) {
+ return d.getDay();
+ },
+ W: function(d, p) {
+ return d3_time_formatPad(d3_time.mondayOfYear(d), p, 2);
+ },
+ x: d3_time_format(locale_date),
+ X: d3_time_format(locale_time),
+ y: function(d, p) {
+ return d3_time_formatPad(d.getFullYear() % 100, p, 2);
+ },
+ Y: function(d, p) {
+ return d3_time_formatPad(d.getFullYear() % 1e4, p, 4);
+ },
+ Z: d3_time_zone,
+ "%": function() {
+ return "%";
+ }
+ };
+ var d3_time_parsers = {
+ a: d3_time_parseWeekdayAbbrev,
+ A: d3_time_parseWeekday,
+ b: d3_time_parseMonthAbbrev,
+ B: d3_time_parseMonth,
+ c: d3_time_parseLocaleFull,
+ d: d3_time_parseDay,
+ e: d3_time_parseDay,
+ H: d3_time_parseHour24,
+ I: d3_time_parseHour24,
+ j: d3_time_parseDayOfYear,
+ L: d3_time_parseMilliseconds,
+ m: d3_time_parseMonthNumber,
+ M: d3_time_parseMinutes,
+ p: d3_time_parseAmPm,
+ S: d3_time_parseSeconds,
+ U: d3_time_parseWeekNumberSunday,
+ w: d3_time_parseWeekdayNumber,
+ W: d3_time_parseWeekNumberMonday,
+ x: d3_time_parseLocaleDate,
+ X: d3_time_parseLocaleTime,
+ y: d3_time_parseYear,
+ Y: d3_time_parseFullYear,
+ Z: d3_time_parseZone,
+ "%": d3_time_parseLiteralPercent
+ };
+ function d3_time_parseWeekdayAbbrev(date, string, i) {
+ d3_time_dayAbbrevRe.lastIndex = 0;
+ var n = d3_time_dayAbbrevRe.exec(string.slice(i));
+ return n ? (date.w = d3_time_dayAbbrevLookup.get(n[0].toLowerCase()), i + n[0].length) : -1;
+ }
+ function d3_time_parseWeekday(date, string, i) {
+ d3_time_dayRe.lastIndex = 0;
+ var n = d3_time_dayRe.exec(string.slice(i));
+ return n ? (date.w = d3_time_dayLookup.get(n[0].toLowerCase()), i + n[0].length) : -1;
+ }
+ function d3_time_parseMonthAbbrev(date, string, i) {
+ d3_time_monthAbbrevRe.lastIndex = 0;
+ var n = d3_time_monthAbbrevRe.exec(string.slice(i));
+ return n ? (date.m = d3_time_monthAbbrevLookup.get(n[0].toLowerCase()), i + n[0].length) : -1;
+ }
+ function d3_time_parseMonth(date, string, i) {
+ d3_time_monthRe.lastIndex = 0;
+ var n = d3_time_monthRe.exec(string.slice(i));
+ return n ? (date.m = d3_time_monthLookup.get(n[0].toLowerCase()), i + n[0].length) : -1;
+ }
+ function d3_time_parseLocaleFull(date, string, i) {
+ return d3_time_parse(date, d3_time_formats.c.toString(), string, i);
+ }
+ function d3_time_parseLocaleDate(date, string, i) {
+ return d3_time_parse(date, d3_time_formats.x.toString(), string, i);
+ }
+ function d3_time_parseLocaleTime(date, string, i) {
+ return d3_time_parse(date, d3_time_formats.X.toString(), string, i);
+ }
+ function d3_time_parseAmPm(date, string, i) {
+ var n = d3_time_periodLookup.get(string.slice(i, i += 2).toLowerCase());
+ return n == null ? -1 : (date.p = n, i);
+ }
+ return d3_time_format;
+ }
+ var d3_time_formatPads = {
+ "-": "",
+ _: " ",
+ "0": "0"
+ }, d3_time_numberRe = /^\s*\d+/, d3_time_percentRe = /^%/;
+ function d3_time_formatPad(value, fill, width) {
+ var sign = value < 0 ? "-" : "", string = (sign ? -value : value) + "", length = string.length;
+ return sign + (length < width ? new Array(width - length + 1).join(fill) + string : string);
+ }
+ function d3_time_formatRe(names) {
+ return new RegExp("^(?:" + names.map(d3.requote).join("|") + ")", "i");
+ }
+ function d3_time_formatLookup(names) {
+ var map = new d3_Map(), i = -1, n = names.length;
+ while (++i < n) map.set(names[i].toLowerCase(), i);
+ return map;
+ }
+ function d3_time_parseWeekdayNumber(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 1));
+ return n ? (date.w = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseWeekNumberSunday(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i));
+ return n ? (date.U = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseWeekNumberMonday(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i));
+ return n ? (date.W = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseFullYear(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 4));
+ return n ? (date.y = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseYear(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 2));
+ return n ? (date.y = d3_time_expandYear(+n[0]), i + n[0].length) : -1;
+ }
+ function d3_time_parseZone(date, string, i) {
+ return /^[+-]\d{4}$/.test(string = string.slice(i, i + 5)) ? (date.Z = -string,
+ i + 5) : -1;
+ }
+ function d3_time_expandYear(d) {
+ return d + (d > 68 ? 1900 : 2e3);
+ }
+ function d3_time_parseMonthNumber(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 2));
+ return n ? (date.m = n[0] - 1, i + n[0].length) : -1;
+ }
+ function d3_time_parseDay(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 2));
+ return n ? (date.d = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseDayOfYear(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 3));
+ return n ? (date.j = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseHour24(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 2));
+ return n ? (date.H = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseMinutes(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 2));
+ return n ? (date.M = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseSeconds(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 2));
+ return n ? (date.S = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_parseMilliseconds(date, string, i) {
+ d3_time_numberRe.lastIndex = 0;
+ var n = d3_time_numberRe.exec(string.slice(i, i + 3));
+ return n ? (date.L = +n[0], i + n[0].length) : -1;
+ }
+ function d3_time_zone(d) {
+ var z = d.getTimezoneOffset(), zs = z > 0 ? "-" : "+", zh = abs(z) / 60 | 0, zm = abs(z) % 60;
+ return zs + d3_time_formatPad(zh, "0", 2) + d3_time_formatPad(zm, "0", 2);
+ }
+ function d3_time_parseLiteralPercent(date, string, i) {
+ d3_time_percentRe.lastIndex = 0;
+ var n = d3_time_percentRe.exec(string.slice(i, i + 1));
+ return n ? i + n[0].length : -1;
+ }
+ function d3_time_formatMulti(formats) {
+ var n = formats.length, i = -1;
+ while (++i < n) formats[i][0] = this(formats[i][0]);
+ return function(date) {
+ var i = 0, f = formats[i];
+ while (!f[1](date)) f = formats[++i];
+ return f[0](date);
+ };
+ }
+ d3.locale = function(locale) {
+ return {
+ numberFormat: d3_locale_numberFormat(locale),
+ timeFormat: d3_locale_timeFormat(locale)
+ };
+ };
+ var d3_locale_enUS = d3.locale({
+ decimal: ".",
+ thousands: ",",
+ grouping: [ 3 ],
+ currency: [ "$", "" ],
+ dateTime: "%a %b %e %X %Y",
+ date: "%m/%d/%Y",
+ time: "%H:%M:%S",
+ periods: [ "AM", "PM" ],
+ days: [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ],
+ shortDays: [ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ],
+ months: [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ],
+ shortMonths: [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ]
+ });
+ d3.format = d3_locale_enUS.numberFormat;
d3.geo = {};
+ function d3_adder() {}
+ d3_adder.prototype = {
+ s: 0,
+ t: 0,
+ add: function(y) {
+ d3_adderSum(y, this.t, d3_adderTemp);
+ d3_adderSum(d3_adderTemp.s, this.s, this);
+ if (this.s) this.t += d3_adderTemp.t; else this.s = d3_adderTemp.t;
+ },
+ reset: function() {
+ this.s = this.t = 0;
+ },
+ valueOf: function() {
+ return this.s;
+ }
+ };
+ var d3_adderTemp = new d3_adder();
+ function d3_adderSum(a, b, o) {
+ var x = o.s = a + b, bv = x - a, av = x - bv;
+ o.t = a - av + (b - bv);
+ }
d3.geo.stream = function(object, listener) {
if (object && d3_geo_streamObjectType.hasOwnProperty(object.type)) {
d3_geo_streamObjectType[object.type](object, listener);
@@ -2029,12 +2887,12 @@ d3 = function() {
listener.sphere();
},
Point: function(object, listener) {
- var coordinate = object.coordinates;
- listener.point(coordinate[0], coordinate[1]);
+ object = object.coordinates;
+ listener.point(object[0], object[1], object[2]);
},
MultiPoint: function(object, listener) {
- var coordinates = object.coordinates, i = -1, n = coordinates.length, coordinate;
- while (++i < n) coordinate = coordinates[i], listener.point(coordinate[0], coordinate[1]);
+ var coordinates = object.coordinates, i = -1, n = coordinates.length;
+ while (++i < n) object = coordinates[i], listener.point(object[0], object[1], object[2]);
},
LineString: function(object, listener) {
d3_geo_streamLine(object.coordinates, listener, 0);
@@ -2058,7 +2916,7 @@ d3 = function() {
function d3_geo_streamLine(coordinates, listener, closed) {
var i = -1, n = coordinates.length - closed, coordinate;
listener.lineStart();
- while (++i < n) coordinate = coordinates[i], listener.point(coordinate[0], coordinate[1]);
+ while (++i < n) coordinate = coordinates[i], listener.point(coordinate[0], coordinate[1], coordinate[2]);
listener.lineEnd();
}
function d3_geo_streamPolygon(coordinates, listener) {
@@ -2072,7 +2930,7 @@ d3 = function() {
d3.geo.stream(object, d3_geo_area);
return d3_geo_areaSum;
};
- var d3_geo_areaSum, d3_geo_areaRingU, d3_geo_areaRingV;
+ var d3_geo_areaSum, d3_geo_areaRingSum = new d3_adder();
var d3_geo_area = {
sphere: function() {
d3_geo_areaSum += 4 * π;
@@ -2081,11 +2939,11 @@ d3 = function() {
lineStart: d3_noop,
lineEnd: d3_noop,
polygonStart: function() {
- d3_geo_areaRingU = 1, d3_geo_areaRingV = 0;
+ d3_geo_areaRingSum.reset();
d3_geo_area.lineStart = d3_geo_areaRingStart;
},
polygonEnd: function() {
- var area = 2 * Math.atan2(d3_geo_areaRingV, d3_geo_areaRingU);
+ var area = 2 * d3_geo_areaRingSum;
d3_geo_areaSum += area < 0 ? 4 * π + area : area;
d3_geo_area.lineStart = d3_geo_area.lineEnd = d3_geo_area.point = d3_noop;
}
@@ -2100,68 +2958,191 @@ d3 = function() {
function nextPoint(λ, φ) {
λ *= d3_radians;
φ = φ * d3_radians / 2 + π / 4;
- var dλ = λ - λ0, cosφ = Math.cos(φ), sinφ = Math.sin(φ), k = sinφ0 * sinφ, u0 = d3_geo_areaRingU, v0 = d3_geo_areaRingV, u = cosφ0 * cosφ + k * Math.cos(dλ), v = k * Math.sin(dλ);
- d3_geo_areaRingU = u0 * u - v0 * v;
- d3_geo_areaRingV = v0 * u + u0 * v;
+ var dλ = λ - λ0, sdλ = dλ >= 0 ? 1 : -1, adλ = sdλ * dλ, cosφ = Math.cos(φ), sinφ = Math.sin(φ), k = sinφ0 * sinφ, u = cosφ0 * cosφ + k * Math.cos(adλ), v = k * sdλ * Math.sin(adλ);
+ d3_geo_areaRingSum.add(Math.atan2(v, u));
λ0 = λ, cosφ0 = cosφ, sinφ0 = sinφ;
}
d3_geo_area.lineEnd = function() {
nextPoint(λ00, φ00);
};
}
- d3.geo.bounds = d3_geo_bounds(d3_identity);
- function d3_geo_bounds(projectStream) {
- var x0, y0, x1, y1;
+ function d3_geo_cartesian(spherical) {
+ var λ = spherical[0], φ = spherical[1], cosφ = Math.cos(φ);
+ return [ cosφ * Math.cos(λ), cosφ * Math.sin(λ), Math.sin(φ) ];
+ }
+ function d3_geo_cartesianDot(a, b) {
+ return a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
+ }
+ function d3_geo_cartesianCross(a, b) {
+ return [ a[1] * b[2] - a[2] * b[1], a[2] * b[0] - a[0] * b[2], a[0] * b[1] - a[1] * b[0] ];
+ }
+ function d3_geo_cartesianAdd(a, b) {
+ a[0] += b[0];
+ a[1] += b[1];
+ a[2] += b[2];
+ }
+ function d3_geo_cartesianScale(vector, k) {
+ return [ vector[0] * k, vector[1] * k, vector[2] * k ];
+ }
+ function d3_geo_cartesianNormalize(d) {
+ var l = Math.sqrt(d[0] * d[0] + d[1] * d[1] + d[2] * d[2]);
+ d[0] /= l;
+ d[1] /= l;
+ d[2] /= l;
+ }
+ function d3_geo_spherical(cartesian) {
+ return [ Math.atan2(cartesian[1], cartesian[0]), d3_asin(cartesian[2]) ];
+ }
+ function d3_geo_sphericalEqual(a, b) {
+ return abs(a[0] - b[0]) < ε && abs(a[1] - b[1]) < ε;
+ }
+ d3.geo.bounds = function() {
+ var λ0, φ0, λ1, φ1, λ_, λ__, φ__, p0, dλSum, ranges, range;
var bound = {
- point: boundPoint,
- lineStart: d3_noop,
- lineEnd: d3_noop,
+ point: point,
+ lineStart: lineStart,
+ lineEnd: lineEnd,
polygonStart: function() {
- bound.lineEnd = boundPolygonLineEnd;
+ bound.point = ringPoint;
+ bound.lineStart = ringStart;
+ bound.lineEnd = ringEnd;
+ dλSum = 0;
+ d3_geo_area.polygonStart();
},
polygonEnd: function() {
- bound.point = boundPoint;
+ d3_geo_area.polygonEnd();
+ bound.point = point;
+ bound.lineStart = lineStart;
+ bound.lineEnd = lineEnd;
+ if (d3_geo_areaRingSum < 0) λ0 = -(λ1 = 180), φ0 = -(φ1 = 90); else if (dλSum > ε) φ1 = 90; else if (dλSum < -ε) φ0 = -90;
+ range[0] = λ0, range[1] = λ1;
+ }
+ };
+ function point(λ, φ) {
+ ranges.push(range = [ λ0 = λ, λ1 = λ ]);
+ if (φ < φ0) φ0 = φ;
+ if (φ > φ1) φ1 = φ;
+ }
+ function linePoint(λ, φ) {
+ var p = d3_geo_cartesian([ λ * d3_radians, φ * d3_radians ]);
+ if (p0) {
+ var normal = d3_geo_cartesianCross(p0, p), equatorial = [ normal[1], -normal[0], 0 ], inflection = d3_geo_cartesianCross(equatorial, normal);
+ d3_geo_cartesianNormalize(inflection);
+ inflection = d3_geo_spherical(inflection);
+ var dλ = λ - λ_, s = dλ > 0 ? 1 : -1, λi = inflection[0] * d3_degrees * s, antimeridian = abs(dλ) > 180;
+ if (antimeridian ^ (s * λ_ < λi && λi < s * λ)) {
+ var φi = inflection[1] * d3_degrees;
+ if (φi > φ1) φ1 = φi;
+ } else if (λi = (λi + 360) % 360 - 180, antimeridian ^ (s * λ_ < λi && λi < s * λ)) {
+ var φi = -inflection[1] * d3_degrees;
+ if (φi < φ0) φ0 = φi;
+ } else {
+ if (φ < φ0) φ0 = φ;
+ if (φ > φ1) φ1 = φ;
+ }
+ if (antimeridian) {
+ if (λ < λ_) {
+ if (angle(λ0, λ) > angle(λ0, λ1)) λ1 = λ;
+ } else {
+ if (angle(λ, λ1) > angle(λ0, λ1)) λ0 = λ;
+ }
+ } else {
+ if (λ1 >= λ0) {
+ if (λ < λ0) λ0 = λ;
+ if (λ > λ1) λ1 = λ;
+ } else {
+ if (λ > λ_) {
+ if (angle(λ0, λ) > angle(λ0, λ1)) λ1 = λ;
+ } else {
+ if (angle(λ, λ1) > angle(λ0, λ1)) λ0 = λ;
+ }
+ }
+ }
+ } else {
+ point(λ, φ);
}
- };
- function boundPoint(x, y) {
- if (x < x0) x0 = x;
- if (x > x1) x1 = x;
- if (y < y0) y0 = y;
- if (y > y1) y1 = y;
+ p0 = p, λ_ = λ;
+ }
+ function lineStart() {
+ bound.point = linePoint;
+ }
+ function lineEnd() {
+ range[0] = λ0, range[1] = λ1;
+ bound.point = point;
+ p0 = null;
+ }
+ function ringPoint(λ, φ) {
+ if (p0) {
+ var dλ = λ - λ_;
+ dλSum += abs(dλ) > 180 ? dλ + (dλ > 0 ? 360 : -360) : dλ;
+ } else λ__ = λ, φ__ = φ;
+ d3_geo_area.point(λ, φ);
+ linePoint(λ, φ);
+ }
+ function ringStart() {
+ d3_geo_area.lineStart();
+ }
+ function ringEnd() {
+ ringPoint(λ__, φ__);
+ d3_geo_area.lineEnd();
+ if (abs(dλSum) > ε) λ0 = -(λ1 = 180);
+ range[0] = λ0, range[1] = λ1;
+ p0 = null;
+ }
+ function angle(λ0, λ1) {
+ return (λ1 -= λ0) < 0 ? λ1 + 360 : λ1;
}
- function boundPolygonLineEnd() {
- bound.point = bound.lineEnd = d3_noop;
+ function compareRanges(a, b) {
+ return a[0] - b[0];
+ }
+ function withinRange(x, range) {
+ return range[0] <= range[1] ? range[0] <= x && x <= range[1] : x < range[0] || range[1] < x;
}
return function(feature) {
- y1 = x1 = -(x0 = y0 = Infinity);
- d3.geo.stream(feature, projectStream(bound));
- return [ [ x0, y0 ], [ x1, y1 ] ];
+ φ1 = λ1 = -(λ0 = φ0 = Infinity);
+ ranges = [];
+ d3.geo.stream(feature, bound);
+ var n = ranges.length;
+ if (n) {
+ ranges.sort(compareRanges);
+ for (var i = 1, a = ranges[0], b, merged = [ a ]; i < n; ++i) {
+ b = ranges[i];
+ if (withinRange(b[0], a) || withinRange(b[1], a)) {
+ if (angle(a[0], b[1]) > angle(a[0], a[1])) a[1] = b[1];
+ if (angle(b[0], a[1]) > angle(a[0], a[1])) a[0] = b[0];
+ } else {
+ merged.push(a = b);
+ }
+ }
+ var best = -Infinity, dλ;
+ for (var n = merged.length - 1, i = 0, a = merged[n], b; i <= n; a = b, ++i) {
+ b = merged[i];
+ if ((dλ = angle(a[1], b[0])) > best) best = dλ, λ0 = b[0], λ1 = a[1];
+ }
+ }
+ ranges = range = null;
+ return λ0 === Infinity || φ0 === Infinity ? [ [ NaN, NaN ], [ NaN, NaN ] ] : [ [ λ0, φ0 ], [ λ1, φ1 ] ];
};
- }
+ }();
d3.geo.centroid = function(object) {
- d3_geo_centroidDimension = d3_geo_centroidW = d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
+ d3_geo_centroidW0 = d3_geo_centroidW1 = d3_geo_centroidX0 = d3_geo_centroidY0 = d3_geo_centroidZ0 = d3_geo_centroidX1 = d3_geo_centroidY1 = d3_geo_centroidZ1 = d3_geo_centroidX2 = d3_geo_centroidY2 = d3_geo_centroidZ2 = 0;
d3.geo.stream(object, d3_geo_centroid);
- var m;
- if (d3_geo_centroidW && Math.abs(m = Math.sqrt(d3_geo_centroidX * d3_geo_centroidX + d3_geo_centroidY * d3_geo_centroidY + d3_geo_centroidZ * d3_geo_centroidZ)) > ε) {
- return [ Math.atan2(d3_geo_centroidY, d3_geo_centroidX) * d3_degrees, Math.asin(Math.max(-1, Math.min(1, d3_geo_centroidZ / m))) * d3_degrees ];
+ var x = d3_geo_centroidX2, y = d3_geo_centroidY2, z = d3_geo_centroidZ2, m = x * x + y * y + z * z;
+ if (m < ε2) {
+ x = d3_geo_centroidX1, y = d3_geo_centroidY1, z = d3_geo_centroidZ1;
+ if (d3_geo_centroidW1 < ε) x = d3_geo_centroidX0, y = d3_geo_centroidY0, z = d3_geo_centroidZ0;
+ m = x * x + y * y + z * z;
+ if (m < ε2) return [ NaN, NaN ];
}
+ return [ Math.atan2(y, x) * d3_degrees, d3_asin(z / Math.sqrt(m)) * d3_degrees ];
};
- var d3_geo_centroidDimension, d3_geo_centroidW, d3_geo_centroidX, d3_geo_centroidY, d3_geo_centroidZ;
+ var d3_geo_centroidW0, d3_geo_centroidW1, d3_geo_centroidX0, d3_geo_centroidY0, d3_geo_centroidZ0, d3_geo_centroidX1, d3_geo_centroidY1, d3_geo_centroidZ1, d3_geo_centroidX2, d3_geo_centroidY2, d3_geo_centroidZ2;
var d3_geo_centroid = {
- sphere: function() {
- if (d3_geo_centroidDimension < 2) {
- d3_geo_centroidDimension = 2;
- d3_geo_centroidW = d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
- }
- },
+ sphere: d3_noop,
point: d3_geo_centroidPoint,
lineStart: d3_geo_centroidLineStart,
lineEnd: d3_geo_centroidLineEnd,
polygonStart: function() {
- if (d3_geo_centroidDimension < 2) {
- d3_geo_centroidDimension = 2;
- d3_geo_centroidW = d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
- }
d3_geo_centroid.lineStart = d3_geo_centroidRingStart;
},
polygonEnd: function() {
@@ -2169,36 +3150,18 @@ d3 = function() {
}
};
function d3_geo_centroidPoint(λ, φ) {
- if (d3_geo_centroidDimension) return;
- ++d3_geo_centroidW;
λ *= d3_radians;
var cosφ = Math.cos(φ *= d3_radians);
- d3_geo_centroidX += (cosφ * Math.cos(λ) - d3_geo_centroidX) / d3_geo_centroidW;
- d3_geo_centroidY += (cosφ * Math.sin(λ) - d3_geo_centroidY) / d3_geo_centroidW;
- d3_geo_centroidZ += (Math.sin(φ) - d3_geo_centroidZ) / d3_geo_centroidW;
+ d3_geo_centroidPointXYZ(cosφ * Math.cos(λ), cosφ * Math.sin(λ), Math.sin(φ));
}
- function d3_geo_centroidRingStart() {
- var λ00, φ00;
- d3_geo_centroidDimension = 1;
- d3_geo_centroidLineStart();
- d3_geo_centroidDimension = 2;
- var linePoint = d3_geo_centroid.point;
- d3_geo_centroid.point = function(λ, φ) {
- linePoint(λ00 = λ, φ00 = φ);
- };
- d3_geo_centroid.lineEnd = function() {
- d3_geo_centroid.point(λ00, φ00);
- d3_geo_centroidLineEnd();
- d3_geo_centroid.lineEnd = d3_geo_centroidLineEnd;
- };
+ function d3_geo_centroidPointXYZ(x, y, z) {
+ ++d3_geo_centroidW0;
+ d3_geo_centroidX0 += (x - d3_geo_centroidX0) / d3_geo_centroidW0;
+ d3_geo_centroidY0 += (y - d3_geo_centroidY0) / d3_geo_centroidW0;
+ d3_geo_centroidZ0 += (z - d3_geo_centroidZ0) / d3_geo_centroidW0;
}
function d3_geo_centroidLineStart() {
var x0, y0, z0;
- if (d3_geo_centroidDimension > 1) return;
- if (d3_geo_centroidDimension < 1) {
- d3_geo_centroidDimension = 1;
- d3_geo_centroidW = d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
- }
d3_geo_centroid.point = function(λ, φ) {
λ *= d3_radians;
var cosφ = Math.cos(φ *= d3_radians);
@@ -2206,53 +3169,64 @@ d3 = function() {
y0 = cosφ * Math.sin(λ);
z0 = Math.sin(φ);
d3_geo_centroid.point = nextPoint;
+ d3_geo_centroidPointXYZ(x0, y0, z0);
};
function nextPoint(λ, φ) {
λ *= d3_radians;
var cosφ = Math.cos(φ *= d3_radians), x = cosφ * Math.cos(λ), y = cosφ * Math.sin(λ), z = Math.sin(φ), w = Math.atan2(Math.sqrt((w = y0 * z - z0 * y) * w + (w = z0 * x - x0 * z) * w + (w = x0 * y - y0 * x) * w), x0 * x + y0 * y + z0 * z);
- d3_geo_centroidW += w;
- d3_geo_centroidX += w * (x0 + (x0 = x));
- d3_geo_centroidY += w * (y0 + (y0 = y));
- d3_geo_centroidZ += w * (z0 + (z0 = z));
+ d3_geo_centroidW1 += w;
+ d3_geo_centroidX1 += w * (x0 + (x0 = x));
+ d3_geo_centroidY1 += w * (y0 + (y0 = y));
+ d3_geo_centroidZ1 += w * (z0 + (z0 = z));
+ d3_geo_centroidPointXYZ(x0, y0, z0);
}
}
function d3_geo_centroidLineEnd() {
d3_geo_centroid.point = d3_geo_centroidPoint;
}
- function d3_geo_cartesian(spherical) {
- var λ = spherical[0], φ = spherical[1], cosφ = Math.cos(φ);
- return [ cosφ * Math.cos(λ), cosφ * Math.sin(λ), Math.sin(φ) ];
- }
- function d3_geo_cartesianDot(a, b) {
- return a[0] * b[0] + a[1] * b[1] + a[2] * b[2];
- }
- function d3_geo_cartesianCross(a, b) {
- return [ a[1] * b[2] - a[2] * b[1], a[2] * b[0] - a[0] * b[2], a[0] * b[1] - a[1] * b[0] ];
- }
- function d3_geo_cartesianAdd(a, b) {
- a[0] += b[0];
- a[1] += b[1];
- a[2] += b[2];
- }
- function d3_geo_cartesianScale(vector, k) {
- return [ vector[0] * k, vector[1] * k, vector[2] * k ];
+ function d3_geo_centroidRingStart() {
+ var λ00, φ00, x0, y0, z0;
+ d3_geo_centroid.point = function(λ, φ) {
+ λ00 = λ, φ00 = φ;
+ d3_geo_centroid.point = nextPoint;
+ λ *= d3_radians;
+ var cosφ = Math.cos(φ *= d3_radians);
+ x0 = cosφ * Math.cos(λ);
+ y0 = cosφ * Math.sin(λ);
+ z0 = Math.sin(φ);
+ d3_geo_centroidPointXYZ(x0, y0, z0);
+ };
+ d3_geo_centroid.lineEnd = function() {
+ nextPoint(λ00, φ00);
+ d3_geo_centroid.lineEnd = d3_geo_centroidLineEnd;
+ d3_geo_centroid.point = d3_geo_centroidPoint;
+ };
+ function nextPoint(λ, φ) {
+ λ *= d3_radians;
+ var cosφ = Math.cos(φ *= d3_radians), x = cosφ * Math.cos(λ), y = cosφ * Math.sin(λ), z = Math.sin(φ), cx = y0 * z - z0 * y, cy = z0 * x - x0 * z, cz = x0 * y - y0 * x, m = Math.sqrt(cx * cx + cy * cy + cz * cz), u = x0 * x + y0 * y + z0 * z, v = m && -d3_acos(u) / m, w = Math.atan2(m, u);
+ d3_geo_centroidX2 += v * cx;
+ d3_geo_centroidY2 += v * cy;
+ d3_geo_centroidZ2 += v * cz;
+ d3_geo_centroidW1 += w;
+ d3_geo_centroidX1 += w * (x0 + (x0 = x));
+ d3_geo_centroidY1 += w * (y0 + (y0 = y));
+ d3_geo_centroidZ1 += w * (z0 + (z0 = z));
+ d3_geo_centroidPointXYZ(x0, y0, z0);
+ }
}
- function d3_geo_cartesianNormalize(d) {
- var l = Math.sqrt(d[0] * d[0] + d[1] * d[1] + d[2] * d[2]);
- d[0] /= l;
- d[1] /= l;
- d[2] /= l;
+ function d3_geo_compose(a, b) {
+ function compose(x, y) {
+ return x = a(x, y), b(x[0], x[1]);
+ }
+ if (a.invert && b.invert) compose.invert = function(x, y) {
+ return x = b.invert(x, y), x && a.invert(x[0], x[1]);
+ };
+ return compose;
}
function d3_true() {
return true;
}
- function d3_geo_spherical(cartesian) {
- return [ Math.atan2(cartesian[1], cartesian[0]), Math.asin(Math.max(-1, Math.min(1, cartesian[2]))) ];
- }
- function d3_geo_sphericalEqual(a, b) {
- return Math.abs(a[0] - b[0]) < ε && Math.abs(a[1] - b[1]) < ε;
- }
- function d3_geo_clipPolygon(segments, compare, inside, interpolate, listener) {
+ function d3_geo_clipPolygon(segments, compare, clipStartInside, interpolate, listener) {
var subject = [], clip = [];
segments.forEach(function(segment) {
if ((n = segment.length - 1) <= 0) return;
@@ -2263,41 +3237,13 @@ d3 = function() {
listener.lineEnd();
return;
}
- var a = {
- point: p0,
- points: segment,
- other: null,
- visited: false,
- entry: true,
- subject: true
- }, b = {
- point: p0,
- points: [ p0 ],
- other: a,
- visited: false,
- entry: false,
- subject: false
- };
- a.other = b;
+ var a = new d3_geo_clipPolygonIntersection(p0, segment, null, true), b = new d3_geo_clipPolygonIntersection(p0, null, a, false);
+ a.o = b;
subject.push(a);
clip.push(b);
- a = {
- point: p1,
- points: [ p1 ],
- other: null,
- visited: false,
- entry: false,
- subject: true
- };
- b = {
- point: p1,
- points: [ p1 ],
- other: a,
- visited: false,
- entry: true,
- subject: false
- };
- a.other = b;
+ a = new d3_geo_clipPolygonIntersection(p1, segment, null, false);
+ b = new d3_geo_clipPolygonIntersection(p1, null, a, true);
+ a.o = b;
subject.push(a);
clip.push(b);
});
@@ -2305,36 +3251,37 @@ d3 = function() {
d3_geo_clipPolygonLinkCircular(subject);
d3_geo_clipPolygonLinkCircular(clip);
if (!subject.length) return;
- if (inside) for (var i = 1, e = !inside(clip[0].point), n = clip.length; i < n; ++i) {
- clip[i].entry = e = !e;
+ for (var i = 0, entry = clipStartInside, n = clip.length; i < n; ++i) {
+ clip[i].e = entry = !entry;
}
- var start = subject[0], current, points, point;
+ var start = subject[0], points, point;
while (1) {
- current = start;
- while (current.visited) if ((current = current.next) === start) return;
- points = current.points;
+ var current = start, isSubject = true;
+ while (current.v) if ((current = current.n) === start) return;
+ points = current.z;
listener.lineStart();
do {
- current.visited = current.other.visited = true;
- if (current.entry) {
- if (current.subject) {
- for (var i = 0; i < points.length; i++) listener.point((point = points[i])[0], point[1]);
+ current.v = current.o.v = true;
+ if (current.e) {
+ if (isSubject) {
+ for (var i = 0, n = points.length; i < n; ++i) listener.point((point = points[i])[0], point[1]);
} else {
- interpolate(current.point, current.next.point, 1, listener);
+ interpolate(current.x, current.n.x, 1, listener);
}
- current = current.next;
+ current = current.n;
} else {
- if (current.subject) {
- points = current.prev.points;
- for (var i = points.length; --i >= 0; ) listener.point((point = points[i])[0], point[1]);
+ if (isSubject) {
+ points = current.p.z;
+ for (var i = points.length - 1; i >= 0; --i) listener.point((point = points[i])[0], point[1]);
} else {
- interpolate(current.point, current.prev.point, -1, listener);
+ interpolate(current.x, current.p.x, -1, listener);
}
- current = current.prev;
+ current = current.p;
}
- current = current.other;
- points = current.points;
- } while (!current.visited);
+ current = current.o;
+ points = current.z;
+ isSubject = !isSubject;
+ } while (!current.v);
listener.lineEnd();
}
}
@@ -2342,16 +3289,24 @@ d3 = function() {
if (!(n = array.length)) return;
var n, i = 0, a = array[0], b;
while (++i < n) {
- a.next = b = array[i];
- b.prev = a;
+ a.n = b = array[i];
+ b.p = a;
a = b;
}
- a.next = b = array[0];
- b.prev = a;
+ a.n = b = array[0];
+ b.p = a;
}
- function d3_geo_clip(pointVisible, clipLine, interpolate) {
- return function(listener) {
- var line = clipLine(listener);
+ function d3_geo_clipPolygonIntersection(point, points, other, entry) {
+ this.x = point;
+ this.z = points;
+ this.o = other;
+ this.e = entry;
+ this.v = false;
+ this.n = this.p = null;
+ }
+ function d3_geo_clip(pointVisible, clipLine, interpolate, clipStart) {
+ return function(rotate, listener) {
+ var line = clipLine(listener), rotatedClipStart = rotate.invert(clipStart[0], clipStart[1]);
var clip = {
point: point,
lineStart: lineStart,
@@ -2360,25 +3315,26 @@ d3 = function() {
clip.point = pointRing;
clip.lineStart = ringStart;
clip.lineEnd = ringEnd;
- invisible = false;
- invisibleArea = visibleArea = 0;
segments = [];
- listener.polygonStart();
+ polygon = [];
},
polygonEnd: function() {
clip.point = point;
clip.lineStart = lineStart;
clip.lineEnd = lineEnd;
segments = d3.merge(segments);
+ var clipStartInside = d3_geo_pointInPolygon(rotatedClipStart, polygon);
if (segments.length) {
- d3_geo_clipPolygon(segments, d3_geo_clipSort, null, interpolate, listener);
- } else if (visibleArea < -ε || invisible && invisibleArea < -ε) {
+ if (!polygonStarted) listener.polygonStart(), polygonStarted = true;
+ d3_geo_clipPolygon(segments, d3_geo_clipSort, clipStartInside, interpolate, listener);
+ } else if (clipStartInside) {
+ if (!polygonStarted) listener.polygonStart(), polygonStarted = true;
listener.lineStart();
interpolate(null, null, 1, listener);
listener.lineEnd();
}
- listener.polygonEnd();
- segments = null;
+ if (polygonStarted) listener.polygonEnd(), polygonStarted = false;
+ segments = polygon = null;
},
sphere: function() {
listener.polygonStart();
@@ -2389,10 +3345,12 @@ d3 = function() {
}
};
function point(λ, φ) {
- if (pointVisible(λ, φ)) listener.point(λ, φ);
+ var point = rotate(λ, φ);
+ if (pointVisible(λ = point[0], φ = point[1])) listener.point(λ, φ);
}
function pointLine(λ, φ) {
- line.point(λ, φ);
+ var point = rotate(λ, φ);
+ line.point(point[0], point[1]);
}
function lineStart() {
clip.point = pointLine;
@@ -2402,11 +3360,12 @@ d3 = function() {
clip.point = point;
line.lineEnd();
}
- var segments, visibleArea, invisibleArea, invisible;
- var buffer = d3_geo_clipBufferListener(), ringListener = clipLine(buffer), ring;
+ var segments;
+ var buffer = d3_geo_clipBufferListener(), ringListener = clipLine(buffer), polygonStarted = false, polygon, ring;
function pointRing(λ, φ) {
- ringListener.point(λ, φ);
ring.push([ λ, φ ]);
+ var point = rotate(λ, φ);
+ ringListener.point(point[0], point[1]);
}
function ringStart() {
ringListener.lineStart();
@@ -2416,20 +3375,19 @@ d3 = function() {
pointRing(ring[0][0], ring[0][1]);
ringListener.lineEnd();
var clean = ringListener.clean(), ringSegments = buffer.buffer(), segment, n = ringSegments.length;
- if (!n) {
- invisible = true;
- invisibleArea += d3_geo_clipAreaRing(ring, -1);
- ring = null;
- return;
- }
+ ring.pop();
+ polygon.push(ring);
ring = null;
+ if (!n) return;
if (clean & 1) {
segment = ringSegments[0];
- visibleArea += d3_geo_clipAreaRing(segment, 1);
var n = segment.length - 1, i = -1, point;
- listener.lineStart();
- while (++i < n) listener.point((point = segment[i])[0], point[1]);
- listener.lineEnd();
+ if (n > 0) {
+ if (!polygonStarted) listener.polygonStart(), polygonStarted = true;
+ listener.lineStart();
+ while (++i < n) listener.point((point = segment[i])[0], point[1]);
+ listener.lineEnd();
+ }
return;
}
if (n > 1 && clean & 2) ringSegments.push(ringSegments.pop().concat(ringSegments.shift()));
@@ -2462,26 +3420,10 @@ d3 = function() {
}
};
}
- function d3_geo_clipAreaRing(ring, invisible) {
- if (!(n = ring.length)) return 0;
- var n, i = 0, area = 0, p = ring[0], λ = p[0], φ = p[1], cosφ = Math.cos(φ), x0 = Math.atan2(invisible * Math.sin(λ) * cosφ, Math.sin(φ)), y0 = 1 - invisible * Math.cos(λ) * cosφ, x1 = x0, x, y;
- while (++i < n) {
- p = ring[i];
- cosφ = Math.cos(φ = p[1]);
- x = Math.atan2(invisible * Math.sin(λ = p[0]) * cosφ, Math.sin(φ));
- y = 1 - invisible * Math.cos(λ) * cosφ;
- if (Math.abs(y0 - 2) < ε && Math.abs(y - 2) < ε) continue;
- if (Math.abs(y) < ε || Math.abs(y0) < ε) {} else if (Math.abs(Math.abs(x - x0) - π) < ε) {
- if (y + y0 > 2) area += 4 * (x - x0);
- } else if (Math.abs(y0 - 2) < ε) area += 4 * (x - x1); else area += ((3 * π + x - x0) % (2 * π) - π) * (y0 + y);
- x1 = x0, x0 = x, y0 = y;
- }
- return area;
- }
function d3_geo_clipSort(a, b) {
- return ((a = a.point)[0] < 0 ? a[1] - π / 2 - ε : π / 2 - a[1]) - ((b = b.point)[0] < 0 ? b[1] - π / 2 - ε : π / 2 - b[1]);
+ return ((a = a.x)[0] < 0 ? a[1] - halfπ - ε : halfπ - a[1]) - ((b = b.x)[0] < 0 ? b[1] - halfπ - ε : halfπ - b[1]);
}
- var d3_geo_clipAntimeridian = d3_geo_clip(d3_true, d3_geo_clipAntimeridianLine, d3_geo_clipAntimeridianInterpolate);
+ var d3_geo_clipAntimeridian = d3_geo_clip(d3_true, d3_geo_clipAntimeridianLine, d3_geo_clipAntimeridianInterpolate, [ -π, -π / 2 ]);
function d3_geo_clipAntimeridianLine(listener) {
var λ0 = NaN, φ0 = NaN, sλ0 = NaN, clean;
return {
@@ -2490,9 +3432,9 @@ d3 = function() {
clean = 1;
},
point: function(λ1, φ1) {
- var sλ1 = λ1 > 0 ? π : -π, dλ = Math.abs(λ1 - λ0);
- if (Math.abs(dλ - π) < ε) {
- listener.point(λ0, φ0 = (φ0 + φ1) / 2 > 0 ? π / 2 : -π / 2);
+ var sλ1 = λ1 > 0 ? π : -π, dλ = abs(λ1 - λ0);
+ if (abs(dλ - π) < ε) {
+ listener.point(λ0, φ0 = (φ0 + φ1) / 2 > 0 ? halfπ : -halfπ);
listener.point(sλ0, φ0);
listener.lineEnd();
listener.lineStart();
@@ -2500,8 +3442,8 @@ d3 = function() {
listener.point(λ1, φ0);
clean = 0;
} else if (sλ0 !== sλ1 && dλ >= π) {
- if (Math.abs(λ0 - sλ0) < ε) λ0 -= sλ0 * ε;
- if (Math.abs(λ1 - sλ1) < ε) λ1 -= sλ1 * ε;
+ if (abs(λ0 - sλ0) < ε) λ0 -= sλ0 * ε;
+ if (abs(λ1 - sλ1) < ε) λ1 -= sλ1 * ε;
φ0 = d3_geo_clipAntimeridianIntersect(λ0, φ0, λ1, φ1);
listener.point(sλ0, φ0);
listener.lineEnd();
@@ -2523,12 +3465,12 @@ d3 = function() {
}
function d3_geo_clipAntimeridianIntersect(λ0, φ0, λ1, φ1) {
var cosφ0, cosφ1, sinλ0_λ1 = Math.sin(λ0 - λ1);
- return Math.abs(sinλ0_λ1) > ε ? Math.atan((Math.sin(φ0) * (cosφ1 = Math.cos(φ1)) * Math.sin(λ1) - Math.sin(φ1) * (cosφ0 = Math.cos(φ0)) * Math.sin(λ0)) / (cosφ0 * cosφ1 * sinλ0_λ1)) : (φ0 + φ1) / 2;
+ return abs(sinλ0_λ1) > ε ? Math.atan((Math.sin(φ0) * (cosφ1 = Math.cos(φ1)) * Math.sin(λ1) - Math.sin(φ1) * (cosφ0 = Math.cos(φ0)) * Math.sin(λ0)) / (cosφ0 * cosφ1 * sinλ0_λ1)) : (φ0 + φ1) / 2;
}
function d3_geo_clipAntimeridianInterpolate(from, to, direction, listener) {
var φ;
if (from == null) {
- φ = direction * π / 2;
+ φ = direction * halfπ;
listener.point(-π, φ);
listener.point(0, φ);
listener.point(π, φ);
@@ -2538,8 +3480,8 @@ d3 = function() {
listener.point(-π, -φ);
listener.point(-π, 0);
listener.point(-π, φ);
- } else if (Math.abs(from[0] - to[0]) > ε) {
- var s = (from[0] < to[0] ? 1 : -1) * π;
+ } else if (abs(from[0] - to[0]) > ε) {
+ var s = from[0] < to[0] ? π : -π;
φ = direction * s / 2;
listener.point(-s, φ);
listener.point(0, φ);
@@ -2548,9 +3490,38 @@ d3 = function() {
listener.point(to[0], to[1]);
}
}
+ function d3_geo_pointInPolygon(point, polygon) {
+ var meridian = point[0], parallel = point[1], meridianNormal = [ Math.sin(meridian), -Math.cos(meridian), 0 ], polarAngle = 0, winding = 0;
+ d3_geo_areaRingSum.reset();
+ for (var i = 0, n = polygon.length; i < n; ++i) {
+ var ring = polygon[i], m = ring.length;
+ if (!m) continue;
+ var point0 = ring[0], λ0 = point0[0], φ0 = point0[1] / 2 + π / 4, sinφ0 = Math.sin(φ0), cosφ0 = Math.cos(φ0), j = 1;
+ while (true) {
+ if (j === m) j = 0;
+ point = ring[j];
+ var λ = point[0], φ = point[1] / 2 + π / 4, sinφ = Math.sin(φ), cosφ = Math.cos(φ), dλ = λ - λ0, sdλ = dλ >= 0 ? 1 : -1, adλ = sdλ * dλ, antimeridian = adλ > π, k = sinφ0 * sinφ;
+ d3_geo_areaRingSum.add(Math.atan2(k * sdλ * Math.sin(adλ), cosφ0 * cosφ + k * Math.cos(adλ)));
+ polarAngle += antimeridian ? dλ + sdλ * τ : dλ;
+ if (antimeridian ^ λ0 >= meridian ^ λ >= meridian) {
+ var arc = d3_geo_cartesianCross(d3_geo_cartesian(point0), d3_geo_cartesian(point));
+ d3_geo_cartesianNormalize(arc);
+ var intersection = d3_geo_cartesianCross(meridianNormal, arc);
+ d3_geo_cartesianNormalize(intersection);
+ var φarc = (antimeridian ^ dλ >= 0 ? -1 : 1) * d3_asin(intersection[2]);
+ if (parallel > φarc || parallel === φarc && (arc[0] || arc[1])) {
+ winding += antimeridian ^ dλ >= 0 ? 1 : -1;
+ }
+ }
+ if (!j++) break;
+ λ0 = λ, sinφ0 = sinφ, cosφ0 = cosφ, point0 = point;
+ }
+ }
+ return (polarAngle < -ε || polarAngle < ε && d3_geo_areaRingSum < 0) ^ winding & 1;
+ }
function d3_geo_clipCircle(radius) {
- var cr = Math.cos(radius), smallRadius = cr > 0, notHemisphere = Math.abs(cr) > ε, interpolate = d3_geo_circleInterpolate(radius, 6 * d3_radians);
- return d3_geo_clip(visible, clipLine, interpolate);
+ var cr = Math.cos(radius), smallRadius = cr > 0, notHemisphere = abs(cr) > ε, interpolate = d3_geo_circleInterpolate(radius, 6 * d3_radians);
+ return d3_geo_clip(visible, clipLine, interpolate, smallRadius ? [ 0, -radius ] : [ -π, radius - π ]);
function visible(λ, φ) {
return Math.cos(λ) * Math.cos(φ) > cr;
}
@@ -2629,9 +3600,9 @@ d3 = function() {
if (!two) return q;
var λ0 = a[0], λ1 = b[0], φ0 = a[1], φ1 = b[1], z;
if (λ1 < λ0) z = λ0, λ0 = λ1, λ1 = z;
- var δλ = λ1 - λ0, polar = Math.abs(δλ - π) < ε, meridian = polar || δλ < ε;
+ var δλ = λ1 - λ0, polar = abs(δλ - π) < ε, meridian = polar || δλ < ε;
if (!polar && φ1 < φ0) z = φ0, φ0 = φ1, φ1 = z;
- if (meridian ? polar ? φ0 + φ1 > 0 ^ q[1] < (Math.abs(q[0] - λ0) < ε ? φ0 : φ1) : φ0 <= q[1] && q[1] <= φ1 : δλ > π ^ (λ0 <= q[0] && q[0] <= λ1)) {
+ if (meridian ? polar ? φ0 + φ1 > 0 ^ q[1] < (abs(q[0] - λ0) < ε ? φ0 : φ1) : φ0 <= q[1] && q[1] <= φ1 : δλ > π ^ (λ0 <= q[0] && q[0] <= λ1)) {
var q1 = d3_geo_cartesianScale(u, (-w + t) / uu);
d3_geo_cartesianAdd(q1, A);
return [ q, d3_geo_spherical(q1) ];
@@ -2644,10 +3615,81 @@ d3 = function() {
return code;
}
}
- var d3_geo_clipViewMAX = 1e9;
- function d3_geo_clipView(x0, y0, x1, y1) {
+ function d3_geom_clipLine(x0, y0, x1, y1) {
+ return function(line) {
+ var a = line.a, b = line.b, ax = a.x, ay = a.y, bx = b.x, by = b.y, t0 = 0, t1 = 1, dx = bx - ax, dy = by - ay, r;
+ r = x0 - ax;
+ if (!dx && r > 0) return;
+ r /= dx;
+ if (dx < 0) {
+ if (r < t0) return;
+ if (r < t1) t1 = r;
+ } else if (dx > 0) {
+ if (r > t1) return;
+ if (r > t0) t0 = r;
+ }
+ r = x1 - ax;
+ if (!dx && r < 0) return;
+ r /= dx;
+ if (dx < 0) {
+ if (r > t1) return;
+ if (r > t0) t0 = r;
+ } else if (dx > 0) {
+ if (r < t0) return;
+ if (r < t1) t1 = r;
+ }
+ r = y0 - ay;
+ if (!dy && r > 0) return;
+ r /= dy;
+ if (dy < 0) {
+ if (r < t0) return;
+ if (r < t1) t1 = r;
+ } else if (dy > 0) {
+ if (r > t1) return;
+ if (r > t0) t0 = r;
+ }
+ r = y1 - ay;
+ if (!dy && r < 0) return;
+ r /= dy;
+ if (dy < 0) {
+ if (r > t1) return;
+ if (r > t0) t0 = r;
+ } else if (dy > 0) {
+ if (r < t0) return;
+ if (r < t1) t1 = r;
+ }
+ if (t0 > 0) line.a = {
+ x: ax + t0 * dx,
+ y: ay + t0 * dy
+ };
+ if (t1 < 1) line.b = {
+ x: ax + t1 * dx,
+ y: ay + t1 * dy
+ };
+ return line;
+ };
+ }
+ var d3_geo_clipExtentMAX = 1e9;
+ d3.geo.clipExtent = function() {
+ var x0, y0, x1, y1, stream, clip, clipExtent = {
+ stream: function(output) {
+ if (stream) stream.valid = false;
+ stream = clip(output);
+ stream.valid = true;
+ return stream;
+ },
+ extent: function(_) {
+ if (!arguments.length) return [ [ x0, y0 ], [ x1, y1 ] ];
+ clip = d3_geo_clipExtent(x0 = +_[0][0], y0 = +_[0][1], x1 = +_[1][0], y1 = +_[1][1]);
+ if (stream) stream.valid = false, stream = null;
+ return clipExtent;
+ }
+ };
+ return clipExtent.extent([ [ 0, 0 ], [ 960, 500 ] ]);
+ };
+ function d3_geo_clipExtent(x0, y0, x1, y1) {
return function(listener) {
- var listener_ = listener, bufferListener = d3_geo_clipBufferListener(), segments, polygon, ring;
+ var listener_ = listener, bufferListener = d3_geo_clipBufferListener(), clipLine = d3_geom_clipLine(x0, y0, x1, y1), segments, polygon, ring;
var clip = {
point: point,
lineStart: lineStart,
@@ -2656,43 +3698,42 @@ d3 = function() {
listener = bufferListener;
segments = [];
polygon = [];
+ clean = true;
},
polygonEnd: function() {
listener = listener_;
- if ((segments = d3.merge(segments)).length) {
+ segments = d3.merge(segments);
+ var clipStartInside = insidePolygon([ x0, y1 ]), inside = clean && clipStartInside, visible = segments.length;
+ if (inside || visible) {
listener.polygonStart();
- d3_geo_clipPolygon(segments, compare, inside, interpolate, listener);
+ if (inside) {
+ listener.lineStart();
+ interpolate(null, null, 1, listener);
+ listener.lineEnd();
+ }
+ if (visible) {
+ d3_geo_clipPolygon(segments, compare, clipStartInside, interpolate, listener);
+ }
listener.polygonEnd();
- } else if (insidePolygon([ x0, y0 ])) {
- listener.polygonStart(), listener.lineStart();
- interpolate(null, null, 1, listener);
- listener.lineEnd(), listener.polygonEnd();
}
segments = polygon = ring = null;
}
};
- function inside(point) {
- var a = corner(point, -1), i = insidePolygon([ a === 0 || a === 3 ? x0 : x1, a > 1 ? y1 : y0 ]);
- return i;
- }
function insidePolygon(p) {
var wn = 0, n = polygon.length, y = p[1];
for (var i = 0; i < n; ++i) {
- for (var j = 1, v = polygon[i], m = v.length, a = v[0]; j < m; ++j) {
+ for (var j = 1, v = polygon[i], m = v.length, a = v[0], b; j < m; ++j) {
b = v[j];
if (a[1] <= y) {
- if (b[1] > y && isLeft(a, b, p) > 0) ++wn;
+ if (b[1] > y && d3_cross2d(a, b, p) > 0) ++wn;
} else {
- if (b[1] <= y && isLeft(a, b, p) < 0) --wn;
+ if (b[1] <= y && d3_cross2d(a, b, p) < 0) --wn;
}
a = b;
}
}
return wn !== 0;
}
- function isLeft(a, b, c) {
- return (b[0] - a[0]) * (c[1] - a[1]) - (c[0] - a[0]) * (b[1] - a[1]);
- }
function interpolate(from, to, direction, listener) {
var a = 0, a1 = 0;
if (from == null || (a = corner(from, direction)) !== (a1 = corner(to, direction)) || comparePoints(from, to) < 0 ^ direction > 0) {
@@ -2703,13 +3744,13 @@ d3 = function() {
listener.point(to[0], to[1]);
}
}
- function visible(x, y) {
+ function pointVisible(x, y) {
return x0 <= x && x <= x1 && y0 <= y && y <= y1;
}
function point(x, y) {
- if (visible(x, y)) listener.point(x, y);
+ if (pointVisible(x, y)) listener.point(x, y);
}
- var x__, y__, v__, x_, y_, v_, first;
+ var x__, y__, v__, x_, y_, v_, first, clean;
function lineStart() {
clip.point = linePoint;
if (polygon) polygon.push(ring = []);
@@ -2727,9 +3768,9 @@ d3 = function() {
if (v_) listener.lineEnd();
}
function linePoint(x, y) {
- x = Math.max(-d3_geo_clipViewMAX, Math.min(d3_geo_clipViewMAX, x));
- y = Math.max(-d3_geo_clipViewMAX, Math.min(d3_geo_clipViewMAX, y));
- var v = visible(x, y);
+ x = Math.max(-d3_geo_clipExtentMAX, Math.min(d3_geo_clipExtentMAX, x));
+ y = Math.max(-d3_geo_clipExtentMAX, Math.min(d3_geo_clipExtentMAX, y));
+ var v = pointVisible(x, y);
if (polygon) ring.push([ x, y ]);
if (first) {
x__ = x, y__ = y, v__ = v;
@@ -2740,17 +3781,28 @@ d3 = function() {
}
} else {
if (v && v_) listener.point(x, y); else {
- var a = [ x_, y_ ], b = [ x, y ];
- if (clipLine(a, b)) {
+ var l = {
+ a: {
+ x: x_,
+ y: y_
+ },
+ b: {
+ x: x,
+ y: y
+ }
+ };
+ if (clipLine(l)) {
if (!v_) {
listener.lineStart();
- listener.point(a[0], a[1]);
+ listener.point(l.a.x, l.a.y);
}
- listener.point(b[0], b[1]);
+ listener.point(l.b.x, l.b.y);
if (!v) listener.lineEnd();
- } else {
+ clean = false;
+ } else if (v) {
listener.lineStart();
listener.point(x, y);
+ clean = false;
}
}
}
@@ -2759,64 +3811,325 @@ d3 = function() {
return clip;
};
function corner(p, direction) {
- return Math.abs(p[0] - x0) < ε ? direction > 0 ? 0 : 3 : Math.abs(p[0] - x1) < ε ? direction > 0 ? 2 : 1 : Math.abs(p[1] - y0) < ε ? direction > 0 ? 1 : 0 : direction > 0 ? 3 : 2;
+ return abs(p[0] - x0) < ε ? direction > 0 ? 0 : 3 : abs(p[0] - x1) < ε ? direction > 0 ? 2 : 1 : abs(p[1] - y0) < ε ? direction > 0 ? 1 : 0 : direction > 0 ? 3 : 2;
}
function compare(a, b) {
- return comparePoints(a.point, b.point);
+ return comparePoints(a.x, b.x);
}
function comparePoints(a, b) {
var ca = corner(a, 1), cb = corner(b, 1);
return ca !== cb ? ca - cb : ca === 0 ? b[1] - a[1] : ca === 1 ? a[0] - b[0] : ca === 2 ? a[1] - b[1] : b[0] - a[0];
}
- function clipLine(a, b) {
- var dx = b[0] - a[0], dy = b[1] - a[1], t = [ 0, 1 ];
- if (Math.abs(dx) < ε && Math.abs(dy) < ε) return x0 <= a[0] && a[0] <= x1 && y0 <= a[1] && a[1] <= y1;
- if (d3_geo_clipViewT(x0 - a[0], dx, t) && d3_geo_clipViewT(a[0] - x1, -dx, t) && d3_geo_clipViewT(y0 - a[1], dy, t) && d3_geo_clipViewT(a[1] - y1, -dy, t)) {
- if (t[1] < 1) {
- b[0] = a[0] + t[1] * dx;
- b[1] = a[1] + t[1] * dy;
+ }
+ function d3_geo_conic(projectAt) {
+ var φ0 = 0, φ1 = π / 3, m = d3_geo_projectionMutator(projectAt), p = m(φ0, φ1);
+ p.parallels = function(_) {
+ if (!arguments.length) return [ φ0 / π * 180, φ1 / π * 180 ];
+ return m(φ0 = _[0] * π / 180, φ1 = _[1] * π / 180);
+ };
+ return p;
+ }
+ function d3_geo_conicEqualArea(φ0, φ1) {
+ var sinφ0 = Math.sin(φ0), n = (sinφ0 + Math.sin(φ1)) / 2, C = 1 + sinφ0 * (2 * n - sinφ0), ρ0 = Math.sqrt(C) / n;
+ function forward(λ, φ) {
+ var ρ = Math.sqrt(C - 2 * n * Math.sin(φ)) / n;
+ return [ ρ * Math.sin(λ *= n), ρ0 - ρ * Math.cos(λ) ];
+ }
+ forward.invert = function(x, y) {
+ var ρ0_y = ρ0 - y;
+ return [ Math.atan2(x, ρ0_y) / n, d3_asin((C - (x * x + ρ0_y * ρ0_y) * n * n) / (2 * n)) ];
+ };
+ return forward;
+ }
+ (d3.geo.conicEqualArea = function() {
+ return d3_geo_conic(d3_geo_conicEqualArea);
+ }).raw = d3_geo_conicEqualArea;
+ d3.geo.albers = function() {
+ return d3.geo.conicEqualArea().rotate([ 96, 0 ]).center([ -.6, 38.7 ]).parallels([ 29.5, 45.5 ]).scale(1070);
+ };
+ d3.geo.albersUsa = function() {
+ var lower48 = d3.geo.albers();
+ var alaska = d3.geo.conicEqualArea().rotate([ 154, 0 ]).center([ -2, 58.5 ]).parallels([ 55, 65 ]);
+ var hawaii = d3.geo.conicEqualArea().rotate([ 157, 0 ]).center([ -3, 19.9 ]).parallels([ 8, 18 ]);
+ var point, pointStream = {
+ point: function(x, y) {
+ point = [ x, y ];
+ }
+ }, lower48Point, alaskaPoint, hawaiiPoint;
+ function albersUsa(coordinates) {
+ var x = coordinates[0], y = coordinates[1];
+ point = null;
+ (lower48Point(x, y), point) || (alaskaPoint(x, y), point) || hawaiiPoint(x, y);
+ return point;
+ }
+ albersUsa.invert = function(coordinates) {
+ var k = lower48.scale(), t = lower48.translate(), x = (coordinates[0] - t[0]) / k, y = (coordinates[1] - t[1]) / k;
+ return (y >= .12 && y < .234 && x >= -.425 && x < -.214 ? alaska : y >= .166 && y < .234 && x >= -.214 && x < -.115 ? hawaii : lower48).invert(coordinates);
+ };
+ albersUsa.stream = function(stream) {
+ var lower48Stream = lower48.stream(stream), alaskaStream = alaska.stream(stream), hawaiiStream = hawaii.stream(stream);
+ return {
+ point: function(x, y) {
+ lower48Stream.point(x, y);
+ alaskaStream.point(x, y);
+ hawaiiStream.point(x, y);
+ },
+ sphere: function() {
+ lower48Stream.sphere();
+ alaskaStream.sphere();
+ hawaiiStream.sphere();
+ },
+ lineStart: function() {
+ lower48Stream.lineStart();
+ alaskaStream.lineStart();
+ hawaiiStream.lineStart();
+ },
+ lineEnd: function() {
+ lower48Stream.lineEnd();
+ alaskaStream.lineEnd();
+ hawaiiStream.lineEnd();
+ },
+ polygonStart: function() {
+ lower48Stream.polygonStart();
+ alaskaStream.polygonStart();
+ hawaiiStream.polygonStart();
+ },
+ polygonEnd: function() {
+ lower48Stream.polygonEnd();
+ alaskaStream.polygonEnd();
+ hawaiiStream.polygonEnd();
}
- if (t[0] > 0) {
- a[0] += t[0] * dx;
- a[1] += t[0] * dy;
+ };
+ };
+ albersUsa.precision = function(_) {
+ if (!arguments.length) return lower48.precision();
+ lower48.precision(_);
+ alaska.precision(_);
+ hawaii.precision(_);
+ return albersUsa;
+ };
+ albersUsa.scale = function(_) {
+ if (!arguments.length) return lower48.scale();
+ lower48.scale(_);
+ alaska.scale(_ * .35);
+ hawaii.scale(_);
+ return albersUsa.translate(lower48.translate());
+ };
+ albersUsa.translate = function(_) {
+ if (!arguments.length) return lower48.translate();
+ var k = lower48.scale(), x = +_[0], y = +_[1];
+ lower48Point = lower48.translate(_).clipExtent([ [ x - .455 * k, y - .238 * k ], [ x + .455 * k, y + .238 * k ] ]).stream(pointStream).point;
+ alaskaPoint = alaska.translate([ x - .307 * k, y + .201 * k ]).clipExtent([ [ x - .425 * k + ε, y + .12 * k + ε ], [ x - .214 * k - ε, y + .234 * k - ε ] ]).stream(pointStream).point;
+ hawaiiPoint = hawaii.translate([ x - .205 * k, y + .212 * k ]).clipExtent([ [ x - .214 * k + ε, y + .166 * k + ε ], [ x - .115 * k - ε, y + .234 * k - ε ] ]).stream(pointStream).point;
+ return albersUsa;
+ };
+ return albersUsa.scale(1070);
+ };
+ var d3_geo_pathAreaSum, d3_geo_pathAreaPolygon, d3_geo_pathArea = {
+ point: d3_noop,
+ lineStart: d3_noop,
+ lineEnd: d3_noop,
+ polygonStart: function() {
+ d3_geo_pathAreaPolygon = 0;
+ d3_geo_pathArea.lineStart = d3_geo_pathAreaRingStart;
+ },
+ polygonEnd: function() {
+ d3_geo_pathArea.lineStart = d3_geo_pathArea.lineEnd = d3_geo_pathArea.point = d3_noop;
+ d3_geo_pathAreaSum += abs(d3_geo_pathAreaPolygon / 2);
+ }
+ };
+ function d3_geo_pathAreaRingStart() {
+ var x00, y00, x0, y0;
+ d3_geo_pathArea.point = function(x, y) {
+ d3_geo_pathArea.point = nextPoint;
+ x00 = x0 = x, y00 = y0 = y;
+ };
+ function nextPoint(x, y) {
+ d3_geo_pathAreaPolygon += y0 * x - x0 * y;
+ x0 = x, y0 = y;
+ }
+ d3_geo_pathArea.lineEnd = function() {
+ nextPoint(x00, y00);
+ };
+ }
+ var d3_geo_pathBoundsX0, d3_geo_pathBoundsY0, d3_geo_pathBoundsX1, d3_geo_pathBoundsY1;
+ var d3_geo_pathBounds = {
+ point: d3_geo_pathBoundsPoint,
+ lineStart: d3_noop,
+ lineEnd: d3_noop,
+ polygonStart: d3_noop,
+ polygonEnd: d3_noop
+ };
+ function d3_geo_pathBoundsPoint(x, y) {
+ if (x < d3_geo_pathBoundsX0) d3_geo_pathBoundsX0 = x;
+ if (x > d3_geo_pathBoundsX1) d3_geo_pathBoundsX1 = x;
+ if (y < d3_geo_pathBoundsY0) d3_geo_pathBoundsY0 = y;
+ if (y > d3_geo_pathBoundsY1) d3_geo_pathBoundsY1 = y;
+ }
+ function d3_geo_pathBuffer() {
+ var pointCircle = d3_geo_pathBufferCircle(4.5), buffer = [];
+ var stream = {
+ point: point,
+ lineStart: function() {
+ stream.point = pointLineStart;
+ },
+ lineEnd: lineEnd,
+ polygonStart: function() {
+ stream.lineEnd = lineEndPolygon;
+ },
+ polygonEnd: function() {
+ stream.lineEnd = lineEnd;
+ stream.point = point;
+ },
+ pointRadius: function(_) {
+ pointCircle = d3_geo_pathBufferCircle(_);
+ return stream;
+ },
+ result: function() {
+ if (buffer.length) {
+ var result = buffer.join("");
+ buffer = [];
+ return result;
}
- return true;
}
- return false;
+ };
+ function point(x, y) {
+ buffer.push("M", x, ",", y, pointCircle);
+ }
+ function pointLineStart(x, y) {
+ buffer.push("M", x, ",", y);
+ stream.point = pointLine;
+ }
+ function pointLine(x, y) {
+ buffer.push("L", x, ",", y);
+ }
+ function lineEnd() {
+ stream.point = point;
+ }
+ function lineEndPolygon() {
+ buffer.push("Z");
}
+ return stream;
}
- function d3_geo_clipViewT(num, denominator, t) {
- if (Math.abs(denominator) < ε) return num <= 0;
- var u = num / denominator;
- if (denominator > 0) {
- if (u > t[1]) return false;
- if (u > t[0]) t[0] = u;
- } else {
- if (u < t[0]) return false;
- if (u < t[1]) t[1] = u;
+ function d3_geo_pathBufferCircle(radius) {
+ return "m0," + radius + "a" + radius + "," + radius + " 0 1,1 0," + -2 * radius + "a" + radius + "," + radius + " 0 1,1 0," + 2 * radius + "z";
+ }
+ var d3_geo_pathCentroid = {
+ point: d3_geo_pathCentroidPoint,
+ lineStart: d3_geo_pathCentroidLineStart,
+ lineEnd: d3_geo_pathCentroidLineEnd,
+ polygonStart: function() {
+ d3_geo_pathCentroid.lineStart = d3_geo_pathCentroidRingStart;
+ },
+ polygonEnd: function() {
+ d3_geo_pathCentroid.point = d3_geo_pathCentroidPoint;
+ d3_geo_pathCentroid.lineStart = d3_geo_pathCentroidLineStart;
+ d3_geo_pathCentroid.lineEnd = d3_geo_pathCentroidLineEnd;
}
- return true;
+ };
+ function d3_geo_pathCentroidPoint(x, y) {
+ d3_geo_centroidX0 += x;
+ d3_geo_centroidY0 += y;
+ ++d3_geo_centroidZ0;
}
- function d3_geo_compose(a, b) {
- function compose(x, y) {
- return x = a(x, y), b(x[0], x[1]);
+ function d3_geo_pathCentroidLineStart() {
+ var x0, y0;
+ d3_geo_pathCentroid.point = function(x, y) {
+ d3_geo_pathCentroid.point = nextPoint;
+ d3_geo_pathCentroidPoint(x0 = x, y0 = y);
+ };
+ function nextPoint(x, y) {
+ var dx = x - x0, dy = y - y0, z = Math.sqrt(dx * dx + dy * dy);
+ d3_geo_centroidX1 += z * (x0 + x) / 2;
+ d3_geo_centroidY1 += z * (y0 + y) / 2;
+ d3_geo_centroidZ1 += z;
+ d3_geo_pathCentroidPoint(x0 = x, y0 = y);
}
- if (a.invert && b.invert) compose.invert = function(x, y) {
- return x = b.invert(x, y), x && a.invert(x[0], x[1]);
+ }
+ function d3_geo_pathCentroidLineEnd() {
+ d3_geo_pathCentroid.point = d3_geo_pathCentroidPoint;
+ }
+ function d3_geo_pathCentroidRingStart() {
+ var x00, y00, x0, y0;
+ d3_geo_pathCentroid.point = function(x, y) {
+ d3_geo_pathCentroid.point = nextPoint;
+ d3_geo_pathCentroidPoint(x00 = x0 = x, y00 = y0 = y);
+ };
+ function nextPoint(x, y) {
+ var dx = x - x0, dy = y - y0, z = Math.sqrt(dx * dx + dy * dy);
+ d3_geo_centroidX1 += z * (x0 + x) / 2;
+ d3_geo_centroidY1 += z * (y0 + y) / 2;
+ d3_geo_centroidZ1 += z;
+ z = y0 * x - x0 * y;
+ d3_geo_centroidX2 += z * (x0 + x);
+ d3_geo_centroidY2 += z * (y0 + y);
+ d3_geo_centroidZ2 += z * 3;
+ d3_geo_pathCentroidPoint(x0 = x, y0 = y);
+ }
+ d3_geo_pathCentroid.lineEnd = function() {
+ nextPoint(x00, y00);
};
- return compose;
+ }
+ function d3_geo_pathContext(context) {
+ var pointRadius = 4.5;
+ var stream = {
+ point: point,
+ lineStart: function() {
+ stream.point = pointLineStart;
+ },
+ lineEnd: lineEnd,
+ polygonStart: function() {
+ stream.lineEnd = lineEndPolygon;
+ },
+ polygonEnd: function() {
+ stream.lineEnd = lineEnd;
+ stream.point = point;
+ },
+ pointRadius: function(_) {
+ pointRadius = _;
+ return stream;
+ },
+ result: d3_noop
+ };
+ function point(x, y) {
+ context.moveTo(x + pointRadius, y);
+ context.arc(x, y, pointRadius, 0, τ);
+ }
+ function pointLineStart(x, y) {
+ context.moveTo(x, y);
+ stream.point = pointLine;
+ }
+ function pointLine(x, y) {
+ context.lineTo(x, y);
+ }
+ function lineEnd() {
+ stream.point = point;
+ }
+ function lineEndPolygon() {
+ context.closePath();
+ }
+ return stream;
}
function d3_geo_resample(project) {
- var δ2 = .5, maxDepth = 16;
+ var δ2 = .5, cosMinDistance = Math.cos(30 * d3_radians), maxDepth = 16;
function resample(stream) {
- var λ0, x0, y0, a0, b0, c0;
+ return (maxDepth ? resampleRecursive : resampleNone)(stream);
+ }
+ function resampleNone(stream) {
+ return d3_geo_transformPoint(stream, function(x, y) {
+ x = project(x, y);
+ stream.point(x[0], x[1]);
+ });
+ }
+ function resampleRecursive(stream) {
+ var λ00, φ00, x00, y00, a00, b00, c00, λ0, x0, y0, a0, b0, c0;
var resample = {
point: point,
lineStart: lineStart,
lineEnd: lineEnd,
polygonStart: function() {
stream.polygonStart();
- resample.lineStart = polygonLineStart;
+ resample.lineStart = ringStart;
},
polygonEnd: function() {
stream.polygonEnd();
@@ -2841,26 +4154,27 @@ d3 = function() {
resample.point = point;
stream.lineEnd();
}
- function polygonLineStart() {
- var λ00, φ00, x00, y00, a00, b00, c00;
+ function ringStart() {
lineStart();
- resample.point = function(λ, φ) {
- linePoint(λ00 = λ, φ00 = φ), x00 = x0, y00 = y0, a00 = a0, b00 = b0, c00 = c0;
- resample.point = linePoint;
- };
- resample.lineEnd = function() {
- resampleLineTo(x0, y0, λ0, a0, b0, c0, x00, y00, λ00, a00, b00, c00, maxDepth, stream);
- resample.lineEnd = lineEnd;
- lineEnd();
- };
+ resample.point = ringPoint;
+ resample.lineEnd = ringEnd;
+ }
+ function ringPoint(λ, φ) {
+ linePoint(λ00 = λ, φ00 = φ), x00 = x0, y00 = y0, a00 = a0, b00 = b0, c00 = c0;
+ resample.point = linePoint;
+ }
+ function ringEnd() {
+ resampleLineTo(x0, y0, λ0, a0, b0, c0, x00, y00, λ00, a00, b00, c00, maxDepth, stream);
+ resample.lineEnd = lineEnd;
+ lineEnd();
}
return resample;
}
function resampleLineTo(x0, y0, λ0, a0, b0, c0, x1, y1, λ1, a1, b1, c1, depth, stream) {
var dx = x1 - x0, dy = y1 - y0, d2 = dx * dx + dy * dy;
if (d2 > 4 * δ2 && depth--) {
- var a = a0 + a1, b = b0 + b1, c = c0 + c1, m = Math.sqrt(a * a + b * b + c * c), φ2 = Math.asin(c /= m), λ2 = Math.abs(Math.abs(c) - 1) < ε ? (λ0 + λ1) / 2 : Math.atan2(b, a), p = project(λ2, φ2), x2 = p[0], y2 = p[1], dx2 = x2 - x0, dy2 = y2 - y0, dz = dy * dx2 - dx * dy2;
- if (dz * dz / d2 > δ2 || Math.abs((dx * dx2 + dy * dy2) / d2 - .5) > .3) {
+ var a = a0 + a1, b = b0 + b1, c = c0 + c1, m = Math.sqrt(a * a + b * b + c * c), φ2 = Math.asin(c /= m), λ2 = abs(abs(c) - 1) < ε || abs(λ0 - λ1) < ε ? (λ0 + λ1) / 2 : Math.atan2(b, a), p = project(λ2, φ2), x2 = p[0], y2 = p[1], dx2 = x2 - x0, dy2 = y2 - y0, dz = dy * dx2 - dx * dy2;
+ if (dz * dz / d2 > δ2 || abs((dx * dx2 + dy * dy2) / d2 - .5) > .3 || a0 * a1 + b0 * b1 + c0 * c1 < cosMinDistance) {
resampleLineTo(x0, y0, λ0, a0, b0, c0, x2, y2, λ2, a /= m, b /= m, c, depth, stream);
stream.point(x2, y2);
resampleLineTo(x2, y2, λ2, a, b, c, x1, y1, λ1, a1, b1, c1, depth, stream);
@@ -2874,6 +4188,113 @@ d3 = function() {
};
return resample;
}
+ d3.geo.path = function() {
+ var pointRadius = 4.5, projection, context, projectStream, contextStream, cacheStream;
+ function path(object) {
+ if (object) {
+ if (typeof pointRadius === "function") contextStream.pointRadius(+pointRadius.apply(this, arguments));
+ if (!cacheStream || !cacheStream.valid) cacheStream = projectStream(contextStream);
+ d3.geo.stream(object, cacheStream);
+ }
+ return contextStream.result();
+ }
+ path.area = function(object) {
+ d3_geo_pathAreaSum = 0;
+ d3.geo.stream(object, projectStream(d3_geo_pathArea));
+ return d3_geo_pathAreaSum;
+ };
+ path.centroid = function(object) {
+ d3_geo_centroidX0 = d3_geo_centroidY0 = d3_geo_centroidZ0 = d3_geo_centroidX1 = d3_geo_centroidY1 = d3_geo_centroidZ1 = d3_geo_centroidX2 = d3_geo_centroidY2 = d3_geo_centroidZ2 = 0;
+ d3.geo.stream(object, projectStream(d3_geo_pathCentroid));
+ return d3_geo_centroidZ2 ? [ d3_geo_centroidX2 / d3_geo_centroidZ2, d3_geo_centroidY2 / d3_geo_centroidZ2 ] : d3_geo_centroidZ1 ? [ d3_geo_centroidX1 / d3_geo_centroidZ1, d3_geo_centroidY1 / d3_geo_centroidZ1 ] : d3_geo_centroidZ0 ? [ d3_geo_centroidX0 / d3_geo_centroidZ0, d3_geo_centroidY0 / d3_geo_centroidZ0 ] : [ NaN, NaN ];
+ };
+ path.bounds = function(object) {
+ d3_geo_pathBoundsX1 = d3_geo_pathBoundsY1 = -(d3_geo_pathBoundsX0 = d3_geo_pathBoundsY0 = Infinity);
+ d3.geo.stream(object, projectStream(d3_geo_pathBounds));
+ return [ [ d3_geo_pathBoundsX0, d3_geo_pathBoundsY0 ], [ d3_geo_pathBoundsX1, d3_geo_pathBoundsY1 ] ];
+ };
+ path.projection = function(_) {
+ if (!arguments.length) return projection;
+ projectStream = (projection = _) ? _.stream || d3_geo_pathProjectStream(_) : d3_identity;
+ return reset();
+ };
+ path.context = function(_) {
+ if (!arguments.length) return context;
+ contextStream = (context = _) == null ? new d3_geo_pathBuffer() : new d3_geo_pathContext(_);
+ if (typeof pointRadius !== "function") contextStream.pointRadius(pointRadius);
+ return reset();
+ };
+ path.pointRadius = function(_) {
+ if (!arguments.length) return pointRadius;
+ pointRadius = typeof _ === "function" ? _ : (contextStream.pointRadius(+_), +_);
+ return path;
+ };
+ function reset() {
+ cacheStream = null;
+ return path;
+ }
+ return path.projection(d3.geo.albersUsa()).context(null);
+ };
+ function d3_geo_pathProjectStream(project) {
+ var resample = d3_geo_resample(function(x, y) {
+ return project([ x * d3_degrees, y * d3_degrees ]);
+ });
+ return function(stream) {
+ return d3_geo_projectionRadians(resample(stream));
+ };
+ }
+ d3.geo.transform = function(methods) {
+ return {
+ stream: function(stream) {
+ var transform = new d3_geo_transform(stream);
+ for (var k in methods) transform[k] = methods[k];
+ return transform;
+ }
+ };
+ };
+ function d3_geo_transform(stream) {
+ this.stream = stream;
+ }
+ d3_geo_transform.prototype = {
+ point: function(x, y) {
+ this.stream.point(x, y);
+ },
+ sphere: function() {
+ this.stream.sphere();
+ },
+ lineStart: function() {
+ this.stream.lineStart();
+ },
+ lineEnd: function() {
+ this.stream.lineEnd();
+ },
+ polygonStart: function() {
+ this.stream.polygonStart();
+ },
+ polygonEnd: function() {
+ this.stream.polygonEnd();
+ }
+ };
+ function d3_geo_transformPoint(stream, point) {
+ return {
+ point: point,
+ sphere: function() {
+ stream.sphere();
+ },
+ lineStart: function() {
+ stream.lineStart();
+ },
+ lineEnd: function() {
+ stream.lineEnd();
+ },
+ polygonStart: function() {
+ stream.polygonStart();
+ },
+ polygonEnd: function() {
+ stream.polygonEnd();
+ }
+ };
+ }
d3.geo.projection = d3_geo_projection;
d3.geo.projectionMutator = d3_geo_projectionMutator;
function d3_geo_projection(project) {
@@ -2885,7 +4306,7 @@ d3 = function() {
var project, rotate, projectRotate, projectResample = d3_geo_resample(function(x, y) {
x = project(x, y);
return [ x[0] * k + δx, δy - x[1] * k ];
- }), k = 150, x = 480, y = 250, λ = 0, φ = 0, δλ = 0, δφ = 0, δγ = 0, δx, δy, preclip = d3_geo_clipAntimeridian, postclip = d3_identity, clipAngle = null, clipExtent = null;
+ }), k = 150, x = 480, y = 250, λ = 0, φ = 0, δλ = 0, δφ = 0, δγ = 0, δx, δy, preclip = d3_geo_clipAntimeridian, postclip = d3_identity, clipAngle = null, clipExtent = null, stream;
function projection(point) {
point = projectRotate(point[0] * d3_radians, point[1] * d3_radians);
return [ point[0] * k + δx, δy - point[1] * k ];
@@ -2894,19 +4315,22 @@ d3 = function() {
point = projectRotate.invert((point[0] - δx) / k, (δy - point[1]) / k);
return point && [ point[0] * d3_degrees, point[1] * d3_degrees ];
}
- projection.stream = function(stream) {
- return d3_geo_projectionRadiansRotate(rotate, preclip(projectResample(postclip(stream))));
+ projection.stream = function(output) {
+ if (stream) stream.valid = false;
+ stream = d3_geo_projectionRadians(preclip(rotate, projectResample(postclip(output))));
+ stream.valid = true;
+ return stream;
};
projection.clipAngle = function(_) {
if (!arguments.length) return clipAngle;
preclip = _ == null ? (clipAngle = _, d3_geo_clipAntimeridian) : d3_geo_clipCircle((clipAngle = +_) * d3_radians);
- return projection;
+ return invalidate();
};
projection.clipExtent = function(_) {
if (!arguments.length) return clipExtent;
clipExtent = _;
- postclip = _ == null ? d3_identity : d3_geo_clipView(_[0][0], _[0][1], _[1][0], _[1][1]);
- return projection;
+ postclip = _ ? d3_geo_clipExtent(_[0][0], _[0][1], _[1][0], _[1][1]) : d3_identity;
+ return invalidate();
};
projection.scale = function(_) {
if (!arguments.length) return k;
@@ -2938,6 +4362,10 @@ d3 = function() {
var center = project(λ, φ);
δx = x - center[0] * k;
δy = y + center[1] * k;
+ return invalidate();
+ }
+ function invalidate() {
+ if (stream) stream.valid = false, stream = null;
return projection;
}
return function() {
@@ -2946,28 +4374,10 @@ d3 = function() {
return reset();
};
}
- function d3_geo_projectionRadiansRotate(rotate, stream) {
- return {
- point: function(x, y) {
- y = rotate(x * d3_radians, y * d3_radians), x = y[0];
- stream.point(x > π ? x - 2 * π : x < -π ? x + 2 * π : x, y[1]);
- },
- sphere: function() {
- stream.sphere();
- },
- lineStart: function() {
- stream.lineStart();
- },
- lineEnd: function() {
- stream.lineEnd();
- },
- polygonStart: function() {
- stream.polygonStart();
- },
- polygonEnd: function() {
- stream.polygonEnd();
- }
- };
+ function d3_geo_projectionRadians(stream) {
+ return d3_geo_transformPoint(stream, function(x, y) {
+ stream.point(x * d3_radians, y * d3_radians);
+ });
}
function d3_geo_equirectangular(λ, φ) {
return [ λ, φ ];
@@ -2987,12 +4397,16 @@ d3 = function() {
};
return forward;
};
+ function d3_geo_identityRotation(λ, φ) {
+ return [ λ > π ? λ - τ : λ < -π ? λ + τ : λ, φ ];
+ }
+ d3_geo_identityRotation.invert = d3_geo_equirectangular;
function d3_geo_rotation(δλ, δφ, δγ) {
- return δλ ? δφ || δγ ? d3_geo_compose(d3_geo_rotationλ(δλ), d3_geo_rotationφγ(δφ, δγ)) : d3_geo_rotationλ(δλ) : δφ || δγ ? d3_geo_rotationφγ(δφ, δγ) : d3_geo_equirectangular;
+ return δλ ? δφ || δγ ? d3_geo_compose(d3_geo_rotationλ(δλ), d3_geo_rotationφγ(δφ, δγ)) : d3_geo_rotationλ(δλ) : δφ || δγ ? d3_geo_rotationφγ(δφ, δγ) : d3_geo_identityRotation;
}
function d3_geo_forwardRotationλ(δλ) {
return function(λ, φ) {
- return λ += δλ, [ λ > π ? λ - 2 * π : λ < -π ? λ + 2 * π : λ, φ ];
+ return λ += δλ, [ λ > π ? λ - τ : λ < -π ? λ + τ : λ, φ ];
};
}
function d3_geo_rotationλ(δλ) {
@@ -3004,11 +4418,11 @@ d3 = function() {
var cosδφ = Math.cos(δφ), sinδφ = Math.sin(δφ), cosδγ = Math.cos(δγ), sinδγ = Math.sin(δγ);
function rotation(λ, φ) {
var cosφ = Math.cos(φ), x = Math.cos(λ) * cosφ, y = Math.sin(λ) * cosφ, z = Math.sin(φ), k = z * cosδφ + x * sinδφ;
- return [ Math.atan2(y * cosδγ - k * sinδγ, x * cosδφ - z * sinδφ), Math.asin(Math.max(-1, Math.min(1, k * cosδγ + y * sinδγ))) ];
+ return [ Math.atan2(y * cosδγ - k * sinδγ, x * cosδφ - z * sinδφ), d3_asin(k * cosδγ + y * sinδγ) ];
}
rotation.invert = function(λ, φ) {
var cosφ = Math.cos(φ), x = Math.cos(λ) * cosφ, y = Math.sin(λ) * cosφ, z = Math.sin(φ), k = z * cosδγ - y * sinδγ;
- return [ Math.atan2(y * cosδγ + z * sinδγ, x * cosδφ + k * sinδφ), Math.asin(Math.max(-1, Math.min(1, k * cosδφ - x * sinδφ))) ];
+ return [ Math.atan2(y * cosδγ + z * sinδγ, x * cosδφ + k * sinδφ), d3_asin(k * cosδφ - x * sinδφ) ];
};
return rotation;
}
@@ -3047,16 +4461,16 @@ d3 = function() {
function d3_geo_circleInterpolate(radius, precision) {
var cr = Math.cos(radius), sr = Math.sin(radius);
return function(from, to, direction, listener) {
+ var step = direction * precision;
if (from != null) {
from = d3_geo_circleAngle(cr, from);
to = d3_geo_circleAngle(cr, to);
- if (direction > 0 ? from < to : from > to) from += direction * 2 * π;
+ if (direction > 0 ? from < to : from > to) from += direction * τ;
} else {
- from = radius + direction * 2 * π;
- to = radius;
+ from = radius + direction * τ;
+ to = radius - .5 * step;
}
- var point;
- for (var step = direction * precision, t = from; direction > 0 ? t > to : t < to; t -= step) {
+ for (var point, t = from; direction > 0 ? t > to : t < to; t -= step) {
listener.point((point = d3_geo_spherical([ cr, -sr * Math.cos(t), -sr * Math.sin(t) ]))[0], point[1]);
}
};
@@ -3082,9 +4496,9 @@ d3 = function() {
}
function lines() {
return d3.range(Math.ceil(X0 / DX) * DX, X1, DX).map(X).concat(d3.range(Math.ceil(Y0 / DY) * DY, Y1, DY).map(Y)).concat(d3.range(Math.ceil(x0 / dx) * dx, x1, dx).filter(function(x) {
- return Math.abs(x % DX) > ε;
+ return abs(x % DX) > ε;
}).map(x)).concat(d3.range(Math.ceil(y0 / dy) * dy, y1, dy).filter(function(y) {
- return Math.abs(y % DY) > ε;
+ return abs(y % DY) > ε;
}).map(y));
}
graticule.lines = function() {
@@ -3232,329 +4646,11 @@ d3 = function() {
d3_geo_length.point = d3_geo_length.lineEnd = d3_noop;
};
function nextPoint(λ, φ) {
- var sinφ = Math.sin(φ *= d3_radians), cosφ = Math.cos(φ), t = Math.abs((λ *= d3_radians) - λ0), cosΔλ = Math.cos(t);
+ var sinφ = Math.sin(φ *= d3_radians), cosφ = Math.cos(φ), t = abs((λ *= d3_radians) - λ0), cosΔλ = Math.cos(t);
d3_geo_lengthSum += Math.atan2(Math.sqrt((t = cosφ * Math.sin(t)) * t + (t = cosφ0 * sinφ - sinφ0 * cosφ * cosΔλ) * t), sinφ0 * sinφ + cosφ0 * cosφ * cosΔλ);
λ0 = λ, sinφ0 = sinφ, cosφ0 = cosφ;
}
}
- function d3_geo_conic(projectAt) {
- var φ0 = 0, φ1 = π / 3, m = d3_geo_projectionMutator(projectAt), p = m(φ0, φ1);
- p.parallels = function(_) {
- if (!arguments.length) return [ φ0 / π * 180, φ1 / π * 180 ];
- return m(φ0 = _[0] * π / 180, φ1 = _[1] * π / 180);
- };
- return p;
- }
- function d3_geo_conicEqualArea(φ0, φ1) {
- var sinφ0 = Math.sin(φ0), n = (sinφ0 + Math.sin(φ1)) / 2, C = 1 + sinφ0 * (2 * n - sinφ0), ρ0 = Math.sqrt(C) / n;
- function forward(λ, φ) {
- var ρ = Math.sqrt(C - 2 * n * Math.sin(φ)) / n;
- return [ ρ * Math.sin(λ *= n), ρ0 - ρ * Math.cos(λ) ];
- }
- forward.invert = function(x, y) {
- var ρ0_y = ρ0 - y;
- return [ Math.atan2(x, ρ0_y) / n, Math.asin((C - (x * x + ρ0_y * ρ0_y) * n * n) / (2 * n)) ];
- };
- return forward;
- }
- (d3.geo.conicEqualArea = function() {
- return d3_geo_conic(d3_geo_conicEqualArea);
- }).raw = d3_geo_conicEqualArea;
- d3.geo.albersUsa = function() {
- var lower48 = d3.geo.conicEqualArea().rotate([ 98, 0 ]).center([ 0, 38 ]).parallels([ 29.5, 45.5 ]);
- var alaska = d3.geo.conicEqualArea().rotate([ 160, 0 ]).center([ 0, 60 ]).parallels([ 55, 65 ]);
- var hawaii = d3.geo.conicEqualArea().rotate([ 160, 0 ]).center([ 0, 20 ]).parallels([ 8, 18 ]);
- var puertoRico = d3.geo.conicEqualArea().rotate([ 60, 0 ]).center([ 0, 10 ]).parallels([ 8, 18 ]);
- var alaskaInvert, hawaiiInvert, puertoRicoInvert;
- function albersUsa(coordinates) {
- return projection(coordinates)(coordinates);
- }
- function projection(point) {
- var lon = point[0], lat = point[1];
- return lat > 50 ? alaska : lon < -140 ? hawaii : lat < 21 ? puertoRico : lower48;
- }
- albersUsa.invert = function(coordinates) {
- return alaskaInvert(coordinates) || hawaiiInvert(coordinates) || puertoRicoInvert(coordinates) || lower48.invert(coordinates);
- };
- albersUsa.scale = function(x) {
- if (!arguments.length) return lower48.scale();
- lower48.scale(x);
- alaska.scale(x * .6);
- hawaii.scale(x);
- puertoRico.scale(x * 1.5);
- return albersUsa.translate(lower48.translate());
- };
- albersUsa.translate = function(x) {
- if (!arguments.length) return lower48.translate();
- var dz = lower48.scale(), dx = x[0], dy = x[1];
- lower48.translate(x);
- alaska.translate([ dx - .4 * dz, dy + .17 * dz ]);
- hawaii.translate([ dx - .19 * dz, dy + .2 * dz ]);
- puertoRico.translate([ dx + .58 * dz, dy + .43 * dz ]);
- alaskaInvert = d3_geo_albersUsaInvert(alaska, [ [ -180, 50 ], [ -130, 72 ] ]);
- hawaiiInvert = d3_geo_albersUsaInvert(hawaii, [ [ -164, 18 ], [ -154, 24 ] ]);
- puertoRicoInvert = d3_geo_albersUsaInvert(puertoRico, [ [ -67.5, 17.5 ], [ -65, 19 ] ]);
- return albersUsa;
- };
- return albersUsa.scale(1e3);
- };
- function d3_geo_albersUsaInvert(projection, extent) {
- var a = projection(extent[0]), b = projection([ .5 * (extent[0][0] + extent[1][0]), extent[0][1] ]), c = projection([ extent[1][0], extent[0][1] ]), d = projection(extent[1]);
- var dya = b[1] - a[1], dxa = b[0] - a[0], dyb = c[1] - b[1], dxb = c[0] - b[0];
- var ma = dya / dxa, mb = dyb / dxb;
- var cx = .5 * (ma * mb * (a[1] - c[1]) + mb * (a[0] + b[0]) - ma * (b[0] + c[0])) / (mb - ma), cy = (.5 * (a[0] + b[0]) - cx) / ma + .5 * (a[1] + b[1]);
- var dx0 = d[0] - cx, dy0 = d[1] - cy, dx1 = a[0] - cx, dy1 = a[1] - cy, r0 = dx0 * dx0 + dy0 * dy0, r1 = dx1 * dx1 + dy1 * dy1;
- var a0 = Math.atan2(dy0, dx0), a1 = Math.atan2(dy1, dx1);
- return function(coordinates) {
- var dx = coordinates[0] - cx, dy = coordinates[1] - cy, r = dx * dx + dy * dy, a = Math.atan2(dy, dx);
- if (r0 < r && r < r1 && a0 < a && a < a1) return projection.invert(coordinates);
- };
- }
- var d3_geo_pathAreaSum, d3_geo_pathAreaPolygon, d3_geo_pathArea = {
- point: d3_noop,
- lineStart: d3_noop,
- lineEnd: d3_noop,
- polygonStart: function() {
- d3_geo_pathAreaPolygon = 0;
- d3_geo_pathArea.lineStart = d3_geo_pathAreaRingStart;
- },
- polygonEnd: function() {
- d3_geo_pathArea.lineStart = d3_geo_pathArea.lineEnd = d3_geo_pathArea.point = d3_noop;
- d3_geo_pathAreaSum += Math.abs(d3_geo_pathAreaPolygon / 2);
- }
- };
- function d3_geo_pathAreaRingStart() {
- var x00, y00, x0, y0;
- d3_geo_pathArea.point = function(x, y) {
- d3_geo_pathArea.point = nextPoint;
- x00 = x0 = x, y00 = y0 = y;
- };
- function nextPoint(x, y) {
- d3_geo_pathAreaPolygon += y0 * x - x0 * y;
- x0 = x, y0 = y;
- }
- d3_geo_pathArea.lineEnd = function() {
- nextPoint(x00, y00);
- };
- }
- function d3_geo_pathBuffer() {
- var pointCircle = d3_geo_pathCircle(4.5), buffer = [];
- var stream = {
- point: point,
- lineStart: function() {
- stream.point = pointLineStart;
- },
- lineEnd: lineEnd,
- polygonStart: function() {
- stream.lineEnd = lineEndPolygon;
- },
- polygonEnd: function() {
- stream.lineEnd = lineEnd;
- stream.point = point;
- },
- pointRadius: function(_) {
- pointCircle = d3_geo_pathCircle(_);
- return stream;
- },
- result: function() {
- if (buffer.length) {
- var result = buffer.join("");
- buffer = [];
- return result;
- }
- }
- };
- function point(x, y) {
- buffer.push("M", x, ",", y, pointCircle);
- }
- function pointLineStart(x, y) {
- buffer.push("M", x, ",", y);
- stream.point = pointLine;
- }
- function pointLine(x, y) {
- buffer.push("L", x, ",", y);
- }
- function lineEnd() {
- stream.point = point;
- }
- function lineEndPolygon() {
- buffer.push("Z");
- }
- return stream;
- }
- var d3_geo_pathCentroid = {
- point: d3_geo_pathCentroidPoint,
- lineStart: d3_geo_pathCentroidLineStart,
- lineEnd: d3_geo_pathCentroidLineEnd,
- polygonStart: function() {
- d3_geo_pathCentroid.lineStart = d3_geo_pathCentroidRingStart;
- },
- polygonEnd: function() {
- d3_geo_pathCentroid.point = d3_geo_pathCentroidPoint;
- d3_geo_pathCentroid.lineStart = d3_geo_pathCentroidLineStart;
- d3_geo_pathCentroid.lineEnd = d3_geo_pathCentroidLineEnd;
- }
- };
- function d3_geo_pathCentroidPoint(x, y) {
- if (d3_geo_centroidDimension) return;
- d3_geo_centroidX += x;
- d3_geo_centroidY += y;
- ++d3_geo_centroidZ;
- }
- function d3_geo_pathCentroidLineStart() {
- var x0, y0;
- if (d3_geo_centroidDimension !== 1) {
- if (d3_geo_centroidDimension < 1) {
- d3_geo_centroidDimension = 1;
- d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
- } else return;
- }
- d3_geo_pathCentroid.point = function(x, y) {
- d3_geo_pathCentroid.point = nextPoint;
- x0 = x, y0 = y;
- };
- function nextPoint(x, y) {
- var dx = x - x0, dy = y - y0, z = Math.sqrt(dx * dx + dy * dy);
- d3_geo_centroidX += z * (x0 + x) / 2;
- d3_geo_centroidY += z * (y0 + y) / 2;
- d3_geo_centroidZ += z;
- x0 = x, y0 = y;
- }
- }
- function d3_geo_pathCentroidLineEnd() {
- d3_geo_pathCentroid.point = d3_geo_pathCentroidPoint;
- }
- function d3_geo_pathCentroidRingStart() {
- var x00, y00, x0, y0;
- if (d3_geo_centroidDimension < 2) {
- d3_geo_centroidDimension = 2;
- d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
- }
- d3_geo_pathCentroid.point = function(x, y) {
- d3_geo_pathCentroid.point = nextPoint;
- x00 = x0 = x, y00 = y0 = y;
- };
- function nextPoint(x, y) {
- var z = y0 * x - x0 * y;
- d3_geo_centroidX += z * (x0 + x);
- d3_geo_centroidY += z * (y0 + y);
- d3_geo_centroidZ += z * 3;
- x0 = x, y0 = y;
- }
- d3_geo_pathCentroid.lineEnd = function() {
- nextPoint(x00, y00);
- };
- }
- function d3_geo_pathContext(context) {
- var pointRadius = 4.5;
- var stream = {
- point: point,
- lineStart: function() {
- stream.point = pointLineStart;
- },
- lineEnd: lineEnd,
- polygonStart: function() {
- stream.lineEnd = lineEndPolygon;
- },
- polygonEnd: function() {
- stream.lineEnd = lineEnd;
- stream.point = point;
- },
- pointRadius: function(_) {
- pointRadius = _;
- return stream;
- },
- result: d3_noop
- };
- function point(x, y) {
- context.moveTo(x, y);
- context.arc(x, y, pointRadius, 0, 2 * π);
- }
- function pointLineStart(x, y) {
- context.moveTo(x, y);
- stream.point = pointLine;
- }
- function pointLine(x, y) {
- context.lineTo(x, y);
- }
- function lineEnd() {
- stream.point = point;
- }
- function lineEndPolygon() {
- context.closePath();
- }
- return stream;
- }
- d3.geo.path = function() {
- var pointRadius = 4.5, projection, context, projectStream, contextStream;
- function path(object) {
- if (object) d3.geo.stream(object, projectStream(contextStream.pointRadius(typeof pointRadius === "function" ? +pointRadius.apply(this, arguments) : pointRadius)));
- return contextStream.result();
- }
- path.area = function(object) {
- d3_geo_pathAreaSum = 0;
- d3.geo.stream(object, projectStream(d3_geo_pathArea));
- return d3_geo_pathAreaSum;
- };
- path.centroid = function(object) {
- d3_geo_centroidDimension = d3_geo_centroidX = d3_geo_centroidY = d3_geo_centroidZ = 0;
- d3.geo.stream(object, projectStream(d3_geo_pathCentroid));
- return d3_geo_centroidZ ? [ d3_geo_centroidX / d3_geo_centroidZ, d3_geo_centroidY / d3_geo_centroidZ ] : undefined;
- };
- path.bounds = function(object) {
- return d3_geo_bounds(projectStream)(object);
- };
- path.projection = function(_) {
- if (!arguments.length) return projection;
- projectStream = (projection = _) ? _.stream || d3_geo_pathProjectStream(_) : d3_identity;
- return path;
- };
- path.context = function(_) {
- if (!arguments.length) return context;
- contextStream = (context = _) == null ? new d3_geo_pathBuffer() : new d3_geo_pathContext(_);
- return path;
- };
- path.pointRadius = function(_) {
- if (!arguments.length) return pointRadius;
- pointRadius = typeof _ === "function" ? _ : +_;
- return path;
- };
- return path.projection(d3.geo.albersUsa()).context(null);
- };
- function d3_geo_pathCircle(radius) {
- return "m0," + radius + "a" + radius + "," + radius + " 0 1,1 0," + -2 * radius + "a" + radius + "," + radius + " 0 1,1 0," + +2 * radius + "z";
- }
- function d3_geo_pathProjectStream(project) {
- var resample = d3_geo_resample(function(λ, φ) {
- return project([ λ * d3_degrees, φ * d3_degrees ]);
- });
- return function(stream) {
- stream = resample(stream);
- return {
- point: function(λ, φ) {
- stream.point(λ * d3_radians, φ * d3_radians);
- },
- sphere: function() {
- stream.sphere();
- },
- lineStart: function() {
- stream.lineStart();
- },
- lineEnd: function() {
- stream.lineEnd();
- },
- polygonStart: function() {
- stream.polygonStart();
- },
- polygonEnd: function() {
- stream.polygonEnd();
- }
- };
- };
- }
- d3.geo.albers = function() {
- return d3.geo.conicEqualArea().parallels([ 29.5, 45.5 ]).rotate([ 98, 0 ]).center([ 0, 38 ]).scale(1e3);
- };
function d3_geo_azimuthal(scale, angle) {
function azimuthal(λ, φ) {
var cosλ = Math.cos(λ), cosφ = Math.cos(φ), k = scale(cosλ * cosφ);
@@ -3587,12 +4683,17 @@ d3 = function() {
}, n = φ0 === φ1 ? Math.sin(φ0) : Math.log(cosφ0 / Math.cos(φ1)) / Math.log(t(φ1) / t(φ0)), F = cosφ0 * Math.pow(t(φ0), n) / n;
if (!n) return d3_geo_mercator;
function forward(λ, φ) {
- var ρ = Math.abs(Math.abs(φ) - π / 2) < ε ? 0 : F / Math.pow(t(φ), n);
+ if (F > 0) {
+ if (φ < -halfπ + ε) φ = -halfπ + ε;
+ } else {
+ if (φ > halfπ - ε) φ = halfπ - ε;
+ }
+ var ρ = F / Math.pow(t(φ), n);
return [ ρ * Math.sin(n * λ), F - ρ * Math.cos(n * λ) ];
}
forward.invert = function(x, y) {
var ρ0_y = F - y, ρ = d3_sgn(n) * Math.sqrt(x * x + ρ0_y * ρ0_y);
- return [ Math.atan2(x, ρ0_y) / n, 2 * Math.atan(Math.pow(F / ρ, 1 / n)) - π / 2 ];
+ return [ Math.atan2(x, ρ0_y) / n, 2 * Math.atan(Math.pow(F / ρ, 1 / n)) - halfπ ];
};
return forward;
}
@@ -3601,7 +4702,7 @@ d3 = function() {
}).raw = d3_geo_conicConformal;
function d3_geo_conicEquidistant(φ0, φ1) {
var cosφ0 = Math.cos(φ0), n = φ0 === φ1 ? Math.sin(φ0) : (cosφ0 - Math.cos(φ1)) / (φ1 - φ0), G = cosφ0 / n + φ0;
- if (Math.abs(n) < ε) return d3_geo_equirectangular;
+ if (abs(n) < ε) return d3_geo_equirectangular;
function forward(λ, φ) {
var ρ = G - φ;
return [ ρ * Math.sin(n * λ), G - ρ * Math.cos(n * λ) ];
@@ -3625,7 +4726,7 @@ d3 = function() {
return [ λ, Math.log(Math.tan(π / 4 + φ / 2)) ];
}
d3_geo_mercator.invert = function(x, y) {
- return [ x, 2 * Math.atan(Math.exp(y)) - π / 2 ];
+ return [ x, 2 * Math.atan(Math.exp(y)) - halfπ ];
};
function d3_geo_mercatorProjection(project) {
var m = d3_geo_projection(project), scale = m.scale, translate = m.translate, clipExtent = m.clipExtent, clipAuto;
@@ -3669,344 +4770,45 @@ d3 = function() {
return d3_geo_projection(d3_geo_stereographic);
}).raw = d3_geo_stereographic;
function d3_geo_transverseMercator(λ, φ) {
- var B = Math.cos(φ) * Math.sin(λ);
- return [ Math.log((1 + B) / (1 - B)) / 2, Math.atan2(Math.tan(φ), Math.cos(λ)) ];
+ return [ Math.log(Math.tan(π / 4 + φ / 2)), -λ ];
}
d3_geo_transverseMercator.invert = function(x, y) {
- return [ Math.atan2(d3_sinh(x), Math.cos(y)), d3_asin(Math.sin(y) / d3_cosh(x)) ];
+ return [ -y, 2 * Math.atan(Math.exp(x)) - halfπ ];
};
(d3.geo.transverseMercator = function() {
- return d3_geo_mercatorProjection(d3_geo_transverseMercator);
- }).raw = d3_geo_transverseMercator;
- d3.geom = {};
- d3.svg = {};
- function d3_svg_line(projection) {
- var x = d3_svg_lineX, y = d3_svg_lineY, defined = d3_true, interpolate = d3_svg_lineLinear, interpolateKey = interpolate.key, tension = .7;
- function line(data) {
- var segments = [], points = [], i = -1, n = data.length, d, fx = d3_functor(x), fy = d3_functor(y);
- function segment() {
- segments.push("M", interpolate(projection(points), tension));
- }
- while (++i < n) {
- if (defined.call(this, d = data[i], i)) {
- points.push([ +fx.call(this, d, i), +fy.call(this, d, i) ]);
- } else if (points.length) {
- segment();
- points = [];
- }
- }
- if (points.length) segment();
- return segments.length ? segments.join("") : null;
- }
- line.x = function(_) {
- if (!arguments.length) return x;
- x = _;
- return line;
- };
- line.y = function(_) {
- if (!arguments.length) return y;
- y = _;
- return line;
- };
- line.defined = function(_) {
- if (!arguments.length) return defined;
- defined = _;
- return line;
- };
- line.interpolate = function(_) {
- if (!arguments.length) return interpolateKey;
- if (typeof _ === "function") interpolateKey = interpolate = _; else interpolateKey = (interpolate = d3_svg_lineInterpolators.get(_) || d3_svg_lineLinear).key;
- return line;
+ var projection = d3_geo_mercatorProjection(d3_geo_transverseMercator), center = projection.center, rotate = projection.rotate;
+ projection.center = function(_) {
+ return _ ? center([ -_[1], _[0] ]) : (_ = center(), [ _[1], -_[0] ]);
};
- line.tension = function(_) {
- if (!arguments.length) return tension;
- tension = _;
- return line;
+ projection.rotate = function(_) {
+ return _ ? rotate([ _[0], _[1], _.length > 2 ? _[2] + 90 : 90 ]) : (_ = rotate(),
+ [ _[0], _[1], _[2] - 90 ]);
};
- return line;
- }
- d3.svg.line = function() {
- return d3_svg_line(d3_identity);
- };
- function d3_svg_lineX(d) {
+ return rotate([ 0, 0, 90 ]);
+ }).raw = d3_geo_transverseMercator;
+ d3.geom = {};
+ function d3_geom_pointX(d) {
return d[0];
}
- function d3_svg_lineY(d) {
+ function d3_geom_pointY(d) {
return d[1];
}
- var d3_svg_lineInterpolators = d3.map({
- linear: d3_svg_lineLinear,
- "linear-closed": d3_svg_lineLinearClosed,
- "step-before": d3_svg_lineStepBefore,
- "step-after": d3_svg_lineStepAfter,
- basis: d3_svg_lineBasis,
- "basis-open": d3_svg_lineBasisOpen,
- "basis-closed": d3_svg_lineBasisClosed,
- bundle: d3_svg_lineBundle,
- cardinal: d3_svg_lineCardinal,
- "cardinal-open": d3_svg_lineCardinalOpen,
- "cardinal-closed": d3_svg_lineCardinalClosed,
- monotone: d3_svg_lineMonotone
- });
- d3_svg_lineInterpolators.forEach(function(key, value) {
- value.key = key;
- value.closed = /-closed$/.test(key);
- });
- function d3_svg_lineLinear(points) {
- return points.join("L");
- }
- function d3_svg_lineLinearClosed(points) {
- return d3_svg_lineLinear(points) + "Z";
- }
- function d3_svg_lineStepBefore(points) {
- var i = 0, n = points.length, p = points[0], path = [ p[0], ",", p[1] ];
- while (++i < n) path.push("V", (p = points[i])[1], "H", p[0]);
- return path.join("");
- }
- function d3_svg_lineStepAfter(points) {
- var i = 0, n = points.length, p = points[0], path = [ p[0], ",", p[1] ];
- while (++i < n) path.push("H", (p = points[i])[0], "V", p[1]);
- return path.join("");
- }
- function d3_svg_lineCardinalOpen(points, tension) {
- return points.length < 4 ? d3_svg_lineLinear(points) : points[1] + d3_svg_lineHermite(points.slice(1, points.length - 1), d3_svg_lineCardinalTangents(points, tension));
- }
- function d3_svg_lineCardinalClosed(points, tension) {
- return points.length < 3 ? d3_svg_lineLinear(points) : points[0] + d3_svg_lineHermite((points.push(points[0]),
- points), d3_svg_lineCardinalTangents([ points[points.length - 2] ].concat(points, [ points[1] ]), tension));
- }
- function d3_svg_lineCardinal(points, tension) {
- return points.length < 3 ? d3_svg_lineLinear(points) : points[0] + d3_svg_lineHermite(points, d3_svg_lineCardinalTangents(points, tension));
- }
- function d3_svg_lineHermite(points, tangents) {
- if (tangents.length < 1 || points.length != tangents.length && points.length != tangents.length + 2) {
- return d3_svg_lineLinear(points);
- }
- var quad = points.length != tangents.length, path = "", p0 = points[0], p = points[1], t0 = tangents[0], t = t0, pi = 1;
- if (quad) {
- path += "Q" + (p[0] - t0[0] * 2 / 3) + "," + (p[1] - t0[1] * 2 / 3) + "," + p[0] + "," + p[1];
- p0 = points[1];
- pi = 2;
- }
- if (tangents.length > 1) {
- t = tangents[1];
- p = points[pi];
- pi++;
- path += "C" + (p0[0] + t0[0]) + "," + (p0[1] + t0[1]) + "," + (p[0] - t[0]) + "," + (p[1] - t[1]) + "," + p[0] + "," + p[1];
- for (var i = 2; i < tangents.length; i++, pi++) {
- p = points[pi];
- t = tangents[i];
- path += "S" + (p[0] - t[0]) + "," + (p[1] - t[1]) + "," + p[0] + "," + p[1];
- }
- }
- if (quad) {
- var lp = points[pi];
- path += "Q" + (p[0] + t[0] * 2 / 3) + "," + (p[1] + t[1] * 2 / 3) + "," + lp[0] + "," + lp[1];
- }
- return path;
- }
- function d3_svg_lineCardinalTangents(points, tension) {
- var tangents = [], a = (1 - tension) / 2, p0, p1 = points[0], p2 = points[1], i = 1, n = points.length;
- while (++i < n) {
- p0 = p1;
- p1 = p2;
- p2 = points[i];
- tangents.push([ a * (p2[0] - p0[0]), a * (p2[1] - p0[1]) ]);
- }
- return tangents;
- }
- function d3_svg_lineBasis(points) {
- if (points.length < 3) return d3_svg_lineLinear(points);
- var i = 1, n = points.length, pi = points[0], x0 = pi[0], y0 = pi[1], px = [ x0, x0, x0, (pi = points[1])[0] ], py = [ y0, y0, y0, pi[1] ], path = [ x0, ",", y0 ];
- d3_svg_lineBasisBezier(path, px, py);
- while (++i < n) {
- pi = points[i];
- px.shift();
- px.push(pi[0]);
- py.shift();
- py.push(pi[1]);
- d3_svg_lineBasisBezier(path, px, py);
- }
- i = -1;
- while (++i < 2) {
- px.shift();
- px.push(pi[0]);
- py.shift();
- py.push(pi[1]);
- d3_svg_lineBasisBezier(path, px, py);
- }
- return path.join("");
- }
- function d3_svg_lineBasisOpen(points) {
- if (points.length < 4) return d3_svg_lineLinear(points);
- var path = [], i = -1, n = points.length, pi, px = [ 0 ], py = [ 0 ];
- while (++i < 3) {
- pi = points[i];
- px.push(pi[0]);
- py.push(pi[1]);
- }
- path.push(d3_svg_lineDot4(d3_svg_lineBasisBezier3, px) + "," + d3_svg_lineDot4(d3_svg_lineBasisBezier3, py));
- --i;
- while (++i < n) {
- pi = points[i];
- px.shift();
- px.push(pi[0]);
- py.shift();
- py.push(pi[1]);
- d3_svg_lineBasisBezier(path, px, py);
- }
- return path.join("");
- }
- function d3_svg_lineBasisClosed(points) {
- var path, i = -1, n = points.length, m = n + 4, pi, px = [], py = [];
- while (++i < 4) {
- pi = points[i % n];
- px.push(pi[0]);
- py.push(pi[1]);
- }
- path = [ d3_svg_lineDot4(d3_svg_lineBasisBezier3, px), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, py) ];
- --i;
- while (++i < m) {
- pi = points[i % n];
- px.shift();
- px.push(pi[0]);
- py.shift();
- py.push(pi[1]);
- d3_svg_lineBasisBezier(path, px, py);
- }
- return path.join("");
- }
- function d3_svg_lineBundle(points, tension) {
- var n = points.length - 1;
- if (n) {
- var x0 = points[0][0], y0 = points[0][1], dx = points[n][0] - x0, dy = points[n][1] - y0, i = -1, p, t;
- while (++i <= n) {
- p = points[i];
- t = i / n;
- p[0] = tension * p[0] + (1 - tension) * (x0 + t * dx);
- p[1] = tension * p[1] + (1 - tension) * (y0 + t * dy);
- }
- }
- return d3_svg_lineBasis(points);
- }
- function d3_svg_lineDot4(a, b) {
- return a[0] * b[0] + a[1] * b[1] + a[2] * b[2] + a[3] * b[3];
- }
- var d3_svg_lineBasisBezier1 = [ 0, 2 / 3, 1 / 3, 0 ], d3_svg_lineBasisBezier2 = [ 0, 1 / 3, 2 / 3, 0 ], d3_svg_lineBasisBezier3 = [ 0, 1 / 6, 2 / 3, 1 / 6 ];
- function d3_svg_lineBasisBezier(path, x, y) {
- path.push("C", d3_svg_lineDot4(d3_svg_lineBasisBezier1, x), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier1, y), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier2, x), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier2, y), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, x), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, y));
- }
- function d3_svg_lineSlope(p0, p1) {
- return (p1[1] - p0[1]) / (p1[0] - p0[0]);
- }
- function d3_svg_lineFiniteDifferences(points) {
- var i = 0, j = points.length - 1, m = [], p0 = points[0], p1 = points[1], d = m[0] = d3_svg_lineSlope(p0, p1);
- while (++i < j) {
- m[i] = (d + (d = d3_svg_lineSlope(p0 = p1, p1 = points[i + 1]))) / 2;
- }
- m[i] = d;
- return m;
- }
- function d3_svg_lineMonotoneTangents(points) {
- var tangents = [], d, a, b, s, m = d3_svg_lineFiniteDifferences(points), i = -1, j = points.length - 1;
- while (++i < j) {
- d = d3_svg_lineSlope(points[i], points[i + 1]);
- if (Math.abs(d) < 1e-6) {
- m[i] = m[i + 1] = 0;
- } else {
- a = m[i] / d;
- b = m[i + 1] / d;
- s = a * a + b * b;
- if (s > 9) {
- s = d * 3 / Math.sqrt(s);
- m[i] = s * a;
- m[i + 1] = s * b;
- }
- }
- }
- i = -1;
- while (++i <= j) {
- s = (points[Math.min(j, i + 1)][0] - points[Math.max(0, i - 1)][0]) / (6 * (1 + m[i] * m[i]));
- tangents.push([ s || 0, m[i] * s || 0 ]);
- }
- return tangents;
- }
- function d3_svg_lineMonotone(points) {
- return points.length < 3 ? d3_svg_lineLinear(points) : points[0] + d3_svg_lineHermite(points, d3_svg_lineMonotoneTangents(points));
- }
d3.geom.hull = function(vertices) {
- var x = d3_svg_lineX, y = d3_svg_lineY;
+ var x = d3_geom_pointX, y = d3_geom_pointY;
if (arguments.length) return hull(vertices);
function hull(data) {
if (data.length < 3) return [];
- var fx = d3_functor(x), fy = d3_functor(y), n = data.length, vertices, plen = n - 1, points = [], stack = [], d, i, j, h = 0, x1, y1, x2, y2, u, v, a, sp;
- if (fx === d3_svg_lineX && y === d3_svg_lineY) vertices = data; else for (i = 0,
- vertices = []; i < n; ++i) {
- vertices.push([ +fx.call(this, d = data[i], i), +fy.call(this, d, i) ]);
- }
- for (i = 1; i < n; ++i) {
- if (vertices[i][1] < vertices[h][1]) {
- h = i;
- } else if (vertices[i][1] == vertices[h][1]) {
- h = vertices[i][0] < vertices[h][0] ? i : h;
- }
- }
- for (i = 0; i < n; ++i) {
- if (i === h) continue;
- y1 = vertices[i][1] - vertices[h][1];
- x1 = vertices[i][0] - vertices[h][0];
- points.push({
- angle: Math.atan2(y1, x1),
- index: i
- });
- }
- points.sort(function(a, b) {
- return a.angle - b.angle;
- });
- a = points[0].angle;
- v = points[0].index;
- u = 0;
- for (i = 1; i < plen; ++i) {
- j = points[i].index;
- if (a == points[i].angle) {
- x1 = vertices[v][0] - vertices[h][0];
- y1 = vertices[v][1] - vertices[h][1];
- x2 = vertices[j][0] - vertices[h][0];
- y2 = vertices[j][1] - vertices[h][1];
- if (x1 * x1 + y1 * y1 >= x2 * x2 + y2 * y2) {
- points[i].index = -1;
- } else {
- points[u].index = -1;
- a = points[i].angle;
- u = i;
- v = j;
- }
- } else {
- a = points[i].angle;
- u = i;
- v = j;
- }
- }
- stack.push(h);
- for (i = 0, j = 0; i < 2; ++j) {
- if (points[j].index !== -1) {
- stack.push(points[j].index);
- i++;
- }
- }
- sp = stack.length;
- for (;j < plen; ++j) {
- if (points[j].index === -1) continue;
- while (!d3_geom_hullCCW(stack[sp - 2], stack[sp - 1], points[j].index, vertices)) {
- --sp;
- }
- stack[sp++] = points[j].index;
- }
- var poly = [];
- for (i = 0; i < sp; ++i) {
- poly.push(data[stack[i]]);
- }
- return poly;
+ var fx = d3_functor(x), fy = d3_functor(y), i, n = data.length, points = [], flippedPoints = [];
+ for (i = 0; i < n; i++) {
+ points.push([ +fx.call(this, data[i], i), +fy.call(this, data[i], i), i ]);
+ }
+ points.sort(d3_geom_hullOrder);
+ for (i = 0; i < n; i++) flippedPoints.push([ points[i][0], -points[i][1] ]);
+ var upper = d3_geom_hullUpper(points), lower = d3_geom_hullUpper(flippedPoints);
+ var skipLeft = lower[0] === upper[0], skipRight = lower[lower.length - 1] === upper[upper.length - 1], polygon = [];
+ for (i = upper.length - 1; i >= 0; --i) polygon.push(data[points[upper[i]][2]]);
+ for (i = +skipLeft; i < lower.length - skipRight; ++i) polygon.push(data[points[lower[i]][2]]);
+ return polygon;
}
hull.x = function(_) {
return arguments.length ? (x = _, hull) : x;
@@ -4016,64 +4818,67 @@ d3 = function() {
};
return hull;
};
- function d3_geom_hullCCW(i1, i2, i3, v) {
- var t, a, b, c, d, e, f;
- t = v[i1];
- a = t[0];
- b = t[1];
- t = v[i2];
- c = t[0];
- d = t[1];
- t = v[i3];
- e = t[0];
- f = t[1];
- return (f - b) * (c - a) - (d - b) * (e - a) > 0;
+ function d3_geom_hullUpper(points) {
+ var n = points.length, hull = [ 0, 1 ], hs = 2;
+ for (var i = 2; i < n; i++) {
+ while (hs > 1 && d3_cross2d(points[hull[hs - 2]], points[hull[hs - 1]], points[i]) <= 0) --hs;
+ hull[hs++] = i;
+ }
+ return hull.slice(0, hs);
+ }
+ function d3_geom_hullOrder(a, b) {
+ return a[0] - b[0] || a[1] - b[1];
}
d3.geom.polygon = function(coordinates) {
- coordinates.area = function() {
- var i = 0, n = coordinates.length, area = coordinates[n - 1][1] * coordinates[0][0] - coordinates[n - 1][0] * coordinates[0][1];
- while (++i < n) {
- area += coordinates[i - 1][1] * coordinates[i][0] - coordinates[i - 1][0] * coordinates[i][1];
- }
- return area * .5;
- };
- coordinates.centroid = function(k) {
- var i = -1, n = coordinates.length, x = 0, y = 0, a, b = coordinates[n - 1], c;
- if (!arguments.length) k = -1 / (6 * coordinates.area());
- while (++i < n) {
- a = b;
- b = coordinates[i];
- c = a[0] * b[1] - b[0] * a[1];
- x += (a[0] + b[0]) * c;
- y += (a[1] + b[1]) * c;
- }
- return [ x * k, y * k ];
- };
- coordinates.clip = function(subject) {
- var input, i = -1, n = coordinates.length, j, m, a = coordinates[n - 1], b, c, d;
- while (++i < n) {
- input = subject.slice();
- subject.length = 0;
- b = coordinates[i];
- c = input[(m = input.length) - 1];
- j = -1;
- while (++j < m) {
- d = input[j];
- if (d3_geom_polygonInside(d, a, b)) {
- if (!d3_geom_polygonInside(c, a, b)) {
- subject.push(d3_geom_polygonIntersect(c, d, a, b));
- }
- subject.push(d);
- } else if (d3_geom_polygonInside(c, a, b)) {
+ d3_subclass(coordinates, d3_geom_polygonPrototype);
+ return coordinates;
+ };
+ var d3_geom_polygonPrototype = d3.geom.polygon.prototype = [];
+ d3_geom_polygonPrototype.area = function() {
+ var i = -1, n = this.length, a, b = this[n - 1], area = 0;
+ while (++i < n) {
+ a = b;
+ b = this[i];
+ area += a[1] * b[0] - a[0] * b[1];
+ }
+ return area * .5;
+ };
+ d3_geom_polygonPrototype.centroid = function(k) {
+ var i = -1, n = this.length, x = 0, y = 0, a, b = this[n - 1], c;
+ if (!arguments.length) k = -1 / (6 * this.area());
+ while (++i < n) {
+ a = b;
+ b = this[i];
+ c = a[0] * b[1] - b[0] * a[1];
+ x += (a[0] + b[0]) * c;
+ y += (a[1] + b[1]) * c;
+ }
+ return [ x * k, y * k ];
+ };
+ d3_geom_polygonPrototype.clip = function(subject) {
+ var input, closed = d3_geom_polygonClosed(subject), i = -1, n = this.length - d3_geom_polygonClosed(this), j, m, a = this[n - 1], b, c, d;
+ while (++i < n) {
+ input = subject.slice();
+ subject.length = 0;
+ b = this[i];
+ c = input[(m = input.length - closed) - 1];
+ j = -1;
+ while (++j < m) {
+ d = input[j];
+ if (d3_geom_polygonInside(d, a, b)) {
+ if (!d3_geom_polygonInside(c, a, b)) {
subject.push(d3_geom_polygonIntersect(c, d, a, b));
}
- c = d;
+ subject.push(d);
+ } else if (d3_geom_polygonInside(c, a, b)) {
+ subject.push(d3_geom_polygonIntersect(c, d, a, b));
}
- a = b;
+ c = d;
}
- return subject;
- };
- return coordinates;
+ if (closed) subject.push(subject[0]);
+ a = b;
+ }
+ return subject;
};
function d3_geom_polygonInside(p, a, b) {
return (b[0] - a[0]) * (p[1] - a[1]) < (b[1] - a[1]) * (p[0] - a[0]);
@@ -4082,425 +4887,660 @@ d3 = function() {
var x1 = c[0], x3 = a[0], x21 = d[0] - x1, x43 = b[0] - x3, y1 = c[1], y3 = a[1], y21 = d[1] - y1, y43 = b[1] - y3, ua = (x43 * (y1 - y3) - y43 * (x1 - x3)) / (y43 * x21 - x43 * y21);
return [ x1 + ua * x21, y1 + ua * y21 ];
}
- d3.geom.delaunay = function(vertices) {
- var edges = vertices.map(function() {
- return [];
- }), triangles = [];
- d3_geom_voronoiTessellate(vertices, function(e) {
- edges[e.region.l.index].push(vertices[e.region.r.index]);
- });
- edges.forEach(function(edge, i) {
- var v = vertices[i], cx = v[0], cy = v[1];
- edge.forEach(function(v) {
- v.angle = Math.atan2(v[0] - cx, v[1] - cy);
- });
- edge.sort(function(a, b) {
- return a.angle - b.angle;
- });
- for (var j = 0, m = edge.length - 1; j < m; j++) {
- triangles.push([ v, edge[j], edge[j + 1] ]);
- }
- });
- return triangles;
- };
- d3.geom.voronoi = function(points) {
- var size = null, x = d3_svg_lineX, y = d3_svg_lineY, clip;
- if (arguments.length) return voronoi(points);
- function voronoi(data) {
- var points, polygons = data.map(function() {
- return [];
- }), fx = d3_functor(x), fy = d3_functor(y), d, i, n = data.length, Z = 1e6;
- if (fx === d3_svg_lineX && fy === d3_svg_lineY) points = data; else for (points = [],
- i = 0; i < n; ++i) {
- points.push([ +fx.call(this, d = data[i], i), +fy.call(this, d, i) ]);
- }
- d3_geom_voronoiTessellate(points, function(e) {
- var s1, s2, x1, x2, y1, y2;
- if (e.a === 1 && e.b >= 0) {
- s1 = e.ep.r;
- s2 = e.ep.l;
- } else {
- s1 = e.ep.l;
- s2 = e.ep.r;
- }
- if (e.a === 1) {
- y1 = s1 ? s1.y : -Z;
- x1 = e.c - e.b * y1;
- y2 = s2 ? s2.y : Z;
- x2 = e.c - e.b * y2;
- } else {
- x1 = s1 ? s1.x : -Z;
- y1 = e.c - e.a * x1;
- x2 = s2 ? s2.x : Z;
- y2 = e.c - e.a * x2;
- }
- var v1 = [ x1, y1 ], v2 = [ x2, y2 ];
- polygons[e.region.l.index].push(v1, v2);
- polygons[e.region.r.index].push(v1, v2);
- });
- polygons = polygons.map(function(polygon, i) {
- var cx = points[i][0], cy = points[i][1], angle = polygon.map(function(v) {
- return Math.atan2(v[0] - cx, v[1] - cy);
- }), order = d3.range(polygon.length).sort(function(a, b) {
- return angle[a] - angle[b];
- });
- return order.filter(function(d, i) {
- return !i || angle[d] - angle[order[i - 1]] > ε;
- }).map(function(d) {
- return polygon[d];
- });
- });
- polygons.forEach(function(polygon, i) {
- var n = polygon.length;
- if (!n) return polygon.push([ -Z, -Z ], [ -Z, Z ], [ Z, Z ], [ Z, -Z ]);
- if (n > 2) return;
- var p0 = points[i], p1 = polygon[0], p2 = polygon[1], x0 = p0[0], y0 = p0[1], x1 = p1[0], y1 = p1[1], x2 = p2[0], y2 = p2[1], dx = Math.abs(x2 - x1), dy = y2 - y1;
- if (Math.abs(dy) < ε) {
- var y = y0 < y1 ? -Z : Z;
- polygon.push([ -Z, y ], [ Z, y ]);
- } else if (dx < ε) {
- var x = x0 < x1 ? -Z : Z;
- polygon.push([ x, -Z ], [ x, Z ]);
+ function d3_geom_polygonClosed(coordinates) {
+ var a = coordinates[0], b = coordinates[coordinates.length - 1];
+ return !(a[0] - b[0] || a[1] - b[1]);
+ }
+ var d3_geom_voronoiEdges, d3_geom_voronoiCells, d3_geom_voronoiBeaches, d3_geom_voronoiBeachPool = [], d3_geom_voronoiFirstCircle, d3_geom_voronoiCircles, d3_geom_voronoiCirclePool = [];
+ function d3_geom_voronoiBeach() {
+ d3_geom_voronoiRedBlackNode(this);
+ this.edge = this.site = this.circle = null;
+ }
+ function d3_geom_voronoiCreateBeach(site) {
+ var beach = d3_geom_voronoiBeachPool.pop() || new d3_geom_voronoiBeach();
+ beach.site = site;
+ return beach;
+ }
+ function d3_geom_voronoiDetachBeach(beach) {
+ d3_geom_voronoiDetachCircle(beach);
+ d3_geom_voronoiBeaches.remove(beach);
+ d3_geom_voronoiBeachPool.push(beach);
+ d3_geom_voronoiRedBlackNode(beach);
+ }
+ function d3_geom_voronoiRemoveBeach(beach) {
+ var circle = beach.circle, x = circle.x, y = circle.cy, vertex = {
+ x: x,
+ y: y
+ }, previous = beach.P, next = beach.N, disappearing = [ beach ];
+ d3_geom_voronoiDetachBeach(beach);
+ var lArc = previous;
+ while (lArc.circle && abs(x - lArc.circle.x) < ε && abs(y - lArc.circle.cy) < ε) {
+ previous = lArc.P;
+ disappearing.unshift(lArc);
+ d3_geom_voronoiDetachBeach(lArc);
+ lArc = previous;
+ }
+ disappearing.unshift(lArc);
+ d3_geom_voronoiDetachCircle(lArc);
+ var rArc = next;
+ while (rArc.circle && abs(x - rArc.circle.x) < ε && abs(y - rArc.circle.cy) < ε) {
+ next = rArc.N;
+ disappearing.push(rArc);
+ d3_geom_voronoiDetachBeach(rArc);
+ rArc = next;
+ }
+ disappearing.push(rArc);
+ d3_geom_voronoiDetachCircle(rArc);
+ var nArcs = disappearing.length, iArc;
+ for (iArc = 1; iArc < nArcs; ++iArc) {
+ rArc = disappearing[iArc];
+ lArc = disappearing[iArc - 1];
+ d3_geom_voronoiSetEdgeEnd(rArc.edge, lArc.site, rArc.site, vertex);
+ }
+ lArc = disappearing[0];
+ rArc = disappearing[nArcs - 1];
+ rArc.edge = d3_geom_voronoiCreateEdge(lArc.site, rArc.site, null, vertex);
+ d3_geom_voronoiAttachCircle(lArc);
+ d3_geom_voronoiAttachCircle(rArc);
+ }
+ function d3_geom_voronoiAddBeach(site) {
+ var x = site.x, directrix = site.y, lArc, rArc, dxl, dxr, node = d3_geom_voronoiBeaches._;
+ while (node) {
+ dxl = d3_geom_voronoiLeftBreakPoint(node, directrix) - x;
+ if (dxl > ε) node = node.L; else {
+ dxr = x - d3_geom_voronoiRightBreakPoint(node, directrix);
+ if (dxr > ε) {
+ if (!node.R) {
+ lArc = node;
+ break;
+ }
+ node = node.R;
} else {
- var y = (x2 - x1) * (y1 - y0) < (x1 - x0) * (y2 - y1) ? Z : -Z, z = Math.abs(dy) - dx;
- if (Math.abs(z) < ε) {
- polygon.push([ dy < 0 ? y : -y, y ]);
+ if (dxl > -ε) {
+ lArc = node.P;
+ rArc = node;
+ } else if (dxr > -ε) {
+ lArc = node;
+ rArc = node.N;
} else {
- if (z > 0) y *= -1;
- polygon.push([ -Z, y ], [ Z, y ]);
+ lArc = rArc = node;
}
+ break;
+ }
+ }
+ }
+ var newArc = d3_geom_voronoiCreateBeach(site);
+ d3_geom_voronoiBeaches.insert(lArc, newArc);
+ if (!lArc && !rArc) return;
+ if (lArc === rArc) {
+ d3_geom_voronoiDetachCircle(lArc);
+ rArc = d3_geom_voronoiCreateBeach(lArc.site);
+ d3_geom_voronoiBeaches.insert(newArc, rArc);
+ newArc.edge = rArc.edge = d3_geom_voronoiCreateEdge(lArc.site, newArc.site);
+ d3_geom_voronoiAttachCircle(lArc);
+ d3_geom_voronoiAttachCircle(rArc);
+ return;
+ }
+ if (!rArc) {
+ newArc.edge = d3_geom_voronoiCreateEdge(lArc.site, newArc.site);
+ return;
+ }
+ d3_geom_voronoiDetachCircle(lArc);
+ d3_geom_voronoiDetachCircle(rArc);
+ var lSite = lArc.site, ax = lSite.x, ay = lSite.y, bx = site.x - ax, by = site.y - ay, rSite = rArc.site, cx = rSite.x - ax, cy = rSite.y - ay, d = 2 * (bx * cy - by * cx), hb = bx * bx + by * by, hc = cx * cx + cy * cy, vertex = {
+ x: (cy * hb - by * hc) / d + ax,
+ y: (bx * hc - cx * hb) / d + ay
+ };
+ d3_geom_voronoiSetEdgeEnd(rArc.edge, lSite, rSite, vertex);
+ newArc.edge = d3_geom_voronoiCreateEdge(lSite, site, null, vertex);
+ rArc.edge = d3_geom_voronoiCreateEdge(site, rSite, null, vertex);
+ d3_geom_voronoiAttachCircle(lArc);
+ d3_geom_voronoiAttachCircle(rArc);
+ }
+ function d3_geom_voronoiLeftBreakPoint(arc, directrix) {
+ var site = arc.site, rfocx = site.x, rfocy = site.y, pby2 = rfocy - directrix;
+ if (!pby2) return rfocx;
+ var lArc = arc.P;
+ if (!lArc) return -Infinity;
+ site = lArc.site;
+ var lfocx = site.x, lfocy = site.y, plby2 = lfocy - directrix;
+ if (!plby2) return lfocx;
+ var hl = lfocx - rfocx, aby2 = 1 / pby2 - 1 / plby2, b = hl / plby2;
+ if (aby2) return (-b + Math.sqrt(b * b - 2 * aby2 * (hl * hl / (-2 * plby2) - lfocy + plby2 / 2 + rfocy - pby2 / 2))) / aby2 + rfocx;
+ return (rfocx + lfocx) / 2;
+ }
+ function d3_geom_voronoiRightBreakPoint(arc, directrix) {
+ var rArc = arc.N;
+ if (rArc) return d3_geom_voronoiLeftBreakPoint(rArc, directrix);
+ var site = arc.site;
+ return site.y === directrix ? site.x : Infinity;
+ }
+ function d3_geom_voronoiCell(site) {
+ this.site = site;
+ this.edges = [];
+ }
+ d3_geom_voronoiCell.prototype.prepare = function() {
+ var halfEdges = this.edges, iHalfEdge = halfEdges.length, edge;
+ while (iHalfEdge--) {
+ edge = halfEdges[iHalfEdge].edge;
+ if (!edge.b || !edge.a) halfEdges.splice(iHalfEdge, 1);
+ }
+ halfEdges.sort(d3_geom_voronoiHalfEdgeOrder);
+ return halfEdges.length;
+ };
+ function d3_geom_voronoiCloseCells(extent) {
+ var x0 = extent[0][0], x1 = extent[1][0], y0 = extent[0][1], y1 = extent[1][1], x2, y2, x3, y3, cells = d3_geom_voronoiCells, iCell = cells.length, cell, iHalfEdge, halfEdges, nHalfEdges, start, end;
+ while (iCell--) {
+ cell = cells[iCell];
+ if (!cell || !cell.prepare()) continue;
+ halfEdges = cell.edges;
+ nHalfEdges = halfEdges.length;
+ iHalfEdge = 0;
+ while (iHalfEdge < nHalfEdges) {
+ end = halfEdges[iHalfEdge].end(), x3 = end.x, y3 = end.y;
+ start = halfEdges[++iHalfEdge % nHalfEdges].start(), x2 = start.x, y2 = start.y;
+ if (abs(x3 - x2) > ε || abs(y3 - y2) > ε) {
+ halfEdges.splice(iHalfEdge, 0, new d3_geom_voronoiHalfEdge(d3_geom_voronoiCreateBorderEdge(cell.site, end, abs(x3 - x0) < ε && y1 - y3 > ε ? {
+ x: x0,
+ y: abs(x2 - x0) < ε ? y2 : y1
+ } : abs(y3 - y1) < ε && x1 - x3 > ε ? {
+ x: abs(y2 - y1) < ε ? x2 : x1,
+ y: y1
+ } : abs(x3 - x1) < ε && y3 - y0 > ε ? {
+ x: x1,
+ y: abs(x2 - x1) < ε ? y2 : y0
+ } : abs(y3 - y0) < ε && x3 - x0 > ε ? {
+ x: abs(y2 - y0) < ε ? x2 : x0,
+ y: y0
+ } : null), cell.site, null));
+ ++nHalfEdges;
+ }
+ }
+ }
+ }
+ function d3_geom_voronoiHalfEdgeOrder(a, b) {
+ return b.angle - a.angle;
+ }
+ function d3_geom_voronoiCircle() {
+ d3_geom_voronoiRedBlackNode(this);
+ this.x = this.y = this.arc = this.site = this.cy = null;
+ }
+ function d3_geom_voronoiAttachCircle(arc) {
+ var lArc = arc.P, rArc = arc.N;
+ if (!lArc || !rArc) return;
+ var lSite = lArc.site, cSite = arc.site, rSite = rArc.site;
+ if (lSite === rSite) return;
+ var bx = cSite.x, by = cSite.y, ax = lSite.x - bx, ay = lSite.y - by, cx = rSite.x - bx, cy = rSite.y - by;
+ var d = 2 * (ax * cy - ay * cx);
+ if (d >= -ε2) return;
+ var ha = ax * ax + ay * ay, hc = cx * cx + cy * cy, x = (cy * ha - ay * hc) / d, y = (ax * hc - cx * ha) / d, cy = y + by;
+ var circle = d3_geom_voronoiCirclePool.pop() || new d3_geom_voronoiCircle();
+ circle.arc = arc;
+ circle.site = cSite;
+ circle.x = x + bx;
+ circle.y = cy + Math.sqrt(x * x + y * y);
+ circle.cy = cy;
+ arc.circle = circle;
+ var before = null, node = d3_geom_voronoiCircles._;
+ while (node) {
+ if (circle.y < node.y || circle.y === node.y && circle.x <= node.x) {
+ if (node.L) node = node.L; else {
+ before = node.P;
+ break;
}
- });
- if (clip) for (i = 0; i < n; ++i) clip(polygons[i]);
- for (i = 0; i < n; ++i) polygons[i].point = data[i];
- return polygons;
- }
- voronoi.x = function(_) {
- return arguments.length ? (x = _, voronoi) : x;
- };
- voronoi.y = function(_) {
- return arguments.length ? (y = _, voronoi) : y;
- };
- voronoi.size = function(_) {
- if (!arguments.length) return size;
- if (_ == null) {
- clip = null;
} else {
- size = [ +_[0], +_[1] ];
- clip = d3.geom.polygon([ [ 0, 0 ], [ 0, size[1] ], size, [ size[0], 0 ] ]).clip;
- }
- return voronoi;
- };
- voronoi.links = function(data) {
- var points, graph = data.map(function() {
- return [];
- }), links = [], fx = d3_functor(x), fy = d3_functor(y), d, i, n = data.length;
- if (fx === d3_svg_lineX && fy === d3_svg_lineY) points = data; else for (i = 0; i < n; ++i) {
- points.push([ +fx.call(this, d = data[i], i), +fy.call(this, d, i) ]);
- }
- d3_geom_voronoiTessellate(points, function(e) {
- var l = e.region.l.index, r = e.region.r.index;
- if (graph[l][r]) return;
- graph[l][r] = graph[r][l] = true;
- links.push({
- source: data[l],
- target: data[r]
- });
- });
- return links;
- };
- voronoi.triangles = function(data) {
- if (x === d3_svg_lineX && y === d3_svg_lineY) return d3.geom.delaunay(data);
- var points, point, fx = d3_functor(x), fy = d3_functor(y), d, i, n;
- for (i = 0, points = [], n = data.length; i < n; ++i) {
- point = [ +fx.call(this, d = data[i], i), +fy.call(this, d, i) ];
- point.data = d;
- points.push(point);
- }
- return d3.geom.delaunay(points).map(function(triangle) {
- return triangle.map(function(point) {
- return point.data;
- });
- });
- };
- return voronoi;
- };
- var d3_geom_voronoiOpposite = {
- l: "r",
- r: "l"
- };
- function d3_geom_voronoiTessellate(points, callback) {
- var Sites = {
- list: points.map(function(v, i) {
- return {
- index: i,
- x: v[0],
- y: v[1]
- };
- }).sort(function(a, b) {
- return a.y < b.y ? -1 : a.y > b.y ? 1 : a.x < b.x ? -1 : a.x > b.x ? 1 : 0;
- }),
- bottomSite: null
- };
- var EdgeList = {
- list: [],
- leftEnd: null,
- rightEnd: null,
- init: function() {
- EdgeList.leftEnd = EdgeList.createHalfEdge(null, "l");
- EdgeList.rightEnd = EdgeList.createHalfEdge(null, "l");
- EdgeList.leftEnd.r = EdgeList.rightEnd;
- EdgeList.rightEnd.l = EdgeList.leftEnd;
- EdgeList.list.unshift(EdgeList.leftEnd, EdgeList.rightEnd);
- },
- createHalfEdge: function(edge, side) {
- return {
- edge: edge,
- side: side,
- vertex: null,
- l: null,
- r: null
+ if (node.R) node = node.R; else {
+ before = node;
+ break;
+ }
+ }
+ }
+ d3_geom_voronoiCircles.insert(before, circle);
+ if (!before) d3_geom_voronoiFirstCircle = circle;
+ }
+ function d3_geom_voronoiDetachCircle(arc) {
+ var circle = arc.circle;
+ if (circle) {
+ if (!circle.P) d3_geom_voronoiFirstCircle = circle.N;
+ d3_geom_voronoiCircles.remove(circle);
+ d3_geom_voronoiCirclePool.push(circle);
+ d3_geom_voronoiRedBlackNode(circle);
+ arc.circle = null;
+ }
+ }
+ function d3_geom_voronoiClipEdges(extent) {
+ var edges = d3_geom_voronoiEdges, clip = d3_geom_clipLine(extent[0][0], extent[0][1], extent[1][0], extent[1][1]), i = edges.length, e;
+ while (i--) {
+ e = edges[i];
+ if (!d3_geom_voronoiConnectEdge(e, extent) || !clip(e) || abs(e.a.x - e.b.x) < ε && abs(e.a.y - e.b.y) < ε) {
+ e.a = e.b = null;
+ edges.splice(i, 1);
+ }
+ }
+ }
+ function d3_geom_voronoiConnectEdge(edge, extent) {
+ var vb = edge.b;
+ if (vb) return true;
+ var va = edge.a, x0 = extent[0][0], x1 = extent[1][0], y0 = extent[0][1], y1 = extent[1][1], lSite = edge.l, rSite = edge.r, lx = lSite.x, ly = lSite.y, rx = rSite.x, ry = rSite.y, fx = (lx + rx) / 2, fy = (ly + ry) / 2, fm, fb;
+ if (ry === ly) {
+ if (fx < x0 || fx >= x1) return;
+ if (lx > rx) {
+ if (!va) va = {
+ x: fx,
+ y: y0
+ }; else if (va.y >= y1) return;
+ vb = {
+ x: fx,
+ y: y1
};
- },
- insert: function(lb, he) {
- he.l = lb;
- he.r = lb.r;
- lb.r.l = he;
- lb.r = he;
- },
- leftBound: function(p) {
- var he = EdgeList.leftEnd;
- do {
- he = he.r;
- } while (he != EdgeList.rightEnd && Geom.rightOf(he, p));
- he = he.l;
- return he;
- },
- del: function(he) {
- he.l.r = he.r;
- he.r.l = he.l;
- he.edge = null;
- },
- right: function(he) {
- return he.r;
- },
- left: function(he) {
- return he.l;
- },
- leftRegion: function(he) {
- return he.edge == null ? Sites.bottomSite : he.edge.region[he.side];
- },
- rightRegion: function(he) {
- return he.edge == null ? Sites.bottomSite : he.edge.region[d3_geom_voronoiOpposite[he.side]];
- }
- };
- var Geom = {
- bisect: function(s1, s2) {
- var newEdge = {
- region: {
- l: s1,
- r: s2
- },
- ep: {
- l: null,
- r: null
- }
+ } else {
+ if (!va) va = {
+ x: fx,
+ y: y1
+ }; else if (va.y < y0) return;
+ vb = {
+ x: fx,
+ y: y0
};
- var dx = s2.x - s1.x, dy = s2.y - s1.y, adx = dx > 0 ? dx : -dx, ady = dy > 0 ? dy : -dy;
- newEdge.c = s1.x * dx + s1.y * dy + (dx * dx + dy * dy) * .5;
- if (adx > ady) {
- newEdge.a = 1;
- newEdge.b = dy / dx;
- newEdge.c /= dx;
+ }
+ } else {
+ fm = (lx - rx) / (ry - ly);
+ fb = fy - fm * fx;
+ if (fm < -1 || fm > 1) {
+ if (lx > rx) {
+ if (!va) va = {
+ x: (y0 - fb) / fm,
+ y: y0
+ }; else if (va.y >= y1) return;
+ vb = {
+ x: (y1 - fb) / fm,
+ y: y1
+ };
} else {
- newEdge.b = 1;
- newEdge.a = dx / dy;
- newEdge.c /= dy;
+ if (!va) va = {
+ x: (y1 - fb) / fm,
+ y: y1
+ }; else if (va.y < y0) return;
+ vb = {
+ x: (y0 - fb) / fm,
+ y: y0
+ };
}
- return newEdge;
- },
- intersect: function(el1, el2) {
- var e1 = el1.edge, e2 = el2.edge;
- if (!e1 || !e2 || e1.region.r == e2.region.r) {
- return null;
- }
- var d = e1.a * e2.b - e1.b * e2.a;
- if (Math.abs(d) < 1e-10) {
- return null;
- }
- var xint = (e1.c * e2.b - e2.c * e1.b) / d, yint = (e2.c * e1.a - e1.c * e2.a) / d, e1r = e1.region.r, e2r = e2.region.r, el, e;
- if (e1r.y < e2r.y || e1r.y == e2r.y && e1r.x < e2r.x) {
- el = el1;
- e = e1;
+ } else {
+ if (ly < ry) {
+ if (!va) va = {
+ x: x0,
+ y: fm * x0 + fb
+ }; else if (va.x >= x1) return;
+ vb = {
+ x: x1,
+ y: fm * x1 + fb
+ };
} else {
- el = el2;
- e = e2;
- }
- var rightOfSite = xint >= e.region.r.x;
- if (rightOfSite && el.side === "l" || !rightOfSite && el.side === "r") {
- return null;
- }
- return {
- x: xint,
- y: yint
- };
- },
- rightOf: function(he, p) {
- var e = he.edge, topsite = e.region.r, rightOfSite = p.x > topsite.x;
- if (rightOfSite && he.side === "l") {
- return 1;
- }
- if (!rightOfSite && he.side === "r") {
- return 0;
+ if (!va) va = {
+ x: x1,
+ y: fm * x1 + fb
+ }; else if (va.x < x0) return;
+ vb = {
+ x: x0,
+ y: fm * x0 + fb
+ };
}
- if (e.a === 1) {
- var dyp = p.y - topsite.y, dxp = p.x - topsite.x, fast = 0, above = 0;
- if (!rightOfSite && e.b < 0 || rightOfSite && e.b >= 0) {
- above = fast = dyp >= e.b * dxp;
+ }
+ }
+ edge.a = va;
+ edge.b = vb;
+ return true;
+ }
+ function d3_geom_voronoiEdge(lSite, rSite) {
+ this.l = lSite;
+ this.r = rSite;
+ this.a = this.b = null;
+ }
+ function d3_geom_voronoiCreateEdge(lSite, rSite, va, vb) {
+ var edge = new d3_geom_voronoiEdge(lSite, rSite);
+ d3_geom_voronoiEdges.push(edge);
+ if (va) d3_geom_voronoiSetEdgeEnd(edge, lSite, rSite, va);
+ if (vb) d3_geom_voronoiSetEdgeEnd(edge, rSite, lSite, vb);
+ d3_geom_voronoiCells[lSite.i].edges.push(new d3_geom_voronoiHalfEdge(edge, lSite, rSite));
+ d3_geom_voronoiCells[rSite.i].edges.push(new d3_geom_voronoiHalfEdge(edge, rSite, lSite));
+ return edge;
+ }
+ function d3_geom_voronoiCreateBorderEdge(lSite, va, vb) {
+ var edge = new d3_geom_voronoiEdge(lSite, null);
+ edge.a = va;
+ edge.b = vb;
+ d3_geom_voronoiEdges.push(edge);
+ return edge;
+ }
+ function d3_geom_voronoiSetEdgeEnd(edge, lSite, rSite, vertex) {
+ if (!edge.a && !edge.b) {
+ edge.a = vertex;
+ edge.l = lSite;
+ edge.r = rSite;
+ } else if (edge.l === rSite) {
+ edge.b = vertex;
+ } else {
+ edge.a = vertex;
+ }
+ }
+ function d3_geom_voronoiHalfEdge(edge, lSite, rSite) {
+ var va = edge.a, vb = edge.b;
+ this.edge = edge;
+ this.site = lSite;
+ this.angle = rSite ? Math.atan2(rSite.y - lSite.y, rSite.x - lSite.x) : edge.l === lSite ? Math.atan2(vb.x - va.x, va.y - vb.y) : Math.atan2(va.x - vb.x, vb.y - va.y);
+ }
+ d3_geom_voronoiHalfEdge.prototype = {
+ start: function() {
+ return this.edge.l === this.site ? this.edge.a : this.edge.b;
+ },
+ end: function() {
+ return this.edge.l === this.site ? this.edge.b : this.edge.a;
+ }
+ };
+ function d3_geom_voronoiRedBlackTree() {
+ this._ = null;
+ }
+ function d3_geom_voronoiRedBlackNode(node) {
+ node.U = node.C = node.L = node.R = node.P = node.N = null;
+ }
+ d3_geom_voronoiRedBlackTree.prototype = {
+ insert: function(after, node) {
+ var parent, grandpa, uncle;
+ if (after) {
+ node.P = after;
+ node.N = after.N;
+ if (after.N) after.N.P = node;
+ after.N = node;
+ if (after.R) {
+ after = after.R;
+ while (after.L) after = after.L;
+ after.L = node;
+ } else {
+ after.R = node;
+ }
+ parent = after;
+ } else if (this._) {
+ after = d3_geom_voronoiRedBlackFirst(this._);
+ node.P = null;
+ node.N = after;
+ after.P = after.L = node;
+ parent = after;
+ } else {
+ node.P = node.N = null;
+ this._ = node;
+ parent = null;
+ }
+ node.L = node.R = null;
+ node.U = parent;
+ node.C = true;
+ after = node;
+ while (parent && parent.C) {
+ grandpa = parent.U;
+ if (parent === grandpa.L) {
+ uncle = grandpa.R;
+ if (uncle && uncle.C) {
+ parent.C = uncle.C = false;
+ grandpa.C = true;
+ after = grandpa;
} else {
- above = p.x + p.y * e.b > e.c;
- if (e.b < 0) {
- above = !above;
- }
- if (!above) {
- fast = 1;
+ if (after === parent.R) {
+ d3_geom_voronoiRedBlackRotateLeft(this, parent);
+ after = parent;
+ parent = after.U;
}
+ parent.C = false;
+ grandpa.C = true;
+ d3_geom_voronoiRedBlackRotateRight(this, grandpa);
}
- if (!fast) {
- var dxs = topsite.x - e.region.l.x;
- above = e.b * (dxp * dxp - dyp * dyp) < dxs * dyp * (1 + 2 * dxp / dxs + e.b * e.b);
- if (e.b < 0) {
- above = !above;
+ } else {
+ uncle = grandpa.L;
+ if (uncle && uncle.C) {
+ parent.C = uncle.C = false;
+ grandpa.C = true;
+ after = grandpa;
+ } else {
+ if (after === parent.L) {
+ d3_geom_voronoiRedBlackRotateRight(this, parent);
+ after = parent;
+ parent = after.U;
}
+ parent.C = false;
+ grandpa.C = true;
+ d3_geom_voronoiRedBlackRotateLeft(this, grandpa);
}
+ }
+ parent = after.U;
+ }
+ this._.C = false;
+ },
+ remove: function(node) {
+ if (node.N) node.N.P = node.P;
+ if (node.P) node.P.N = node.N;
+ node.N = node.P = null;
+ var parent = node.U, sibling, left = node.L, right = node.R, next, red;
+ if (!left) next = right; else if (!right) next = left; else next = d3_geom_voronoiRedBlackFirst(right);
+ if (parent) {
+ if (parent.L === node) parent.L = next; else parent.R = next;
+ } else {
+ this._ = next;
+ }
+ if (left && right) {
+ red = next.C;
+ next.C = node.C;
+ next.L = left;
+ left.U = next;
+ if (next !== right) {
+ parent = next.U;
+ next.U = node.U;
+ node = next.R;
+ parent.L = node;
+ next.R = right;
+ right.U = next;
} else {
- var yl = e.c - e.a * p.x, t1 = p.y - yl, t2 = p.x - topsite.x, t3 = yl - topsite.y;
- above = t1 * t1 > t2 * t2 + t3 * t3;
+ next.U = parent;
+ parent = next;
+ node = next.R;
}
- return he.side === "l" ? above : !above;
- },
- endPoint: function(edge, side, site) {
- edge.ep[side] = site;
- if (!edge.ep[d3_geom_voronoiOpposite[side]]) return;
- callback(edge);
- },
- distance: function(s, t) {
- var dx = s.x - t.x, dy = s.y - t.y;
- return Math.sqrt(dx * dx + dy * dy);
- }
- };
- var EventQueue = {
- list: [],
- insert: function(he, site, offset) {
- he.vertex = site;
- he.ystar = site.y + offset;
- for (var i = 0, list = EventQueue.list, l = list.length; i < l; i++) {
- var next = list[i];
- if (he.ystar > next.ystar || he.ystar == next.ystar && site.x > next.vertex.x) {
- continue;
- } else {
+ } else {
+ red = node.C;
+ node = next;
+ }
+ if (node) node.U = parent;
+ if (red) return;
+ if (node && node.C) {
+ node.C = false;
+ return;
+ }
+ do {
+ if (node === this._) break;
+ if (node === parent.L) {
+ sibling = parent.R;
+ if (sibling.C) {
+ sibling.C = false;
+ parent.C = true;
+ d3_geom_voronoiRedBlackRotateLeft(this, parent);
+ sibling = parent.R;
+ }
+ if (sibling.L && sibling.L.C || sibling.R && sibling.R.C) {
+ if (!sibling.R || !sibling.R.C) {
+ sibling.L.C = false;
+ sibling.C = true;
+ d3_geom_voronoiRedBlackRotateRight(this, sibling);
+ sibling = parent.R;
+ }
+ sibling.C = parent.C;
+ parent.C = sibling.R.C = false;
+ d3_geom_voronoiRedBlackRotateLeft(this, parent);
+ node = this._;
+ break;
+ }
+ } else {
+ sibling = parent.L;
+ if (sibling.C) {
+ sibling.C = false;
+ parent.C = true;
+ d3_geom_voronoiRedBlackRotateRight(this, parent);
+ sibling = parent.L;
+ }
+ if (sibling.L && sibling.L.C || sibling.R && sibling.R.C) {
+ if (!sibling.L || !sibling.L.C) {
+ sibling.R.C = false;
+ sibling.C = true;
+ d3_geom_voronoiRedBlackRotateLeft(this, sibling);
+ sibling = parent.L;
+ }
+ sibling.C = parent.C;
+ parent.C = sibling.L.C = false;
+ d3_geom_voronoiRedBlackRotateRight(this, parent);
+ node = this._;
break;
}
}
- list.splice(i, 0, he);
- },
- del: function(he) {
- for (var i = 0, ls = EventQueue.list, l = ls.length; i < l && ls[i] != he; ++i) {}
- ls.splice(i, 1);
- },
- empty: function() {
- return EventQueue.list.length === 0;
- },
- nextEvent: function(he) {
- for (var i = 0, ls = EventQueue.list, l = ls.length; i < l; ++i) {
- if (ls[i] == he) return ls[i + 1];
- }
- return null;
- },
- min: function() {
- var elem = EventQueue.list[0];
- return {
- x: elem.vertex.x,
- y: elem.ystar
- };
- },
- extractMin: function() {
- return EventQueue.list.shift();
- }
- };
- EdgeList.init();
- Sites.bottomSite = Sites.list.shift();
- var newSite = Sites.list.shift(), newIntStar;
- var lbnd, rbnd, llbnd, rrbnd, bisector;
- var bot, top, temp, p, v;
- var e, pm;
+ sibling.C = true;
+ node = parent;
+ parent = parent.U;
+ } while (!node.C);
+ if (node) node.C = false;
+ }
+ };
+ function d3_geom_voronoiRedBlackRotateLeft(tree, node) {
+ var p = node, q = node.R, parent = p.U;
+ if (parent) {
+ if (parent.L === p) parent.L = q; else parent.R = q;
+ } else {
+ tree._ = q;
+ }
+ q.U = parent;
+ p.U = q;
+ p.R = q.L;
+ if (p.R) p.R.U = p;
+ q.L = p;
+ }
+ function d3_geom_voronoiRedBlackRotateRight(tree, node) {
+ var p = node, q = node.L, parent = p.U;
+ if (parent) {
+ if (parent.L === p) parent.L = q; else parent.R = q;
+ } else {
+ tree._ = q;
+ }
+ q.U = parent;
+ p.U = q;
+ p.L = q.R;
+ if (p.L) p.L.U = p;
+ q.R = p;
+ }
+ function d3_geom_voronoiRedBlackFirst(node) {
+ while (node.L) node = node.L;
+ return node;
+ }
+ function d3_geom_voronoi(sites, bbox) {
+ var site = sites.sort(d3_geom_voronoiVertexOrder).pop(), x0, y0, circle;
+ d3_geom_voronoiEdges = [];
+ d3_geom_voronoiCells = new Array(sites.length);
+ d3_geom_voronoiBeaches = new d3_geom_voronoiRedBlackTree();
+ d3_geom_voronoiCircles = new d3_geom_voronoiRedBlackTree();
while (true) {
- if (!EventQueue.empty()) {
- newIntStar = EventQueue.min();
- }
- if (newSite && (EventQueue.empty() || newSite.y < newIntStar.y || newSite.y == newIntStar.y && newSite.x < newIntStar.x)) {
- lbnd = EdgeList.leftBound(newSite);
- rbnd = EdgeList.right(lbnd);
- bot = EdgeList.rightRegion(lbnd);
- e = Geom.bisect(bot, newSite);
- bisector = EdgeList.createHalfEdge(e, "l");
- EdgeList.insert(lbnd, bisector);
- p = Geom.intersect(lbnd, bisector);
- if (p) {
- EventQueue.del(lbnd);
- EventQueue.insert(lbnd, p, Geom.distance(p, newSite));
- }
- lbnd = bisector;
- bisector = EdgeList.createHalfEdge(e, "r");
- EdgeList.insert(lbnd, bisector);
- p = Geom.intersect(bisector, rbnd);
- if (p) {
- EventQueue.insert(bisector, p, Geom.distance(p, newSite));
- }
- newSite = Sites.list.shift();
- } else if (!EventQueue.empty()) {
- lbnd = EventQueue.extractMin();
- llbnd = EdgeList.left(lbnd);
- rbnd = EdgeList.right(lbnd);
- rrbnd = EdgeList.right(rbnd);
- bot = EdgeList.leftRegion(lbnd);
- top = EdgeList.rightRegion(rbnd);
- v = lbnd.vertex;
- Geom.endPoint(lbnd.edge, lbnd.side, v);
- Geom.endPoint(rbnd.edge, rbnd.side, v);
- EdgeList.del(lbnd);
- EventQueue.del(rbnd);
- EdgeList.del(rbnd);
- pm = "l";
- if (bot.y > top.y) {
- temp = bot;
- bot = top;
- top = temp;
- pm = "r";
- }
- e = Geom.bisect(bot, top);
- bisector = EdgeList.createHalfEdge(e, pm);
- EdgeList.insert(llbnd, bisector);
- Geom.endPoint(e, d3_geom_voronoiOpposite[pm], v);
- p = Geom.intersect(llbnd, bisector);
- if (p) {
- EventQueue.del(llbnd);
- EventQueue.insert(llbnd, p, Geom.distance(p, bot));
- }
- p = Geom.intersect(bisector, rrbnd);
- if (p) {
- EventQueue.insert(bisector, p, Geom.distance(p, bot));
- }
+ circle = d3_geom_voronoiFirstCircle;
+ if (site && (!circle || site.y < circle.y || site.y === circle.y && site.x < circle.x)) {
+ if (site.x !== x0 || site.y !== y0) {
+ d3_geom_voronoiCells[site.i] = new d3_geom_voronoiCell(site);
+ d3_geom_voronoiAddBeach(site);
+ x0 = site.x, y0 = site.y;
+ }
+ site = sites.pop();
+ } else if (circle) {
+ d3_geom_voronoiRemoveBeach(circle.arc);
} else {
break;
}
}
- for (lbnd = EdgeList.right(EdgeList.leftEnd); lbnd != EdgeList.rightEnd; lbnd = EdgeList.right(lbnd)) {
- callback(lbnd.edge);
+ if (bbox) d3_geom_voronoiClipEdges(bbox), d3_geom_voronoiCloseCells(bbox);
+ var diagram = {
+ cells: d3_geom_voronoiCells,
+ edges: d3_geom_voronoiEdges
+ };
+ d3_geom_voronoiBeaches = d3_geom_voronoiCircles = d3_geom_voronoiEdges = d3_geom_voronoiCells = null;
+ return diagram;
+ }
+ function d3_geom_voronoiVertexOrder(a, b) {
+ return b.y - a.y || b.x - a.x;
+ }
+ d3.geom.voronoi = function(points) {
+ var x = d3_geom_pointX, y = d3_geom_pointY, fx = x, fy = y, clipExtent = d3_geom_voronoiClipExtent;
+ if (points) return voronoi(points);
+ function voronoi(data) {
+ var polygons = new Array(data.length), x0 = clipExtent[0][0], y0 = clipExtent[0][1], x1 = clipExtent[1][0], y1 = clipExtent[1][1];
+ d3_geom_voronoi(sites(data), clipExtent).cells.forEach(function(cell, i) {
+ var edges = cell.edges, site = cell.site, polygon = polygons[i] = edges.length ? edges.map(function(e) {
+ var s = e.start();
+ return [ s.x, s.y ];
+ }) : site.x >= x0 && site.x <= x1 && site.y >= y0 && site.y <= y1 ? [ [ x0, y1 ], [ x1, y1 ], [ x1, y0 ], [ x0, y0 ] ] : [];
+ polygon.point = data[i];
+ });
+ return polygons;
+ }
+ function sites(data) {
+ return data.map(function(d, i) {
+ return {
+ x: Math.round(fx(d, i) / ε) * ε,
+ y: Math.round(fy(d, i) / ε) * ε,
+ i: i
+ };
+ });
}
+ voronoi.links = function(data) {
+ return d3_geom_voronoi(sites(data)).edges.filter(function(edge) {
+ return edge.l && edge.r;
+ }).map(function(edge) {
+ return {
+ source: data[edge.l.i],
+ target: data[edge.r.i]
+ };
+ });
+ };
+ voronoi.triangles = function(data) {
+ var triangles = [];
+ d3_geom_voronoi(sites(data)).cells.forEach(function(cell, i) {
+ var site = cell.site, edges = cell.edges.sort(d3_geom_voronoiHalfEdgeOrder), j = -1, m = edges.length, e0, s0, e1 = edges[m - 1].edge, s1 = e1.l === site ? e1.r : e1.l;
+ while (++j < m) {
+ e0 = e1;
+ s0 = s1;
+ e1 = edges[j].edge;
+ s1 = e1.l === site ? e1.r : e1.l;
+ if (i < s0.i && i < s1.i && d3_geom_voronoiTriangleArea(site, s0, s1) < 0) {
+ triangles.push([ data[i], data[s0.i], data[s1.i] ]);
+ }
+ }
+ });
+ return triangles;
+ };
+ voronoi.x = function(_) {
+ return arguments.length ? (fx = d3_functor(x = _), voronoi) : x;
+ };
+ voronoi.y = function(_) {
+ return arguments.length ? (fy = d3_functor(y = _), voronoi) : y;
+ };
+ voronoi.clipExtent = function(_) {
+ if (!arguments.length) return clipExtent === d3_geom_voronoiClipExtent ? null : clipExtent;
+ clipExtent = _ == null ? d3_geom_voronoiClipExtent : _;
+ return voronoi;
+ };
+ voronoi.size = function(_) {
+ if (!arguments.length) return clipExtent === d3_geom_voronoiClipExtent ? null : clipExtent && clipExtent[1];
+ return voronoi.clipExtent(_ && [ [ 0, 0 ], _ ]);
+ };
+ return voronoi;
+ };
+ var d3_geom_voronoiClipExtent = [ [ -1e6, -1e6 ], [ 1e6, 1e6 ] ];
+ function d3_geom_voronoiTriangleArea(a, b, c) {
+ return (a.x - c.x) * (b.y - a.y) - (a.x - b.x) * (c.y - a.y);
}
+ d3.geom.delaunay = function(vertices) {
+ return d3.geom.voronoi().triangles(vertices);
+ };
d3.geom.quadtree = function(points, x1, y1, x2, y2) {
- var x = d3_svg_lineX, y = d3_svg_lineY, compat;
+ var x = d3_geom_pointX, y = d3_geom_pointY, compat;
if (compat = arguments.length) {
x = d3_geom_quadtreeCompatX;
y = d3_geom_quadtreeCompatY;
@@ -4544,7 +5584,7 @@ d3 = function() {
if (n.leaf) {
var nx = n.x, ny = n.y;
if (nx != null) {
- if (Math.abs(nx - x) + Math.abs(ny - y) < .01) {
+ if (abs(nx - x) + abs(ny - y) < .01) {
insertChild(n, d, x, y, x1, y1, x2, y2);
} else {
var nPoint = n.point;
@@ -4560,11 +5600,11 @@ d3 = function() {
}
}
function insertChild(n, d, x, y, x1, y1, x2, y2) {
- var sx = (x1 + x2) * .5, sy = (y1 + y2) * .5, right = x >= sx, bottom = y >= sy, i = (bottom << 1) + right;
+ var xm = (x1 + x2) * .5, ym = (y1 + y2) * .5, right = x >= xm, below = y >= ym, i = below << 1 | right;
n.leaf = false;
n = n.nodes[i] || (n.nodes[i] = d3_geom_quadtreeNode());
- if (right) x1 = sx; else x2 = sx;
- if (bottom) y1 = sy; else y2 = sy;
+ if (right) x1 = xm; else x2 = xm;
+ if (below) y1 = ym; else y2 = ym;
insert(n, d, x, y, x1, y1, x2, y2);
}
var root = d3_geom_quadtreeNode();
@@ -4574,6 +5614,9 @@ d3 = function() {
root.visit = function(f) {
d3_geom_quadtreeVisit(f, root, x1_, y1_, x2_, y2_);
};
+ root.find = function(point) {
+ return d3_geom_quadtreeFind(root, point[0], point[1], x1_, y1_, x2_, y2_);
+ };
i = -1;
if (x1 == null) {
while (++i < n) {
@@ -4590,14 +5633,15 @@ d3 = function() {
quadtree.y = function(_) {
return arguments.length ? (y = _, quadtree) : y;
};
+ quadtree.extent = function(_) {
+ if (!arguments.length) return x1 == null ? null : [ [ x1, y1 ], [ x2, y2 ] ];
+ if (_ == null) x1 = y1 = x2 = y2 = null; else x1 = +_[0][0], y1 = +_[0][1], x2 = +_[1][0],
+ y2 = +_[1][1];
+ return quadtree;
+ };
quadtree.size = function(_) {
- if (!arguments.length) return x1 == null ? null : [ x2, y2 ];
- if (_ == null) {
- x1 = y1 = x2 = y2 = null;
- } else {
- x1 = y1 = 0;
- x2 = +_[0], y2 = +_[1];
- }
+ if (!arguments.length) return x1 == null ? null : [ x2 - x1, y2 - y1 ];
+ if (_ == null) x1 = y1 = x2 = y2 = null; else x1 = y1 = 0, x2 = +_[0], y2 = +_[1];
return quadtree;
};
return quadtree;
@@ -4626,6 +5670,42 @@ d3 = function() {
if (children[3]) d3_geom_quadtreeVisit(f, children[3], sx, sy, x2, y2);
}
}
+ function d3_geom_quadtreeFind(root, x, y, x0, y0, x3, y3) {
+ var minDistance2 = Infinity, closestPoint;
+ (function find(node, x1, y1, x2, y2) {
+ if (x1 > x3 || y1 > y3 || x2 < x0 || y2 < y0) return;
+ if (point = node.point) {
+ var point, dx = x - node.x, dy = y - node.y, distance2 = dx * dx + dy * dy;
+ if (distance2 < minDistance2) {
+ var distance = Math.sqrt(minDistance2 = distance2);
+ x0 = x - distance, y0 = y - distance;
+ x3 = x + distance, y3 = y + distance;
+ closestPoint = point;
+ }
+ }
+ var children = node.nodes, xm = (x1 + x2) * .5, ym = (y1 + y2) * .5, right = x >= xm, below = y >= ym;
+ for (var i = below << 1 | right, j = i + 4; i < j; ++i) {
+ if (node = children[i & 3]) switch (i & 3) {
+ case 0:
+ find(node, x1, y1, xm, ym);
+ break;
+
+ case 1:
+ find(node, xm, y1, x2, ym);
+ break;
+
+ case 2:
+ find(node, x1, ym, xm, y2);
+ break;
+
+ case 3:
+ find(node, xm, ym, x2, y2);
+ break;
+ }
+ }
+ })(root, x0, y0, x3, y3);
+ return closestPoint;
+ }
d3.interpolateRgb = d3_interpolateRgb;
function d3_interpolateRgb(a, b) {
a = d3.rgb(a);
@@ -4635,120 +5715,12 @@ d3 = function() {
return "#" + d3_rgb_hex(Math.round(ar + br * t)) + d3_rgb_hex(Math.round(ag + bg * t)) + d3_rgb_hex(Math.round(ab + bb * t));
};
}
- d3.transform = function(string) {
- var g = d3_document.createElementNS(d3.ns.prefix.svg, "g");
- return (d3.transform = function(string) {
- g.setAttribute("transform", string);
- var t = g.transform.baseVal.consolidate();
- return new d3_transform(t ? t.matrix : d3_transformIdentity);
- })(string);
- };
- function d3_transform(m) {
- var r0 = [ m.a, m.b ], r1 = [ m.c, m.d ], kx = d3_transformNormalize(r0), kz = d3_transformDot(r0, r1), ky = d3_transformNormalize(d3_transformCombine(r1, r0, -kz)) || 0;
- if (r0[0] * r1[1] < r1[0] * r0[1]) {
- r0[0] *= -1;
- r0[1] *= -1;
- kx *= -1;
- kz *= -1;
- }
- this.rotate = (kx ? Math.atan2(r0[1], r0[0]) : Math.atan2(-r1[0], r1[1])) * d3_degrees;
- this.translate = [ m.e, m.f ];
- this.scale = [ kx, ky ];
- this.skew = ky ? Math.atan2(kz, ky) * d3_degrees : 0;
- }
- d3_transform.prototype.toString = function() {
- return "translate(" + this.translate + ")rotate(" + this.rotate + ")skewX(" + this.skew + ")scale(" + this.scale + ")";
- };
- function d3_transformDot(a, b) {
- return a[0] * b[0] + a[1] * b[1];
- }
- function d3_transformNormalize(a) {
- var k = Math.sqrt(d3_transformDot(a, a));
- if (k) {
- a[0] /= k;
- a[1] /= k;
- }
- return k;
- }
- function d3_transformCombine(a, b, k) {
- a[0] += k * b[0];
- a[1] += k * b[1];
- return a;
- }
- var d3_transformIdentity = {
- a: 1,
- b: 0,
- c: 0,
- d: 1,
- e: 0,
- f: 0
- };
- d3.interpolateNumber = d3_interpolateNumber;
- function d3_interpolateNumber(a, b) {
- b -= a = +a;
- return function(t) {
- return a + b * t;
- };
- }
- d3.interpolateTransform = d3_interpolateTransform;
- function d3_interpolateTransform(a, b) {
- var s = [], q = [], n, A = d3.transform(a), B = d3.transform(b), ta = A.translate, tb = B.translate, ra = A.rotate, rb = B.rotate, wa = A.skew, wb = B.skew, ka = A.scale, kb = B.scale;
- if (ta[0] != tb[0] || ta[1] != tb[1]) {
- s.push("translate(", null, ",", null, ")");
- q.push({
- i: 1,
- x: d3_interpolateNumber(ta[0], tb[0])
- }, {
- i: 3,
- x: d3_interpolateNumber(ta[1], tb[1])
- });
- } else if (tb[0] || tb[1]) {
- s.push("translate(" + tb + ")");
- } else {
- s.push("");
- }
- if (ra != rb) {
- if (ra - rb > 180) rb += 360; else if (rb - ra > 180) ra += 360;
- q.push({
- i: s.push(s.pop() + "rotate(", null, ")") - 2,
- x: d3_interpolateNumber(ra, rb)
- });
- } else if (rb) {
- s.push(s.pop() + "rotate(" + rb + ")");
- }
- if (wa != wb) {
- q.push({
- i: s.push(s.pop() + "skewX(", null, ")") - 2,
- x: d3_interpolateNumber(wa, wb)
- });
- } else if (wb) {
- s.push(s.pop() + "skewX(" + wb + ")");
- }
- if (ka[0] != kb[0] || ka[1] != kb[1]) {
- n = s.push(s.pop() + "scale(", null, ",", null, ")");
- q.push({
- i: n - 4,
- x: d3_interpolateNumber(ka[0], kb[0])
- }, {
- i: n - 2,
- x: d3_interpolateNumber(ka[1], kb[1])
- });
- } else if (kb[0] != 1 || kb[1] != 1) {
- s.push(s.pop() + "scale(" + kb + ")");
- }
- n = q.length;
- return function(t) {
- var i = -1, o;
- while (++i < n) s[(o = q[i]).i] = o.x(t);
- return s.join("");
- };
- }
d3.interpolateObject = d3_interpolateObject;
function d3_interpolateObject(a, b) {
var i = {}, c = {}, k;
for (k in a) {
if (k in b) {
- i[k] = d3_interpolateByName(k)(a[k], b[k]);
+ i[k] = d3_interpolate(a[k], b[k]);
} else {
c[k] = a[k];
}
@@ -4763,83 +5735,56 @@ d3 = function() {
return c;
};
}
+ d3.interpolateNumber = d3_interpolateNumber;
+ function d3_interpolateNumber(a, b) {
+ a = +a, b = +b;
+ return function(t) {
+ return a * (1 - t) + b * t;
+ };
+ }
d3.interpolateString = d3_interpolateString;
function d3_interpolateString(a, b) {
- var m, i, j, s0 = 0, s1 = 0, s = [], q = [], n, o;
+ var bi = d3_interpolate_numberA.lastIndex = d3_interpolate_numberB.lastIndex = 0, am, bm, bs, i = -1, s = [], q = [];
a = a + "", b = b + "";
- d3_interpolate_number.lastIndex = 0;
- for (i = 0; m = d3_interpolate_number.exec(b); ++i) {
- if (m.index) s.push(b.substring(s0, s1 = m.index));
- q.push({
- i: s.length,
- x: m[0]
- });
- s.push(null);
- s0 = d3_interpolate_number.lastIndex;
- }
- if (s0 < b.length) s.push(b.substring(s0));
- for (i = 0, n = q.length; (m = d3_interpolate_number.exec(a)) && i < n; ++i) {
- o = q[i];
- if (o.x == m[0]) {
- if (o.i) {
- if (s[o.i + 1] == null) {
- s[o.i - 1] += o.x;
- s.splice(o.i, 1);
- for (j = i + 1; j < n; ++j) q[j].i--;
- } else {
- s[o.i - 1] += o.x + s[o.i + 1];
- s.splice(o.i, 2);
- for (j = i + 1; j < n; ++j) q[j].i -= 2;
- }
- } else {
- if (s[o.i + 1] == null) {
- s[o.i] = o.x;
- } else {
- s[o.i] = o.x + s[o.i + 1];
- s.splice(o.i + 1, 1);
- for (j = i + 1; j < n; ++j) q[j].i--;
- }
- }
- q.splice(i, 1);
- n--;
- i--;
- } else {
- o.x = d3_interpolateNumber(parseFloat(m[0]), parseFloat(o.x));
+ while ((am = d3_interpolate_numberA.exec(a)) && (bm = d3_interpolate_numberB.exec(b))) {
+ if ((bs = bm.index) > bi) {
+ bs = b.slice(bi, bs);
+ if (s[i]) s[i] += bs; else s[++i] = bs;
}
- }
- while (i < n) {
- o = q.pop();
- if (s[o.i + 1] == null) {
- s[o.i] = o.x;
+ if ((am = am[0]) === (bm = bm[0])) {
+ if (s[i]) s[i] += bm; else s[++i] = bm;
} else {
- s[o.i] = o.x + s[o.i + 1];
- s.splice(o.i + 1, 1);
+ s[++i] = null;
+ q.push({
+ i: i,
+ x: d3_interpolateNumber(am, bm)
+ });
}
- n--;
+ bi = d3_interpolate_numberB.lastIndex;
}
- if (s.length === 1) {
- return s[0] == null ? q[0].x : function() {
- return b;
- };
+ if (bi < b.length) {
+ bs = b.slice(bi);
+ if (s[i]) s[i] += bs; else s[++i] = bs;
}
- return function(t) {
- for (i = 0; i < n; ++i) s[(o = q[i]).i] = o.x(t);
+ return s.length < 2 ? q[0] ? (b = q[0].x, function(t) {
+ return b(t) + "";
+ }) : function() {
+ return b;
+ } : (b = q.length, function(t) {
+ for (var i = 0, o; i < b; ++i) s[(o = q[i]).i] = o.x(t);
return s.join("");
- };
+ });
}
- var d3_interpolate_number = /[-+]?(?:\d+\.?\d*|\.?\d+)(?:[eE][-+]?\d+)?/g;
+ var d3_interpolate_numberA = /[-+]?(?:\d+\.?\d*|\.?\d+)(?:[eE][-+]?\d+)?/g, d3_interpolate_numberB = new RegExp(d3_interpolate_numberA.source, "g");
d3.interpolate = d3_interpolate;
function d3_interpolate(a, b) {
var i = d3.interpolators.length, f;
while (--i >= 0 && !(f = d3.interpolators[i](a, b))) ;
return f;
}
- function d3_interpolateByName(name) {
- return name == "transform" ? d3_interpolateTransform : d3_interpolate;
- }
d3.interpolators = [ function(a, b) {
var t = typeof b;
- return (t === "string" || t !== typeof a ? d3_rgb_names.has(b) || /^(#|rgb\(|hsl\()/.test(b) ? d3_interpolateRgb : d3_interpolateString : b instanceof d3_Color ? d3_interpolateRgb : t === "object" ? Array.isArray(b) ? d3_interpolateArray : d3_interpolateObject : d3_interpolateNumber)(a, b);
+ return (t === "string" ? d3_rgb_names.has(b.toLowerCase()) || /^(#|rgb\(|hsl\()/i.test(b) ? d3_interpolateRgb : d3_interpolateString : b instanceof d3_color ? d3_interpolateRgb : Array.isArray(b) ? d3_interpolateArray : t === "object" && isNaN(b) ? d3_interpolateObject : d3_interpolateNumber)(a, b);
} ];
d3.interpolateArray = d3_interpolateArray;
function d3_interpolateArray(a, b) {
@@ -4888,10 +5833,10 @@ d3 = function() {
}
});
d3.ease = function(name) {
- var i = name.indexOf("-"), t = i >= 0 ? name.substring(0, i) : name, m = i >= 0 ? name.substring(i + 1) : "in";
+ var i = name.indexOf("-"), t = i >= 0 ? name.slice(0, i) : name, m = i >= 0 ? name.slice(i + 1) : "in";
t = d3_ease.get(t) || d3_ease_default;
m = d3_ease_mode.get(m) || d3_identity;
- return d3_ease_clamp(m(t.apply(null, Array.prototype.slice.call(arguments, 1))));
+ return d3_ease_clamp(m(t.apply(null, d3_arraySlice.call(arguments, 1))));
};
function d3_ease_clamp(f) {
return function(t) {
@@ -4926,7 +5871,7 @@ d3 = function() {
};
}
function d3_ease_sin(t) {
- return 1 - Math.cos(t * π / 2);
+ return 1 - Math.cos(t * halfπ);
}
function d3_ease_exp(t) {
return Math.pow(2, 10 * (t - 1));
@@ -4937,9 +5882,9 @@ d3 = function() {
function d3_ease_elastic(a, p) {
var s;
if (arguments.length < 2) p = .45;
- if (arguments.length) s = p / (2 * π) * Math.asin(1 / a); else a = 1, s = p / 4;
+ if (arguments.length) s = p / τ * Math.asin(1 / a); else a = 1, s = p / 4;
return function(t) {
- return 1 + a * Math.pow(2, 10 * -t) * Math.sin((t - s) * 2 * π / p);
+ return 1 + a * Math.pow(2, -10 * t) * Math.sin((t - s) * τ / p);
};
}
function d3_ease_back(s) {
@@ -4956,7 +5901,8 @@ d3 = function() {
a = d3.hcl(a);
b = d3.hcl(b);
var ah = a.h, ac = a.c, al = a.l, bh = b.h - ah, bc = b.c - ac, bl = b.l - al;
- if (bh > 180) bh -= 360; else if (bh < -180) bh += 360;
+ if (isNaN(bc)) bc = 0, ac = isNaN(ac) ? b.c : ac;
+ if (isNaN(bh)) bh = 0, ah = isNaN(ah) ? b.h : ah; else if (bh > 180) bh -= 360; else if (bh < -180) bh += 360;
return function(t) {
return d3_hcl_lab(ah + bh * t, ac + bc * t, al + bl * t) + "";
};
@@ -4965,10 +5911,11 @@ d3 = function() {
function d3_interpolateHsl(a, b) {
a = d3.hsl(a);
b = d3.hsl(b);
- var h0 = a.h, s0 = a.s, l0 = a.l, h1 = b.h - h0, s1 = b.s - s0, l1 = b.l - l0;
- if (h1 > 180) h1 -= 360; else if (h1 < -180) h1 += 360;
+ var ah = a.h, as = a.s, al = a.l, bh = b.h - ah, bs = b.s - as, bl = b.l - al;
+ if (isNaN(bs)) bs = 0, as = isNaN(as) ? b.s : as;
+ if (isNaN(bh)) bh = 0, ah = isNaN(ah) ? b.h : ah; else if (bh > 180) bh -= 360; else if (bh < -180) bh += 360;
return function(t) {
- return d3_hsl_rgb(h0 + h1 * t, s0 + s1 * t, l0 + l1 * t) + "";
+ return d3_hsl_rgb(ah + bh * t, as + bs * t, al + bl * t) + "";
};
}
d3.interpolateLab = d3_interpolateLab;
@@ -4987,16 +5934,119 @@ d3 = function() {
return Math.round(a + b * t);
};
}
+ d3.transform = function(string) {
+ var g = d3_document.createElementNS(d3.ns.prefix.svg, "g");
+ return (d3.transform = function(string) {
+ if (string != null) {
+ g.setAttribute("transform", string);
+ var t = g.transform.baseVal.consolidate();
+ }
+ return new d3_transform(t ? t.matrix : d3_transformIdentity);
+ })(string);
+ };
+ function d3_transform(m) {
+ var r0 = [ m.a, m.b ], r1 = [ m.c, m.d ], kx = d3_transformNormalize(r0), kz = d3_transformDot(r0, r1), ky = d3_transformNormalize(d3_transformCombine(r1, r0, -kz)) || 0;
+ if (r0[0] * r1[1] < r1[0] * r0[1]) {
+ r0[0] *= -1;
+ r0[1] *= -1;
+ kx *= -1;
+ kz *= -1;
+ }
+ this.rotate = (kx ? Math.atan2(r0[1], r0[0]) : Math.atan2(-r1[0], r1[1])) * d3_degrees;
+ this.translate = [ m.e, m.f ];
+ this.scale = [ kx, ky ];
+ this.skew = ky ? Math.atan2(kz, ky) * d3_degrees : 0;
+ }
+ d3_transform.prototype.toString = function() {
+ return "translate(" + this.translate + ")rotate(" + this.rotate + ")skewX(" + this.skew + ")scale(" + this.scale + ")";
+ };
+ function d3_transformDot(a, b) {
+ return a[0] * b[0] + a[1] * b[1];
+ }
+ function d3_transformNormalize(a) {
+ var k = Math.sqrt(d3_transformDot(a, a));
+ if (k) {
+ a[0] /= k;
+ a[1] /= k;
+ }
+ return k;
+ }
+ function d3_transformCombine(a, b, k) {
+ a[0] += k * b[0];
+ a[1] += k * b[1];
+ return a;
+ }
+ var d3_transformIdentity = {
+ a: 1,
+ b: 0,
+ c: 0,
+ d: 1,
+ e: 0,
+ f: 0
+ };
+ d3.interpolateTransform = d3_interpolateTransform;
+ function d3_interpolateTransform(a, b) {
+ var s = [], q = [], n, A = d3.transform(a), B = d3.transform(b), ta = A.translate, tb = B.translate, ra = A.rotate, rb = B.rotate, wa = A.skew, wb = B.skew, ka = A.scale, kb = B.scale;
+ if (ta[0] != tb[0] || ta[1] != tb[1]) {
+ s.push("translate(", null, ",", null, ")");
+ q.push({
+ i: 1,
+ x: d3_interpolateNumber(ta[0], tb[0])
+ }, {
+ i: 3,
+ x: d3_interpolateNumber(ta[1], tb[1])
+ });
+ } else if (tb[0] || tb[1]) {
+ s.push("translate(" + tb + ")");
+ } else {
+ s.push("");
+ }
+ if (ra != rb) {
+ if (ra - rb > 180) rb += 360; else if (rb - ra > 180) ra += 360;
+ q.push({
+ i: s.push(s.pop() + "rotate(", null, ")") - 2,
+ x: d3_interpolateNumber(ra, rb)
+ });
+ } else if (rb) {
+ s.push(s.pop() + "rotate(" + rb + ")");
+ }
+ if (wa != wb) {
+ q.push({
+ i: s.push(s.pop() + "skewX(", null, ")") - 2,
+ x: d3_interpolateNumber(wa, wb)
+ });
+ } else if (wb) {
+ s.push(s.pop() + "skewX(" + wb + ")");
+ }
+ if (ka[0] != kb[0] || ka[1] != kb[1]) {
+ n = s.push(s.pop() + "scale(", null, ",", null, ")");
+ q.push({
+ i: n - 4,
+ x: d3_interpolateNumber(ka[0], kb[0])
+ }, {
+ i: n - 2,
+ x: d3_interpolateNumber(ka[1], kb[1])
+ });
+ } else if (kb[0] != 1 || kb[1] != 1) {
+ s.push(s.pop() + "scale(" + kb + ")");
+ }
+ n = q.length;
+ return function(t) {
+ var i = -1, o;
+ while (++i < n) s[(o = q[i]).i] = o.x(t);
+ return s.join("");
+ };
+ }
function d3_uninterpolateNumber(a, b) {
- b = b - (a = +a) ? 1 / (b - a) : 0;
+ b = (b -= a = +a) || 1 / b;
return function(x) {
- return (x - a) * b;
+ return (x - a) / b;
};
}
function d3_uninterpolateClamp(a, b) {
- b = b - (a = +a) ? 1 / (b - a) : 0;
+ b = (b -= a = +a) || 1 / b;
return function(x) {
- return Math.max(0, Math.min(1, (x - a) * b));
+ return Math.max(0, Math.min(1, (x - a) / b));
};
}
d3.layout = {};
@@ -5068,7 +6118,7 @@ d3 = function() {
});
});
}
- k = (2 * π - padding * n) / k;
+ k = (τ - padding * n) / k;
x = 0, i = -1;
while (++i < n) {
x0 = x, j = -1;
@@ -5154,19 +6204,21 @@ d3 = function() {
return chord;
};
d3.layout.force = function() {
- var force = {}, event = d3.dispatch("start", "tick", "end"), size = [ 1, 1 ], drag, alpha, friction = .9, linkDistance = d3_layout_forceLinkDistance, linkStrength = d3_layout_forceLinkStrength, charge = -30, gravity = .1, theta = .8, nodes = [], links = [], distances, strengths, charges;
+ var force = {}, event = d3.dispatch("start", "tick", "end"), size = [ 1, 1 ], drag, alpha, friction = .9, linkDistance = d3_layout_forceLinkDistance, linkStrength = d3_layout_forceLinkStrength, charge = -30, chargeDistance2 = d3_layout_forceChargeDistance2, gravity = .1, theta2 = .64, nodes = [], links = [], distances, strengths, charges;
function repulse(node) {
return function(quad, x1, _, x2) {
if (quad.point !== node) {
- var dx = quad.cx - node.x, dy = quad.cy - node.y, dn = 1 / Math.sqrt(dx * dx + dy * dy);
- if ((x2 - x1) * dn < theta) {
- var k = quad.charge * dn * dn;
- node.px -= dx * k;
- node.py -= dy * k;
+ var dx = quad.cx - node.x, dy = quad.cy - node.y, dw = x2 - x1, dn = dx * dx + dy * dy;
+ if (dw * dw / theta2 < dn) {
+ if (dn < chargeDistance2) {
+ var k = quad.charge / dn;
+ node.px -= dx * k;
+ node.py -= dy * k;
+ }
return true;
}
- if (quad.point && isFinite(dn)) {
- var k = quad.pointCharge * dn * dn;
+ if (quad.point && dn && dn < chargeDistance2) {
+ var k = quad.pointCharge / dn;
node.px -= dx * k;
node.py -= dy * k;
}
@@ -5270,14 +6322,19 @@ d3 = function() {
charge = typeof x === "function" ? x : +x;
return force;
};
+ force.chargeDistance = function(x) {
+ if (!arguments.length) return Math.sqrt(chargeDistance2);
+ chargeDistance2 = x * x;
+ return force;
+ };
force.gravity = function(x) {
if (!arguments.length) return gravity;
gravity = +x;
return force;
};
force.theta = function(x) {
- if (!arguments.length) return theta;
- theta = +x;
+ if (!arguments.length) return Math.sqrt(theta2);
+ theta2 = x * x;
return force;
};
force.alpha = function(x) {
@@ -5295,7 +6352,7 @@ d3 = function() {
return force;
};
force.start = function() {
- var i, j, n = nodes.length, m = links.length, w = size[0], h = size[1], neighbors, o;
+ var i, n = nodes.length, m = links.length, w = size[0], h = size[1], neighbors, o;
for (i = 0; i < n; ++i) {
(o = nodes[i]).index = i;
o.weight = 0;
@@ -5321,13 +6378,8 @@ d3 = function() {
charges = [];
if (typeof charge === "function") for (i = 0; i < n; ++i) charges[i] = +charge.call(this, nodes[i], i); else for (i = 0; i < n; ++i) charges[i] = charge;
function position(dimension, size) {
- var neighbors = neighbor(i), j = -1, m = neighbors.length, x;
- while (++j < m) if (!isNaN(x = neighbors[j][dimension])) return x;
- return Math.random() * size;
- }
- function neighbor() {
if (!neighbors) {
- neighbors = [];
+ neighbors = new Array(n);
for (j = 0; j < n; ++j) {
neighbors[j] = [];
}
@@ -5337,7 +6389,9 @@ d3 = function() {
neighbors[o.target.index].push(o.source);
}
}
- return neighbors[i];
+ var candidates = neighbors[i], j = -1, l = candidates.length, x;
+ while (++j < l) if (!isNaN(x = candidates[j][dimension])) return x;
+ return Math.random() * size;
}
return force.resume();
};
@@ -5398,42 +6452,33 @@ d3 = function() {
quad.cx = cx / quad.charge;
quad.cy = cy / quad.charge;
}
- var d3_layout_forceLinkDistance = 20, d3_layout_forceLinkStrength = 1;
+ var d3_layout_forceLinkDistance = 20, d3_layout_forceLinkStrength = 1, d3_layout_forceChargeDistance2 = Infinity;
d3.layout.hierarchy = function() {
var sort = d3_layout_hierarchySort, children = d3_layout_hierarchyChildren, value = d3_layout_hierarchyValue;
- function recurse(node, depth, nodes) {
- var childs = children.call(hierarchy, node, depth);
- node.depth = depth;
- nodes.push(node);
- if (childs && (n = childs.length)) {
- var i = -1, n, c = node.children = [], v = 0, j = depth + 1, d;
- while (++i < n) {
- d = recurse(childs[i], j, nodes);
- d.parent = node;
- c.push(d);
- v += d.value;
+ function hierarchy(root) {
+ var stack = [ root ], nodes = [], node;
+ root.depth = 0;
+ while ((node = stack.pop()) != null) {
+ nodes.push(node);
+ if ((childs = children.call(hierarchy, node, node.depth)) && (n = childs.length)) {
+ var n, childs, child;
+ while (--n >= 0) {
+ stack.push(child = childs[n]);
+ child.parent = node;
+ child.depth = node.depth + 1;
+ }
+ if (value) node.value = 0;
+ node.children = childs;
+ } else {
+ if (value) node.value = +value.call(hierarchy, node, node.depth) || 0;
+ delete node.children;
}
- if (sort) c.sort(sort);
- if (value) node.value = v;
- } else if (value) {
- node.value = +value.call(hierarchy, node, depth) || 0;
}
- return node;
- }
- function revalue(node, depth) {
- var children = node.children, v = 0;
- if (children && (n = children.length)) {
- var i = -1, n, j = depth + 1;
- while (++i < n) v += revalue(children[i], j);
- } else if (value) {
- v = +value.call(hierarchy, node, depth) || 0;
- }
- if (value) node.value = v;
- return v;
- }
- function hierarchy(d) {
- var nodes = [];
- recurse(d, 0, nodes);
+ d3_layout_hierarchyVisitAfter(root, function(node) {
+ var childs, parent;
+ if (sort && (childs = node.children)) childs.sort(sort);
+ if (value && (parent = node.parent)) parent.value += node.value;
+ });
return nodes;
}
hierarchy.sort = function(x) {
@@ -5452,7 +6497,16 @@ d3 = function() {
return hierarchy;
};
hierarchy.revalue = function(root) {
- revalue(root, 0);
+ if (value) {
+ d3_layout_hierarchyVisitBefore(root, function(node) {
+ if (node.children) node.value = 0;
+ });
+ d3_layout_hierarchyVisitAfter(root, function(node) {
+ var parent;
+ if (!node.children) node.value = +value.call(hierarchy, node, node.depth) || 0;
+ if (parent = node.parent) parent.value += node.value;
+ });
+ }
return root;
};
return hierarchy;
@@ -5463,6 +6517,29 @@ d3 = function() {
object.links = d3_layout_hierarchyLinks;
return object;
}
+ function d3_layout_hierarchyVisitBefore(node, callback) {
+ var nodes = [ node ];
+ while ((node = nodes.pop()) != null) {
+ callback(node);
+ if ((children = node.children) && (n = children.length)) {
+ var n, children;
+ while (--n >= 0) nodes.push(children[n]);
+ }
+ }
+ }
+ function d3_layout_hierarchyVisitAfter(node, callback) {
+ var nodes = [ node ], nodes2 = [];
+ while ((node = nodes.pop()) != null) {
+ nodes2.push(node);
+ if ((children = node.children) && (n = children.length)) {
+ var i = -1, n, children;
+ while (++i < n) nodes.push(children[i]);
+ }
+ }
+ while ((node = nodes2.pop()) != null) {
+ callback(node);
+ }
+ }
function d3_layout_hierarchyChildren(d) {
return d.children;
}
@@ -5520,49 +6597,50 @@ d3 = function() {
return d3_layout_hierarchyRebind(partition, hierarchy);
};
d3.layout.pie = function() {
- var value = Number, sort = d3_layout_pieSortByValue, startAngle = 0, endAngle = 2 * π;
+ var value = Number, sort = d3_layout_pieSortByValue, startAngle = 0, endAngle = τ, padAngle = 0;
function pie(data) {
- var values = data.map(function(d, i) {
+ var n = data.length, values = data.map(function(d, i) {
return +value.call(pie, d, i);
- });
- var a = +(typeof startAngle === "function" ? startAngle.apply(this, arguments) : startAngle);
- var k = ((typeof endAngle === "function" ? endAngle.apply(this, arguments) : endAngle) - a) / d3.sum(values);
- var index = d3.range(data.length);
+ }), a = +(typeof startAngle === "function" ? startAngle.apply(this, arguments) : startAngle), da = (typeof endAngle === "function" ? endAngle.apply(this, arguments) : endAngle) - a, p = Math.min(Math.abs(da) / n, +(typeof padAngle === "function" ? padAngle.apply(this, arguments) : padAngle)), pa = p * (da < 0 ? -1 : 1), k = (da - n * pa) / d3.sum(values), index = d3.range(n), arcs = [], v;
if (sort != null) index.sort(sort === d3_layout_pieSortByValue ? function(i, j) {
return values[j] - values[i];
} : function(i, j) {
return sort(data[i], data[j]);
});
- var arcs = [];
index.forEach(function(i) {
- var d;
arcs[i] = {
data: data[i],
- value: d = values[i],
+ value: v = values[i],
startAngle: a,
- endAngle: a += d * k
+ endAngle: a += v * k + pa,
+ padAngle: p
};
});
return arcs;
}
- pie.value = function(x) {
+ pie.value = function(_) {
if (!arguments.length) return value;
- value = x;
+ value = _;
return pie;
};
- pie.sort = function(x) {
+ pie.sort = function(_) {
if (!arguments.length) return sort;
- sort = x;
+ sort = _;
return pie;
};
- pie.startAngle = function(x) {
+ pie.startAngle = function(_) {
if (!arguments.length) return startAngle;
- startAngle = x;
+ startAngle = _;
return pie;
};
- pie.endAngle = function(x) {
+ pie.endAngle = function(_) {
if (!arguments.length) return endAngle;
- endAngle = x;
+ endAngle = _;
+ return pie;
+ };
+ pie.padAngle = function(_) {
+ if (!arguments.length) return padAngle;
+ padAngle = _;
return pie;
};
return pie;
@@ -5571,6 +6649,7 @@ d3 = function() {
d3.layout.stack = function() {
var values = d3_identity, order = d3_layout_stackOrderDefault, offset = d3_layout_stackOffsetZero, out = d3_layout_stackOut, x = d3_layout_stackX, y = d3_layout_stackY;
function stack(data, index) {
+ if (!(n = data.length)) return data;
var series = data.map(function(d, i) {
return values.call(stack, d, i);
});
@@ -5583,7 +6662,7 @@ d3 = function() {
series = d3.permute(series, orders);
points = d3.permute(points, orders);
var offsets = offset.call(stack, points, index);
- var n = series.length, m = series[0].length, i, j, o;
+ var m = series[0].length, n, i, j, o;
for (j = 0; j < m; ++j) {
out.call(stack, series[0][j], o = offsets[j], points[0][j][1]);
for (i = 1; i < n; ++i) {
@@ -5778,204 +6857,38 @@ d3 = function() {
function d3_layout_histogramRange(values) {
return [ d3.min(values), d3.max(values) ];
}
- d3.layout.tree = function() {
- var hierarchy = d3.layout.hierarchy().sort(null).value(null), separation = d3_layout_treeSeparation, size = [ 1, 1 ];
- function tree(d, i) {
- var nodes = hierarchy.call(this, d, i), root = nodes[0];
- function firstWalk(node, previousSibling) {
- var children = node.children, layout = node._tree;
- if (children && (n = children.length)) {
- var n, firstChild = children[0], previousChild, ancestor = firstChild, child, i = -1;
- while (++i < n) {
- child = children[i];
- firstWalk(child, previousChild);
- ancestor = apportion(child, previousChild, ancestor);
- previousChild = child;
- }
- d3_layout_treeShift(node);
- var midpoint = .5 * (firstChild._tree.prelim + child._tree.prelim);
- if (previousSibling) {
- layout.prelim = previousSibling._tree.prelim + separation(node, previousSibling);
- layout.mod = layout.prelim - midpoint;
- } else {
- layout.prelim = midpoint;
- }
- } else {
- if (previousSibling) {
- layout.prelim = previousSibling._tree.prelim + separation(node, previousSibling);
- }
- }
- }
- function secondWalk(node, x) {
- node.x = node._tree.prelim + x;
- var children = node.children;
- if (children && (n = children.length)) {
- var i = -1, n;
- x += node._tree.mod;
- while (++i < n) {
- secondWalk(children[i], x);
- }
- }
- }
- function apportion(node, previousSibling, ancestor) {
- if (previousSibling) {
- var vip = node, vop = node, vim = previousSibling, vom = node.parent.children[0], sip = vip._tree.mod, sop = vop._tree.mod, sim = vim._tree.mod, som = vom._tree.mod, shift;
- while (vim = d3_layout_treeRight(vim), vip = d3_layout_treeLeft(vip), vim && vip) {
- vom = d3_layout_treeLeft(vom);
- vop = d3_layout_treeRight(vop);
- vop._tree.ancestor = node;
- shift = vim._tree.prelim + sim - vip._tree.prelim - sip + separation(vim, vip);
- if (shift > 0) {
- d3_layout_treeMove(d3_layout_treeAncestor(vim, node, ancestor), node, shift);
- sip += shift;
- sop += shift;
- }
- sim += vim._tree.mod;
- sip += vip._tree.mod;
- som += vom._tree.mod;
- sop += vop._tree.mod;
- }
- if (vim && !d3_layout_treeRight(vop)) {
- vop._tree.thread = vim;
- vop._tree.mod += sim - sop;
- }
- if (vip && !d3_layout_treeLeft(vom)) {
- vom._tree.thread = vip;
- vom._tree.mod += sip - som;
- ancestor = node;
- }
- }
- return ancestor;
- }
- d3_layout_treeVisitAfter(root, function(node, previousSibling) {
- node._tree = {
- ancestor: node,
- prelim: 0,
- mod: 0,
- change: 0,
- shift: 0,
- number: previousSibling ? previousSibling._tree.number + 1 : 0
- };
- });
- firstWalk(root);
- secondWalk(root, -root._tree.prelim);
- var left = d3_layout_treeSearch(root, d3_layout_treeLeftmost), right = d3_layout_treeSearch(root, d3_layout_treeRightmost), deep = d3_layout_treeSearch(root, d3_layout_treeDeepest), x0 = left.x - separation(left, right) / 2, x1 = right.x + separation(right, left) / 2, y1 = deep.depth || 1;
- d3_layout_treeVisitAfter(root, function(node) {
- node.x = (node.x - x0) / (x1 - x0) * size[0];
- node.y = node.depth / y1 * size[1];
- delete node._tree;
- });
- return nodes;
- }
- tree.separation = function(x) {
- if (!arguments.length) return separation;
- separation = x;
- return tree;
- };
- tree.size = function(x) {
- if (!arguments.length) return size;
- size = x;
- return tree;
- };
- return d3_layout_hierarchyRebind(tree, hierarchy);
- };
- function d3_layout_treeSeparation(a, b) {
- return a.parent == b.parent ? 1 : 2;
- }
- function d3_layout_treeLeft(node) {
- var children = node.children;
- return children && children.length ? children[0] : node._tree.thread;
- }
- function d3_layout_treeRight(node) {
- var children = node.children, n;
- return children && (n = children.length) ? children[n - 1] : node._tree.thread;
- }
- function d3_layout_treeSearch(node, compare) {
- var children = node.children;
- if (children && (n = children.length)) {
- var child, n, i = -1;
- while (++i < n) {
- if (compare(child = d3_layout_treeSearch(children[i], compare), node) > 0) {
- node = child;
- }
- }
- }
- return node;
- }
- function d3_layout_treeRightmost(a, b) {
- return a.x - b.x;
- }
- function d3_layout_treeLeftmost(a, b) {
- return b.x - a.x;
- }
- function d3_layout_treeDeepest(a, b) {
- return a.depth - b.depth;
- }
- function d3_layout_treeVisitAfter(node, callback) {
- function visit(node, previousSibling) {
- var children = node.children;
- if (children && (n = children.length)) {
- var child, previousChild = null, i = -1, n;
- while (++i < n) {
- child = children[i];
- visit(child, previousChild);
- previousChild = child;
- }
- }
- callback(node, previousSibling);
- }
- visit(node, null);
- }
- function d3_layout_treeShift(node) {
- var shift = 0, change = 0, children = node.children, i = children.length, child;
- while (--i >= 0) {
- child = children[i]._tree;
- child.prelim += shift;
- child.mod += shift;
- shift += child.shift + (change += child.change);
- }
- }
- function d3_layout_treeMove(ancestor, node, shift) {
- ancestor = ancestor._tree;
- node = node._tree;
- var change = shift / (node.number - ancestor.number);
- ancestor.change += change;
- node.change -= change;
- node.shift += shift;
- node.prelim += shift;
- node.mod += shift;
- }
- function d3_layout_treeAncestor(vim, node, ancestor) {
- return vim._tree.ancestor.parent == node.parent ? vim._tree.ancestor : ancestor;
- }
d3.layout.pack = function() {
- var hierarchy = d3.layout.hierarchy().sort(d3_layout_packSort), padding = 0, size = [ 1, 1 ];
+ var hierarchy = d3.layout.hierarchy().sort(d3_layout_packSort), padding = 0, size = [ 1, 1 ], radius;
function pack(d, i) {
- var nodes = hierarchy.call(this, d, i), root = nodes[0];
- root.x = 0;
- root.y = 0;
- d3_layout_treeVisitAfter(root, function(d) {
- d.r = Math.sqrt(d.value);
+ var nodes = hierarchy.call(this, d, i), root = nodes[0], w = size[0], h = size[1], r = radius == null ? Math.sqrt : typeof radius === "function" ? radius : function() {
+ return radius;
+ };
+ root.x = root.y = 0;
+ d3_layout_hierarchyVisitAfter(root, function(d) {
+ d.r = +r(d.value);
});
- d3_layout_treeVisitAfter(root, d3_layout_packSiblings);
- var w = size[0], h = size[1], k = Math.max(2 * root.r / w, 2 * root.r / h);
- if (padding > 0) {
- var dr = padding * k / 2;
- d3_layout_treeVisitAfter(root, function(d) {
+ d3_layout_hierarchyVisitAfter(root, d3_layout_packSiblings);
+ if (padding) {
+ var dr = padding * (radius ? 1 : Math.max(2 * root.r / w, 2 * root.r / h)) / 2;
+ d3_layout_hierarchyVisitAfter(root, function(d) {
d.r += dr;
});
- d3_layout_treeVisitAfter(root, d3_layout_packSiblings);
- d3_layout_treeVisitAfter(root, function(d) {
+ d3_layout_hierarchyVisitAfter(root, d3_layout_packSiblings);
+ d3_layout_hierarchyVisitAfter(root, function(d) {
d.r -= dr;
});
- k = Math.max(2 * root.r / w, 2 * root.r / h);
}
- d3_layout_packTransform(root, w / 2, h / 2, 1 / k);
+ d3_layout_packTransform(root, w / 2, h / 2, radius ? 1 : 1 / Math.max(2 * root.r / w, 2 * root.r / h));
return nodes;
}
- pack.size = function(x) {
+ pack.size = function(_) {
if (!arguments.length) return size;
- size = x;
+ size = _;
+ return pack;
+ };
+ pack.radius = function(_) {
+ if (!arguments.length) return radius;
+ radius = _ == null || typeof _ === "function" ? _ : +_;
return pack;
};
pack.padding = function(_) {
@@ -6001,7 +6914,7 @@ d3 = function() {
}
function d3_layout_packIntersects(a, b) {
var dx = b.x - a.x, dy = b.y - a.y, dr = a.r + b.r;
- return dr * dr - dx * dx - dy * dy > .001;
+ return .999 * dr * dr > dx * dx + dy * dy;
}
function d3_layout_packSiblings(node) {
if (!(nodes = node.children) || !(n = nodes.length)) return;
@@ -6098,11 +7011,158 @@ d3 = function() {
c.y = a.y;
}
}
+ d3.layout.tree = function() {
+ var hierarchy = d3.layout.hierarchy().sort(null).value(null), separation = d3_layout_treeSeparation, size = [ 1, 1 ], nodeSize = null;
+ function tree(d, i) {
+ var nodes = hierarchy.call(this, d, i), root0 = nodes[0], root1 = wrapTree(root0);
+ d3_layout_hierarchyVisitAfter(root1, firstWalk), root1.parent.m = -root1.z;
+ d3_layout_hierarchyVisitBefore(root1, secondWalk);
+ if (nodeSize) d3_layout_hierarchyVisitBefore(root0, sizeNode); else {
+ var left = root0, right = root0, bottom = root0;
+ d3_layout_hierarchyVisitBefore(root0, function(node) {
+ if (node.x < left.x) left = node;
+ if (node.x > right.x) right = node;
+ if (node.depth > bottom.depth) bottom = node;
+ });
+ var tx = separation(left, right) / 2 - left.x, kx = size[0] / (right.x + separation(right, left) / 2 + tx), ky = size[1] / (bottom.depth || 1);
+ d3_layout_hierarchyVisitBefore(root0, function(node) {
+ node.x = (node.x + tx) * kx;
+ node.y = node.depth * ky;
+ });
+ }
+ return nodes;
+ }
+ function wrapTree(root0) {
+ var root1 = {
+ A: null,
+ children: [ root0 ]
+ }, queue = [ root1 ], node1;
+ while ((node1 = queue.pop()) != null) {
+ for (var children = node1.children, child, i = 0, n = children.length; i < n; ++i) {
+ queue.push((children[i] = child = {
+ _: children[i],
+ parent: node1,
+ children: (child = children[i].children) && child.slice() || [],
+ A: null,
+ a: null,
+ z: 0,
+ m: 0,
+ c: 0,
+ s: 0,
+ t: null,
+ i: i
+ }).a = child);
+ }
+ }
+ return root1.children[0];
+ }
+ function firstWalk(v) {
+ var children = v.children, siblings = v.parent.children, w = v.i ? siblings[v.i - 1] : null;
+ if (children.length) {
+ d3_layout_treeShift(v);
+ var midpoint = (children[0].z + children[children.length - 1].z) / 2;
+ if (w) {
+ v.z = w.z + separation(v._, w._);
+ v.m = v.z - midpoint;
+ } else {
+ v.z = midpoint;
+ }
+ } else if (w) {
+ v.z = w.z + separation(v._, w._);
+ }
+ v.parent.A = apportion(v, w, v.parent.A || siblings[0]);
+ }
+ function secondWalk(v) {
+ v._.x = v.z + v.parent.m;
+ v.m += v.parent.m;
+ }
+ function apportion(v, w, ancestor) {
+ if (w) {
+ var vip = v, vop = v, vim = w, vom = vip.parent.children[0], sip = vip.m, sop = vop.m, sim = vim.m, som = vom.m, shift;
+ while (vim = d3_layout_treeRight(vim), vip = d3_layout_treeLeft(vip), vim && vip) {
+ vom = d3_layout_treeLeft(vom);
+ vop = d3_layout_treeRight(vop);
+ vop.a = v;
+ shift = vim.z + sim - vip.z - sip + separation(vim._, vip._);
+ if (shift > 0) {
+ d3_layout_treeMove(d3_layout_treeAncestor(vim, v, ancestor), v, shift);
+ sip += shift;
+ sop += shift;
+ }
+ sim += vim.m;
+ sip += vip.m;
+ som += vom.m;
+ sop += vop.m;
+ }
+ if (vim && !d3_layout_treeRight(vop)) {
+ vop.t = vim;
+ vop.m += sim - sop;
+ }
+ if (vip && !d3_layout_treeLeft(vom)) {
+ vom.t = vip;
+ vom.m += sip - som;
+ ancestor = v;
+ }
+ }
+ return ancestor;
+ }
+ function sizeNode(node) {
+ node.x *= size[0];
+ node.y = node.depth * size[1];
+ }
+ tree.separation = function(x) {
+ if (!arguments.length) return separation;
+ separation = x;
+ return tree;
+ };
+ tree.size = function(x) {
+ if (!arguments.length) return nodeSize ? null : size;
+ nodeSize = (size = x) == null ? sizeNode : null;
+ return tree;
+ };
+ tree.nodeSize = function(x) {
+ if (!arguments.length) return nodeSize ? size : null;
+ nodeSize = (size = x) == null ? null : sizeNode;
+ return tree;
+ };
+ return d3_layout_hierarchyRebind(tree, hierarchy);
+ };
+ function d3_layout_treeSeparation(a, b) {
+ return a.parent == b.parent ? 1 : 2;
+ }
+ function d3_layout_treeLeft(v) {
+ var children = v.children;
+ return children.length ? children[0] : v.t;
+ }
+ function d3_layout_treeRight(v) {
+ var children = v.children, n;
+ return (n = children.length) ? children[n - 1] : v.t;
+ }
+ function d3_layout_treeMove(wm, wp, shift) {
+ var change = shift / (wp.i - wm.i);
+ wp.c -= change;
+ wp.s += shift;
+ wm.c += change;
+ wp.z += shift;
+ wp.m += shift;
+ }
+ function d3_layout_treeShift(v) {
+ var shift = 0, change = 0, children = v.children, i = children.length, w;
+ while (--i >= 0) {
+ w = children[i];
+ w.z += shift;
+ w.m += shift;
+ shift += w.s + (change += w.c);
+ }
+ }
+ function d3_layout_treeAncestor(vim, v, ancestor) {
+ return vim.a.parent === v.parent ? vim.a : ancestor;
+ }
d3.layout.cluster = function() {
- var hierarchy = d3.layout.hierarchy().sort(null).value(null), separation = d3_layout_treeSeparation, size = [ 1, 1 ];
+ var hierarchy = d3.layout.hierarchy().sort(null).value(null), separation = d3_layout_treeSeparation, size = [ 1, 1 ], nodeSize = false;
function cluster(d, i) {
var nodes = hierarchy.call(this, d, i), root = nodes[0], previousNode, x = 0;
- d3_layout_treeVisitAfter(root, function(node) {
+ d3_layout_hierarchyVisitAfter(root, function(node) {
var children = node.children;
if (children && children.length) {
node.x = d3_layout_clusterX(children);
@@ -6114,7 +7174,10 @@ d3 = function() {
}
});
var left = d3_layout_clusterLeft(root), right = d3_layout_clusterRight(root), x0 = left.x - separation(left, right) / 2, x1 = right.x + separation(right, left) / 2;
- d3_layout_treeVisitAfter(root, function(node) {
+ d3_layout_hierarchyVisitAfter(root, nodeSize ? function(node) {
+ node.x = (node.x - root.x) * size[0];
+ node.y = (root.y - node.y) * size[1];
+ } : function(node) {
node.x = (node.x - x0) / (x1 - x0) * size[0];
node.y = (1 - (root.y ? node.y / root.y : 1)) * size[1];
});
@@ -6126,8 +7189,13 @@ d3 = function() {
return cluster;
};
cluster.size = function(x) {
- if (!arguments.length) return size;
- size = x;
+ if (!arguments.length) return nodeSize ? null : size;
+ nodeSize = (size = x) == null;
+ return cluster;
+ };
+ cluster.nodeSize = function(x) {
+ if (!arguments.length) return nodeSize ? size : null;
+ nodeSize = (size = x) != null;
return cluster;
};
return d3_layout_hierarchyRebind(cluster, hierarchy);
@@ -6344,10 +7412,16 @@ d3 = function() {
return Math.exp(random());
};
},
+ bates: function(m) {
+ var random = d3.random.irwinHall(m);
+ return function() {
+ return random() / m;
+ };
+ },
irwinHall: function(m) {
return function() {
for (var s = 0, j = 0; j < m; j++) s += Math.random();
- return s / m;
+ return s;
};
}
};
@@ -6371,12 +7445,24 @@ d3 = function() {
dx = i0, i0 = i1, i1 = dx;
dx = x0, x0 = x1, x1 = dx;
}
- if (nice = nice(x1 - x0)) {
- domain[i0] = nice.floor(x0);
- domain[i1] = nice.ceil(x1);
- }
+ domain[i0] = nice.floor(x0);
+ domain[i1] = nice.ceil(x1);
return domain;
}
+ function d3_scale_niceStep(step) {
+ return step ? {
+ floor: function(x) {
+ return Math.floor(x / step) * step;
+ },
+ ceil: function(x) {
+ return Math.ceil(x / step) * step;
+ }
+ } : d3_scale_niceIdentity;
+ }
+ var d3_scale_niceIdentity = {
+ floor: d3_identity,
+ ceil: d3_identity
+ };
function d3_scale_polylinear(domain, range, uninterpolate, interpolate) {
var u = [], i = [], j = 0, k = Math.min(domain.length, range.length) - 1;
if (domain[k] < domain[0]) {
@@ -6438,8 +7524,8 @@ d3 = function() {
scale.tickFormat = function(m, format) {
return d3_scale_linearTickFormat(domain, m, format);
};
- scale.nice = function() {
- d3_scale_nice(domain, d3_scale_linearNice);
+ scale.nice = function(m) {
+ d3_scale_linearNice(domain, m);
return rescale();
};
scale.copy = function() {
@@ -6450,18 +7536,11 @@ d3 = function() {
function d3_scale_linearRebind(scale, linear) {
return d3.rebind(scale, linear, "range", "rangeRound", "interpolate", "clamp");
}
- function d3_scale_linearNice(dx) {
- dx = Math.pow(10, Math.round(Math.log(dx) / Math.LN10) - 1);
- return dx && {
- floor: function(x) {
- return Math.floor(x / dx) * dx;
- },
- ceil: function(x) {
- return Math.ceil(x / dx) * dx;
- }
- };
+ function d3_scale_linearNice(domain, m) {
+ return d3_scale_nice(domain, d3_scale_niceStep(d3_scale_linearTickRange(domain, m)[2]));
}
function d3_scale_linearTickRange(domain, m) {
+ if (m == null) m = 10;
var extent = d3_scaleExtent(domain), span = extent[1] - extent[0], step = Math.pow(10, Math.floor(Math.log(span / m) / Math.LN10)), err = m / span * step;
if (err <= .15) step *= 10; else if (err <= .35) step *= 5; else if (err <= .75) step *= 2;
extent[0] = Math.ceil(extent[0] / step) * step;
@@ -6473,15 +7552,50 @@ d3 = function() {
return d3.range.apply(d3, d3_scale_linearTickRange(domain, m));
}
function d3_scale_linearTickFormat(domain, m, format) {
- var precision = -Math.floor(Math.log(d3_scale_linearTickRange(domain, m)[2]) / Math.LN10 + .01);
- return d3.format(format ? format.replace(d3_format_re, function(a, b, c, d, e, f, g, h, i, j) {
- return [ b, c, d, e, f, g, h, i || "." + (precision - (j === "%") * 2), j ].join("");
- }) : ",." + precision + "f");
+ var range = d3_scale_linearTickRange(domain, m);
+ if (format) {
+ var match = d3_format_re.exec(format);
+ match.shift();
+ if (match[8] === "s") {
+ var prefix = d3.formatPrefix(Math.max(abs(range[0]), abs(range[1])));
+ if (!match[7]) match[7] = "." + d3_scale_linearPrecision(prefix.scale(range[2]));
+ match[8] = "f";
+ format = d3.format(match.join(""));
+ return function(d) {
+ return format(prefix.scale(d)) + prefix.symbol;
+ };
+ }
+ if (!match[7]) match[7] = "." + d3_scale_linearFormatPrecision(match[8], range);
+ format = match.join("");
+ } else {
+ format = ",." + d3_scale_linearPrecision(range[2]) + "f";
+ }
+ return d3.format(format);
+ }
+ var d3_scale_linearFormatSignificant = {
+ s: 1,
+ g: 1,
+ p: 1,
+ r: 1,
+ e: 1
+ };
+ function d3_scale_linearPrecision(value) {
+ return -Math.floor(Math.log(value) / Math.LN10 + .01);
+ }
+ function d3_scale_linearFormatPrecision(type, range) {
+ var p = d3_scale_linearPrecision(range[2]);
+ return type in d3_scale_linearFormatSignificant ? Math.abs(p - d3_scale_linearPrecision(Math.max(abs(range[0]), abs(range[1])))) + +(type !== "e") : p - (type === "%") * 2;
}
d3.scale.log = function() {
- return d3_scale_log(d3.scale.linear().domain([ 0, Math.LN10 ]), 10, d3_scale_logp, d3_scale_powp);
+ return d3_scale_log(d3.scale.linear().domain([ 0, 1 ]), 10, true, [ 1, 10 ]);
};
- function d3_scale_log(linear, base, log, pow) {
+ function d3_scale_log(linear, base, positive, domain) {
+ function log(x) {
+ return (positive ? Math.log(x < 0 ? 0 : x) : -Math.log(x > 0 ? 0 : -x)) / Math.log(base);
+ }
+ function pow(x) {
+ return positive ? Math.pow(base, x) : -Math.pow(base, -x);
+ }
function scale(x) {
return linear(log(x));
}
@@ -6489,31 +7603,32 @@ d3 = function() {
return pow(linear.invert(x));
};
scale.domain = function(x) {
- if (!arguments.length) return linear.domain().map(pow);
- if (x[0] < 0) log = d3_scale_logn, pow = d3_scale_pown; else log = d3_scale_logp,
- pow = d3_scale_powp;
- linear.domain(x.map(log));
+ if (!arguments.length) return domain;
+ positive = x[0] >= 0;
+ linear.domain((domain = x.map(Number)).map(log));
return scale;
};
scale.base = function(_) {
if (!arguments.length) return base;
base = +_;
+ linear.domain(domain.map(log));
return scale;
};
scale.nice = function() {
- linear.domain(d3_scale_nice(linear.domain(), d3_scale_logNice(base)));
+ var niced = d3_scale_nice(domain.map(log), positive ? Math : d3_scale_logNiceNegative);
+ linear.domain(niced);
+ domain = niced.map(pow);
return scale;
};
scale.ticks = function() {
- var extent = d3_scaleExtent(linear.domain()), ticks = [];
- if (extent.every(isFinite)) {
- var b = Math.log(base), i = Math.floor(extent[0] / b), j = Math.ceil(extent[1] / b), u = pow(extent[0]), v = pow(extent[1]), n = base % 1 ? 2 : base;
- if (log === d3_scale_logn) {
- ticks.push(-Math.pow(base, -i));
- for (;i++ < j; ) for (var k = n - 1; k > 0; k--) ticks.push(-Math.pow(base, -i) * k);
+ var extent = d3_scaleExtent(domain), ticks = [], u = extent[0], v = extent[1], i = Math.floor(log(u)), j = Math.ceil(log(v)), n = base % 1 ? 2 : base;
+ if (isFinite(j - i)) {
+ if (positive) {
+ for (;i < j; i++) for (var k = 1; k < n; k++) ticks.push(pow(i) * k);
+ ticks.push(pow(i));
} else {
- for (;i < j; i++) for (var k = 1; k < n; k++) ticks.push(Math.pow(base, i) * k);
- ticks.push(Math.pow(base, i));
+ ticks.push(pow(i));
+ for (;i++ < j; ) for (var k = n - 1; k > 0; k--) ticks.push(pow(i) * k);
}
for (i = 0; ticks[i] < u; i++) {}
for (j = ticks.length; ticks[j - 1] > v; j--) {}
@@ -6522,50 +7637,31 @@ d3 = function() {
return ticks;
};
scale.tickFormat = function(n, format) {
- if (arguments.length < 2) format = d3_scale_logFormat;
- if (!arguments.length) return format;
- var b = Math.log(base), k = Math.max(.1, n / scale.ticks().length), f = log === d3_scale_logn ? (e = -1e-12,
- Math.floor) : (e = 1e-12, Math.ceil), e;
+ if (!arguments.length) return d3_scale_logFormat;
+ if (arguments.length < 2) format = d3_scale_logFormat; else if (typeof format !== "function") format = d3.format(format);
+ var k = Math.max(.1, n / scale.ticks().length), f = positive ? (e = 1e-12, Math.ceil) : (e = -1e-12,
+ Math.floor), e;
return function(d) {
- return d / pow(b * f(log(d) / b + e)) <= k ? format(d) : "";
+ return d / pow(f(log(d) + e)) <= k ? format(d) : "";
};
};
scale.copy = function() {
- return d3_scale_log(linear.copy(), base, log, pow);
+ return d3_scale_log(linear.copy(), base, positive, domain);
};
return d3_scale_linearRebind(scale, linear);
}
- var d3_scale_logFormat = d3.format(".0e");
- function d3_scale_logp(x) {
- return Math.log(x < 0 ? 0 : x);
- }
- function d3_scale_powp(x) {
- return Math.exp(x);
- }
- function d3_scale_logn(x) {
- return -Math.log(x > 0 ? 0 : -x);
- }
- function d3_scale_pown(x) {
- return -Math.exp(-x);
- }
- function d3_scale_logNice(base) {
- base = Math.log(base);
- var nice = {
- floor: function(x) {
- return Math.floor(x / base) * base;
- },
- ceil: function(x) {
- return Math.ceil(x / base) * base;
- }
- };
- return function() {
- return nice;
- };
- }
+ var d3_scale_logFormat = d3.format(".0e"), d3_scale_logNiceNegative = {
+ floor: function(x) {
+ return -Math.ceil(-x);
+ },
+ ceil: function(x) {
+ return -Math.floor(-x);
+ }
+ };
d3.scale.pow = function() {
- return d3_scale_pow(d3.scale.linear(), 1);
+ return d3_scale_pow(d3.scale.linear(), 1, [ 0, 1 ]);
};
- function d3_scale_pow(linear, exponent) {
+ function d3_scale_pow(linear, exponent, domain) {
var powp = d3_scale_powPow(exponent), powb = d3_scale_powPow(1 / exponent);
function scale(x) {
return linear(powp(x));
@@ -6574,28 +7670,28 @@ d3 = function() {
return powb(linear.invert(x));
};
scale.domain = function(x) {
- if (!arguments.length) return linear.domain().map(powb);
- linear.domain(x.map(powp));
+ if (!arguments.length) return domain;
+ linear.domain((domain = x.map(Number)).map(powp));
return scale;
};
scale.ticks = function(m) {
- return d3_scale_linearTicks(scale.domain(), m);
+ return d3_scale_linearTicks(domain, m);
};
scale.tickFormat = function(m, format) {
- return d3_scale_linearTickFormat(scale.domain(), m, format);
+ return d3_scale_linearTickFormat(domain, m, format);
};
- scale.nice = function() {
- return scale.domain(d3_scale_nice(scale.domain(), d3_scale_linearNice));
+ scale.nice = function(m) {
+ return scale.domain(d3_scale_linearNice(domain, m));
};
scale.exponent = function(x) {
if (!arguments.length) return exponent;
- var domain = scale.domain();
powp = d3_scale_powPow(exponent = x);
powb = d3_scale_powPow(1 / exponent);
- return scale.domain(domain);
+ linear.domain(domain.map(powp));
+ return scale;
};
scale.copy = function() {
- return d3_scale_pow(linear.copy(), exponent);
+ return d3_scale_pow(linear.copy(), exponent, domain);
};
return d3_scale_linearRebind(scale, linear);
}
@@ -6616,7 +7712,7 @@ d3 = function() {
function d3_scale_ordinal(domain, ranger) {
var index, range, rangeBand;
function scale(x) {
- return range[((index.get(x) || index.set(x, domain.push(x))) - 1) % range.length];
+ return range[((index.get(x) || (ranger.t === "range" ? index.set(x, domain.push(x)) : NaN)) - 1) % range.length];
}
function steps(start, step) {
return d3.range(domain.length).map(function(i) {
@@ -6643,8 +7739,9 @@ d3 = function() {
};
scale.rangePoints = function(x, padding) {
if (arguments.length < 2) padding = 0;
- var start = x[0], stop = x[1], step = (stop - start) / (Math.max(1, domain.length - 1) + padding);
- range = steps(domain.length < 2 ? (start + stop) / 2 : start + step * padding / 2, step);
+ var start = x[0], stop = x[1], step = domain.length < 2 ? (start = (start + stop) / 2,
+ 0) : (stop - start) / (domain.length - 1 + padding);
+ range = steps(start + step * padding / 2, step);
rangeBand = 0;
ranger = {
t: "rangePoints",
@@ -6652,6 +7749,18 @@ d3 = function() {
};
return scale;
};
+ scale.rangeRoundPoints = function(x, padding) {
+ if (arguments.length < 2) padding = 0;
+ var start = x[0], stop = x[1], step = domain.length < 2 ? (start = stop = Math.round((start + stop) / 2),
+ 0) : (stop - start) / (domain.length - 1 + padding) | 0;
+ range = steps(start + Math.round(step * padding / 2 + (stop - start - (domain.length - 1 + padding) * step) / 2), step);
+ rangeBand = 0;
+ ranger = {
+ t: "rangeRoundPoints",
+ a: arguments
+ };
+ return scale;
+ };
scale.rangeBands = function(x, padding, outerPadding) {
if (arguments.length < 2) padding = 0;
if (arguments.length < 3) outerPadding = padding;
@@ -6668,8 +7777,8 @@ d3 = function() {
scale.rangeRoundBands = function(x, padding, outerPadding) {
if (arguments.length < 2) padding = 0;
if (arguments.length < 3) outerPadding = padding;
- var reverse = x[1] < x[0], start = x[reverse - 0], stop = x[1 - reverse], step = Math.floor((stop - start) / (domain.length - padding + 2 * outerPadding)), error = stop - start - (domain.length - padding) * step;
- range = steps(start + Math.round(error / 2), step);
+ var reverse = x[1] < x[0], start = x[reverse - 0], stop = x[1 - reverse], step = Math.floor((stop - start) / (domain.length - padding + 2 * outerPadding));
+ range = steps(start + Math.round((stop - start - (domain.length - padding) * step) / 2), step);
if (reverse) range.reverse();
rangeBand = Math.round(step * (1 - padding));
ranger = {
@@ -6701,10 +7810,10 @@ d3 = function() {
d3.scale.category20c = function() {
return d3.scale.ordinal().range(d3_category20c);
};
- var d3_category10 = [ "#1f77b4", "#ff7f0e", "#2ca02c", "#d62728", "#9467bd", "#8c564b", "#e377c2", "#7f7f7f", "#bcbd22", "#17becf" ];
- var d3_category20 = [ "#1f77b4", "#aec7e8", "#ff7f0e", "#ffbb78", "#2ca02c", "#98df8a", "#d62728", "#ff9896", "#9467bd", "#c5b0d5", "#8c564b", "#c49c94", "#e377c2", "#f7b6d2", "#7f7f7f", "#c7c7c7", "#bcbd22", "#dbdb8d", "#17becf", "#9edae5" ];
- var d3_category20b = [ "#393b79", "#5254a3", "#6b6ecf", "#9c9ede", "#637939", "#8ca252", "#b5cf6b", "#cedb9c", "#8c6d31", "#bd9e39", "#e7ba52", "#e7cb94", "#843c39", "#ad494a", "#d6616b", "#e7969c", "#7b4173", "#a55194", "#ce6dbd", "#de9ed6" ];
- var d3_category20c = [ "#3182bd", "#6baed6", "#9ecae1", "#c6dbef", "#e6550d", "#fd8d3c", "#fdae6b", "#fdd0a2", "#31a354", "#74c476", "#a1d99b", "#c7e9c0", "#756bb1", "#9e9ac8", "#bcbddc", "#dadaeb", "#636363", "#969696", "#bdbdbd", "#d9d9d9" ];
+ var d3_category10 = [ 2062260, 16744206, 2924588, 14034728, 9725885, 9197131, 14907330, 8355711, 12369186, 1556175 ].map(d3_rgbString);
+ var d3_category20 = [ 2062260, 11454440, 16744206, 16759672, 2924588, 10018698, 14034728, 16750742, 9725885, 12955861, 9197131, 12885140, 14907330, 16234194, 8355711, 13092807, 12369186, 14408589, 1556175, 10410725 ].map(d3_rgbString);
+ var d3_category20b = [ 3750777, 5395619, 7040719, 10264286, 6519097, 9216594, 11915115, 13556636, 9202993, 12426809, 15186514, 15190932, 8666169, 11356490, 14049643, 15177372, 8077683, 10834324, 13528509, 14589654 ].map(d3_rgbString);
+ var d3_category20c = [ 3244733, 7057110, 10406625, 13032431, 15095053, 16616764, 16625259, 16634018, 3253076, 7652470, 10607003, 13101504, 7695281, 10394312, 12369372, 14342891, 6513507, 9868950, 12434877, 14277081 ].map(d3_rgbString);
d3.scale.quantile = function() {
return d3_scale_quantile([], []);
};
@@ -6717,14 +7826,11 @@ d3 = function() {
return scale;
}
function scale(x) {
- if (isNaN(x = +x)) return NaN;
- return range[d3.bisect(thresholds, x)];
+ if (!isNaN(x = +x)) return range[d3.bisect(thresholds, x)];
}
scale.domain = function(x) {
if (!arguments.length) return domain;
- domain = x.filter(function(d) {
- return !isNaN(d);
- }).sort(d3.ascending);
+ domain = x.map(d3_number).filter(d3_numeric).sort(d3_ascending);
return rescale();
};
scale.range = function(x) {
@@ -6735,6 +7841,10 @@ d3 = function() {
scale.quantiles = function() {
return thresholds;
};
+ scale.invertExtent = function(y) {
+ y = range.indexOf(y);
+ return y < 0 ? [ NaN, NaN ] : [ y > 0 ? thresholds[y - 1] : domain[0], y < thresholds.length ? thresholds[y] : domain[domain.length - 1] ];
+ };
scale.copy = function() {
return d3_scale_quantile(domain, range);
};
@@ -6764,6 +7874,11 @@ d3 = function() {
range = x;
return rescale();
};
+ scale.invertExtent = function(y) {
+ y = range.indexOf(y);
+ y = y < 0 ? NaN : y / kx + x0;
+ return [ y, y + 1 / kx ];
+ };
scale.copy = function() {
return d3_scale_quantize(x0, x1, range);
};
@@ -6774,7 +7889,7 @@ d3 = function() {
};
function d3_scale_threshold(domain, range) {
function scale(x) {
- return range[d3.bisect(domain, x)];
+ if (x <= x) return range[d3.bisect(domain, x)];
}
scale.domain = function(_) {
if (!arguments.length) return domain;
@@ -6786,6 +7901,10 @@ d3 = function() {
range = _;
return scale;
};
+ scale.invertExtent = function(y) {
+ y = range.indexOf(y);
+ return [ domain[y - 1], domain[y] ];
+ };
scale.copy = function() {
return d3_scale_threshold(domain, range);
};
@@ -6815,12 +7934,87 @@ d3 = function() {
};
return identity;
}
+ d3.svg = {};
+ function d3_zero() {
+ return 0;
+ }
d3.svg.arc = function() {
- var innerRadius = d3_svg_arcInnerRadius, outerRadius = d3_svg_arcOuterRadius, startAngle = d3_svg_arcStartAngle, endAngle = d3_svg_arcEndAngle;
+ var innerRadius = d3_svg_arcInnerRadius, outerRadius = d3_svg_arcOuterRadius, cornerRadius = d3_zero, padRadius = d3_svg_arcAuto, startAngle = d3_svg_arcStartAngle, endAngle = d3_svg_arcEndAngle, padAngle = d3_svg_arcPadAngle;
function arc() {
- var r0 = innerRadius.apply(this, arguments), r1 = outerRadius.apply(this, arguments), a0 = startAngle.apply(this, arguments) + d3_svg_arcOffset, a1 = endAngle.apply(this, arguments) + d3_svg_arcOffset, da = (a1 < a0 && (da = a0,
- a0 = a1, a1 = da), a1 - a0), df = da < π ? "0" : "1", c0 = Math.cos(a0), s0 = Math.sin(a0), c1 = Math.cos(a1), s1 = Math.sin(a1);
- return da >= d3_svg_arcMax ? r0 ? "M0," + r1 + "A" + r1 + "," + r1 + " 0 1,1 0," + -r1 + "A" + r1 + "," + r1 + " 0 1,1 0," + r1 + "M0," + r0 + "A" + r0 + "," + r0 + " 0 1,0 0," + -r0 + "A" + r0 + "," + r0 + " 0 1,0 0," + r0 + "Z" : "M0," + r1 + "A" + r1 + "," + r1 + " 0 1,1 0," + -r1 + "A" + r1 + "," + r1 + " 0 1,1 0," + r1 + "Z" : r0 ? "M" + r1 * c0 + "," + r1 * s0 + "A" + r1 + "," + r1 + " 0 " + df + ",1 " + r1 * c1 + "," + r1 * s1 + "L" + r0 * c1 + "," + r0 * s1 + "A" + r0 + "," + r0 + " 0 " + df + ",0 " + r0 * c0 + "," + r0 * s0 + "Z" : "M" + r1 * c0 + "," + r1 * s0 + "A" + r1 + "," + r1 + " 0 " + df + ",1 " + r1 * c1 + "," + r1 * s1 + "L0,0" + "Z";
+ var r0 = Math.max(0, +innerRadius.apply(this, arguments)), r1 = Math.max(0, +outerRadius.apply(this, arguments)), a0 = startAngle.apply(this, arguments) - halfπ, a1 = endAngle.apply(this, arguments) - halfπ, da = Math.abs(a1 - a0), cw = a0 > a1 ? 0 : 1;
+ if (r1 < r0) rc = r1, r1 = r0, r0 = rc;
+ if (da >= τε) return circleSegment(r1, cw) + (r0 ? circleSegment(r0, 1 - cw) : "") + "Z";
+ var rc, cr, rp, ap, p0 = 0, p1 = 0, x0, y0, x1, y1, x2, y2, x3, y3, path = [];
+ if (ap = (+padAngle.apply(this, arguments) || 0) / 2) {
+ rp = padRadius === d3_svg_arcAuto ? Math.sqrt(r0 * r0 + r1 * r1) : +padRadius.apply(this, arguments);
+ if (!cw) p1 *= -1;
+ if (r1) p1 = d3_asin(rp / r1 * Math.sin(ap));
+ if (r0) p0 = d3_asin(rp / r0 * Math.sin(ap));
+ }
+ if (r1) {
+ x0 = r1 * Math.cos(a0 + p1);
+ y0 = r1 * Math.sin(a0 + p1);
+ x1 = r1 * Math.cos(a1 - p1);
+ y1 = r1 * Math.sin(a1 - p1);
+ var l1 = Math.abs(a1 - a0 - 2 * p1) <= π ? 0 : 1;
+ if (p1 && d3_svg_arcSweep(x0, y0, x1, y1) === cw ^ l1) {
+ var h1 = (a0 + a1) / 2;
+ x0 = r1 * Math.cos(h1);
+ y0 = r1 * Math.sin(h1);
+ x1 = y1 = null;
+ }
+ } else {
+ x0 = y0 = 0;
+ }
+ if (r0) {
+ x2 = r0 * Math.cos(a1 - p0);
+ y2 = r0 * Math.sin(a1 - p0);
+ x3 = r0 * Math.cos(a0 + p0);
+ y3 = r0 * Math.sin(a0 + p0);
+ var l0 = Math.abs(a0 - a1 + 2 * p0) <= π ? 0 : 1;
+ if (p0 && d3_svg_arcSweep(x2, y2, x3, y3) === 1 - cw ^ l0) {
+ var h0 = (a0 + a1) / 2;
+ x2 = r0 * Math.cos(h0);
+ y2 = r0 * Math.sin(h0);
+ x3 = y3 = null;
+ }
+ } else {
+ x2 = y2 = 0;
+ }
+ if ((rc = Math.min(Math.abs(r1 - r0) / 2, +cornerRadius.apply(this, arguments))) > .001) {
+ cr = r0 < r1 ^ cw ? 0 : 1;
+ var oc = x3 == null ? [ x2, y2 ] : x1 == null ? [ x0, y0 ] : d3_geom_polygonIntersect([ x0, y0 ], [ x3, y3 ], [ x1, y1 ], [ x2, y2 ]), ax = x0 - oc[0], ay = y0 - oc[1], bx = x1 - oc[0], by = y1 - oc[1], kc = 1 / Math.sin(Math.acos((ax * bx + ay * by) / (Math.sqrt(ax * ax + ay * ay) * Math.sqrt(bx * bx + by * by))) / 2), lc = Math.sqrt(oc[0] * oc[0] + oc[1] * oc[1]);
+ if (x1 != null) {
+ var rc1 = Math.min(rc, (r1 - lc) / (kc + 1)), t30 = d3_svg_arcCornerTangents(x3 == null ? [ x2, y2 ] : [ x3, y3 ], [ x0, y0 ], r1, rc1, cw), t12 = d3_svg_arcCornerTangents([ x1, y1 ], [ x2, y2 ], r1, rc1, cw);
+ if (rc === rc1) {
+ path.push("M", t30[0], "A", rc1, ",", rc1, " 0 0,", cr, " ", t30[1], "A", r1, ",", r1, " 0 ", 1 - cw ^ d3_svg_arcSweep(t30[1][0], t30[1][1], t12[1][0], t12[1][1]), ",", cw, " ", t12[1], "A", rc1, ",", rc1, " 0 0,", cr, " ", t12[0]);
+ } else {
+ path.push("M", t30[0], "A", rc1, ",", rc1, " 0 1,", cr, " ", t12[0]);
+ }
+ } else {
+ path.push("M", x0, ",", y0);
+ }
+ if (x3 != null) {
+ var rc0 = Math.min(rc, (r0 - lc) / (kc - 1)), t03 = d3_svg_arcCornerTangents([ x0, y0 ], [ x3, y3 ], r0, -rc0, cw), t21 = d3_svg_arcCornerTangents([ x2, y2 ], x1 == null ? [ x0, y0 ] : [ x1, y1 ], r0, -rc0, cw);
+ if (rc === rc0) {
+ path.push("L", t21[0], "A", rc0, ",", rc0, " 0 0,", cr, " ", t21[1], "A", r0, ",", r0, " 0 ", cw ^ d3_svg_arcSweep(t21[1][0], t21[1][1], t03[1][0], t03[1][1]), ",", 1 - cw, " ", t03[1], "A", rc0, ",", rc0, " 0 0,", cr, " ", t03[0]);
+ } else {
+ path.push("L", t21[0], "A", rc0, ",", rc0, " 0 0,", cr, " ", t03[0]);
+ }
+ } else {
+ path.push("L", x2, ",", y2);
+ }
+ } else {
+ path.push("M", x0, ",", y0);
+ if (x1 != null) path.push("A", r1, ",", r1, " 0 ", l1, ",", cw, " ", x1, ",", y1);
+ path.push("L", x2, ",", y2);
+ if (x3 != null) path.push("A", r0, ",", r0, " 0 ", l0, ",", 1 - cw, " ", x3, ",", y3);
+ }
+ path.push("Z");
+ return path.join("");
+ }
+ function circleSegment(r1, cw) {
+ return "M0," + r1 + "A" + r1 + "," + r1 + " 0 1," + cw + " 0," + -r1 + "A" + r1 + "," + r1 + " 0 1," + cw + " 0," + r1;
}
arc.innerRadius = function(v) {
if (!arguments.length) return innerRadius;
@@ -6832,6 +8026,16 @@ d3 = function() {
outerRadius = d3_functor(v);
return arc;
};
+ arc.cornerRadius = function(v) {
+ if (!arguments.length) return cornerRadius;
+ cornerRadius = d3_functor(v);
+ return arc;
+ };
+ arc.padRadius = function(v) {
+ if (!arguments.length) return padRadius;
+ padRadius = v == d3_svg_arcAuto ? d3_svg_arcAuto : d3_functor(v);
+ return arc;
+ };
arc.startAngle = function(v) {
if (!arguments.length) return startAngle;
startAngle = d3_functor(v);
@@ -6842,13 +8046,18 @@ d3 = function() {
endAngle = d3_functor(v);
return arc;
};
+ arc.padAngle = function(v) {
+ if (!arguments.length) return padAngle;
+ padAngle = d3_functor(v);
+ return arc;
+ };
arc.centroid = function() {
- var r = (innerRadius.apply(this, arguments) + outerRadius.apply(this, arguments)) / 2, a = (startAngle.apply(this, arguments) + endAngle.apply(this, arguments)) / 2 + d3_svg_arcOffset;
+ var r = (+innerRadius.apply(this, arguments) + +outerRadius.apply(this, arguments)) / 2, a = (+startAngle.apply(this, arguments) + +endAngle.apply(this, arguments)) / 2 - halfπ;
return [ Math.cos(a) * r, Math.sin(a) * r ];
};
return arc;
};
- var d3_svg_arcOffset = -π / 2, d3_svg_arcMax = 2 * π - 1e-6;
+ var d3_svg_arcAuto = "auto";
function d3_svg_arcInnerRadius(d) {
return d.innerRadius;
}
@@ -6861,6 +8070,266 @@ d3 = function() {
function d3_svg_arcEndAngle(d) {
return d.endAngle;
}
+ function d3_svg_arcPadAngle(d) {
+ return d && d.padAngle;
+ }
+ function d3_svg_arcSweep(x0, y0, x1, y1) {
+ return (x0 - x1) * y0 - (y0 - y1) * x0 > 0 ? 0 : 1;
+ }
+ function d3_svg_arcCornerTangents(p0, p1, r1, rc, cw) {
+ var x01 = p0[0] - p1[0], y01 = p0[1] - p1[1], lo = (cw ? rc : -rc) / Math.sqrt(x01 * x01 + y01 * y01), ox = lo * y01, oy = -lo * x01, x1 = p0[0] + ox, y1 = p0[1] + oy, x2 = p1[0] + ox, y2 = p1[1] + oy, x3 = (x1 + x2) / 2, y3 = (y1 + y2) / 2, dx = x2 - x1, dy = y2 - y1, d2 = dx * dx + dy * dy, r = r1 - rc, D = x1 * y2 - x2 * y1, d = (dy < 0 ? -1 : 1) * Math.sqrt(r * r * d2 - D * D), cx0 = (D * dy - dx * d) / d2, cy0 = (-D * dx - dy * d) / d2, cx1 = (D * dy + dx * d) / d2, cy1 = (-D * dx + dy * d) / d2, dx0 = cx0 - x3, dy0 = cy0 - y3, dx1 = cx1 - x3, dy1 = cy1 - y3;
+ if (dx0 * dx0 + dy0 * dy0 > dx1 * dx1 + dy1 * dy1) cx0 = cx1, cy0 = cy1;
+ return [ [ cx0 - ox, cy0 - oy ], [ cx0 * r1 / r, cy0 * r1 / r ] ];
+ }
+ function d3_svg_line(projection) {
+ var x = d3_geom_pointX, y = d3_geom_pointY, defined = d3_true, interpolate = d3_svg_lineLinear, interpolateKey = interpolate.key, tension = .7;
+ function line(data) {
+ var segments = [], points = [], i = -1, n = data.length, d, fx = d3_functor(x), fy = d3_functor(y);
+ function segment() {
+ segments.push("M", interpolate(projection(points), tension));
+ }
+ while (++i < n) {
+ if (defined.call(this, d = data[i], i)) {
+ points.push([ +fx.call(this, d, i), +fy.call(this, d, i) ]);
+ } else if (points.length) {
+ segment();
+ points = [];
+ }
+ }
+ if (points.length) segment();
+ return segments.length ? segments.join("") : null;
+ }
+ line.x = function(_) {
+ if (!arguments.length) return x;
+ x = _;
+ return line;
+ };
+ line.y = function(_) {
+ if (!arguments.length) return y;
+ y = _;
+ return line;
+ };
+ line.defined = function(_) {
+ if (!arguments.length) return defined;
+ defined = _;
+ return line;
+ };
+ line.interpolate = function(_) {
+ if (!arguments.length) return interpolateKey;
+ if (typeof _ === "function") interpolateKey = interpolate = _; else interpolateKey = (interpolate = d3_svg_lineInterpolators.get(_) || d3_svg_lineLinear).key;
+ return line;
+ };
+ line.tension = function(_) {
+ if (!arguments.length) return tension;
+ tension = _;
+ return line;
+ };
+ return line;
+ }
+ d3.svg.line = function() {
+ return d3_svg_line(d3_identity);
+ };
+ var d3_svg_lineInterpolators = d3.map({
+ linear: d3_svg_lineLinear,
+ "linear-closed": d3_svg_lineLinearClosed,
+ step: d3_svg_lineStep,
+ "step-before": d3_svg_lineStepBefore,
+ "step-after": d3_svg_lineStepAfter,
+ basis: d3_svg_lineBasis,
+ "basis-open": d3_svg_lineBasisOpen,
+ "basis-closed": d3_svg_lineBasisClosed,
+ bundle: d3_svg_lineBundle,
+ cardinal: d3_svg_lineCardinal,
+ "cardinal-open": d3_svg_lineCardinalOpen,
+ "cardinal-closed": d3_svg_lineCardinalClosed,
+ monotone: d3_svg_lineMonotone
+ });
+ d3_svg_lineInterpolators.forEach(function(key, value) {
+ value.key = key;
+ value.closed = /-closed$/.test(key);
+ });
+ function d3_svg_lineLinear(points) {
+ return points.join("L");
+ }
+ function d3_svg_lineLinearClosed(points) {
+ return d3_svg_lineLinear(points) + "Z";
+ }
+ function d3_svg_lineStep(points) {
+ var i = 0, n = points.length, p = points[0], path = [ p[0], ",", p[1] ];
+ while (++i < n) path.push("H", (p[0] + (p = points[i])[0]) / 2, "V", p[1]);
+ if (n > 1) path.push("H", p[0]);
+ return path.join("");
+ }
+ function d3_svg_lineStepBefore(points) {
+ var i = 0, n = points.length, p = points[0], path = [ p[0], ",", p[1] ];
+ while (++i < n) path.push("V", (p = points[i])[1], "H", p[0]);
+ return path.join("");
+ }
+ function d3_svg_lineStepAfter(points) {
+ var i = 0, n = points.length, p = points[0], path = [ p[0], ",", p[1] ];
+ while (++i < n) path.push("H", (p = points[i])[0], "V", p[1]);
+ return path.join("");
+ }
+ function d3_svg_lineCardinalOpen(points, tension) {
+ return points.length < 4 ? d3_svg_lineLinear(points) : points[1] + d3_svg_lineHermite(points.slice(1, -1), d3_svg_lineCardinalTangents(points, tension));
+ }
+ function d3_svg_lineCardinalClosed(points, tension) {
+ return points.length < 3 ? d3_svg_lineLinear(points) : points[0] + d3_svg_lineHermite((points.push(points[0]),
+ points), d3_svg_lineCardinalTangents([ points[points.length - 2] ].concat(points, [ points[1] ]), tension));
+ }
+ function d3_svg_lineCardinal(points, tension) {
+ return points.length < 3 ? d3_svg_lineLinear(points) : points[0] + d3_svg_lineHermite(points, d3_svg_lineCardinalTangents(points, tension));
+ }
+ function d3_svg_lineHermite(points, tangents) {
+ if (tangents.length < 1 || points.length != tangents.length && points.length != tangents.length + 2) {
+ return d3_svg_lineLinear(points);
+ }
+ var quad = points.length != tangents.length, path = "", p0 = points[0], p = points[1], t0 = tangents[0], t = t0, pi = 1;
+ if (quad) {
+ path += "Q" + (p[0] - t0[0] * 2 / 3) + "," + (p[1] - t0[1] * 2 / 3) + "," + p[0] + "," + p[1];
+ p0 = points[1];
+ pi = 2;
+ }
+ if (tangents.length > 1) {
+ t = tangents[1];
+ p = points[pi];
+ pi++;
+ path += "C" + (p0[0] + t0[0]) + "," + (p0[1] + t0[1]) + "," + (p[0] - t[0]) + "," + (p[1] - t[1]) + "," + p[0] + "," + p[1];
+ for (var i = 2; i < tangents.length; i++, pi++) {
+ p = points[pi];
+ t = tangents[i];
+ path += "S" + (p[0] - t[0]) + "," + (p[1] - t[1]) + "," + p[0] + "," + p[1];
+ }
+ }
+ if (quad) {
+ var lp = points[pi];
+ path += "Q" + (p[0] + t[0] * 2 / 3) + "," + (p[1] + t[1] * 2 / 3) + "," + lp[0] + "," + lp[1];
+ }
+ return path;
+ }
+ function d3_svg_lineCardinalTangents(points, tension) {
+ var tangents = [], a = (1 - tension) / 2, p0, p1 = points[0], p2 = points[1], i = 1, n = points.length;
+ while (++i < n) {
+ p0 = p1;
+ p1 = p2;
+ p2 = points[i];
+ tangents.push([ a * (p2[0] - p0[0]), a * (p2[1] - p0[1]) ]);
+ }
+ return tangents;
+ }
+ function d3_svg_lineBasis(points) {
+ if (points.length < 3) return d3_svg_lineLinear(points);
+ var i = 1, n = points.length, pi = points[0], x0 = pi[0], y0 = pi[1], px = [ x0, x0, x0, (pi = points[1])[0] ], py = [ y0, y0, y0, pi[1] ], path = [ x0, ",", y0, "L", d3_svg_lineDot4(d3_svg_lineBasisBezier3, px), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, py) ];
+ points.push(points[n - 1]);
+ while (++i <= n) {
+ pi = points[i];
+ px.shift();
+ px.push(pi[0]);
+ py.shift();
+ py.push(pi[1]);
+ d3_svg_lineBasisBezier(path, px, py);
+ }
+ points.pop();
+ path.push("L", pi);
+ return path.join("");
+ }
+ function d3_svg_lineBasisOpen(points) {
+ if (points.length < 4) return d3_svg_lineLinear(points);
+ var path = [], i = -1, n = points.length, pi, px = [ 0 ], py = [ 0 ];
+ while (++i < 3) {
+ pi = points[i];
+ px.push(pi[0]);
+ py.push(pi[1]);
+ }
+ path.push(d3_svg_lineDot4(d3_svg_lineBasisBezier3, px) + "," + d3_svg_lineDot4(d3_svg_lineBasisBezier3, py));
+ --i;
+ while (++i < n) {
+ pi = points[i];
+ px.shift();
+ px.push(pi[0]);
+ py.shift();
+ py.push(pi[1]);
+ d3_svg_lineBasisBezier(path, px, py);
+ }
+ return path.join("");
+ }
+ function d3_svg_lineBasisClosed(points) {
+ var path, i = -1, n = points.length, m = n + 4, pi, px = [], py = [];
+ while (++i < 4) {
+ pi = points[i % n];
+ px.push(pi[0]);
+ py.push(pi[1]);
+ }
+ path = [ d3_svg_lineDot4(d3_svg_lineBasisBezier3, px), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, py) ];
+ --i;
+ while (++i < m) {
+ pi = points[i % n];
+ px.shift();
+ px.push(pi[0]);
+ py.shift();
+ py.push(pi[1]);
+ d3_svg_lineBasisBezier(path, px, py);
+ }
+ return path.join("");
+ }
+ function d3_svg_lineBundle(points, tension) {
+ var n = points.length - 1;
+ if (n) {
+ var x0 = points[0][0], y0 = points[0][1], dx = points[n][0] - x0, dy = points[n][1] - y0, i = -1, p, t;
+ while (++i <= n) {
+ p = points[i];
+ t = i / n;
+ p[0] = tension * p[0] + (1 - tension) * (x0 + t * dx);
+ p[1] = tension * p[1] + (1 - tension) * (y0 + t * dy);
+ }
+ }
+ return d3_svg_lineBasis(points);
+ }
+ function d3_svg_lineDot4(a, b) {
+ return a[0] * b[0] + a[1] * b[1] + a[2] * b[2] + a[3] * b[3];
+ }
+ var d3_svg_lineBasisBezier1 = [ 0, 2 / 3, 1 / 3, 0 ], d3_svg_lineBasisBezier2 = [ 0, 1 / 3, 2 / 3, 0 ], d3_svg_lineBasisBezier3 = [ 0, 1 / 6, 2 / 3, 1 / 6 ];
+ function d3_svg_lineBasisBezier(path, x, y) {
+ path.push("C", d3_svg_lineDot4(d3_svg_lineBasisBezier1, x), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier1, y), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier2, x), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier2, y), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, x), ",", d3_svg_lineDot4(d3_svg_lineBasisBezier3, y));
+ }
+ function d3_svg_lineSlope(p0, p1) {
+ return (p1[1] - p0[1]) / (p1[0] - p0[0]);
+ }
+ function d3_svg_lineFiniteDifferences(points) {
+ var i = 0, j = points.length - 1, m = [], p0 = points[0], p1 = points[1], d = m[0] = d3_svg_lineSlope(p0, p1);
+ while (++i < j) {
+ m[i] = (d + (d = d3_svg_lineSlope(p0 = p1, p1 = points[i + 1]))) / 2;
+ }
+ m[i] = d;
+ return m;
+ }
+ function d3_svg_lineMonotoneTangents(points) {
+ var tangents = [], d, a, b, s, m = d3_svg_lineFiniteDifferences(points), i = -1, j = points.length - 1;
+ while (++i < j) {
+ d = d3_svg_lineSlope(points[i], points[i + 1]);
+ if (abs(d) < ε) {
+ m[i] = m[i + 1] = 0;
+ } else {
+ a = m[i] / d;
+ b = m[i + 1] / d;
+ s = a * a + b * b;
+ if (s > 9) {
+ s = d * 3 / Math.sqrt(s);
+ m[i] = s * a;
+ m[i + 1] = s * b;
+ }
+ }
+ }
+ i = -1;
+ while (++i <= j) {
+ s = (points[Math.min(j, i + 1)][0] - points[Math.max(0, i - 1)][0]) / (6 * (1 + m[i] * m[i]));
+ tangents.push([ s || 0, m[i] * s || 0 ]);
+ }
+ return tangents;
+ }
+ function d3_svg_lineMonotone(points) {
+ return points.length < 3 ? d3_svg_lineLinear(points) : points[0] + d3_svg_lineHermite(points, d3_svg_lineMonotoneTangents(points));
+ }
d3.svg.line.radial = function() {
var line = d3_svg_line(d3_svg_lineRadial);
line.radius = line.x, delete line.x;
@@ -6872,14 +8341,14 @@ d3 = function() {
while (++i < n) {
point = points[i];
r = point[0];
- a = point[1] + d3_svg_arcOffset;
+ a = point[1] - halfπ;
point[0] = r * Math.cos(a);
point[1] = r * Math.sin(a);
}
return points;
}
function d3_svg_area(projection) {
- var x0 = d3_svg_lineX, x1 = d3_svg_lineX, y0 = 0, y1 = d3_svg_lineY, defined = d3_true, interpolate = d3_svg_lineLinear, interpolateKey = interpolate.key, interpolateReverse = interpolate, L = "L", tension = .7;
+ var x0 = d3_geom_pointX, x1 = d3_geom_pointX, y0 = 0, y1 = d3_geom_pointY, defined = d3_true, interpolate = d3_svg_lineLinear, interpolateKey = interpolate.key, interpolateReverse = interpolate, L = "L", tension = .7;
function area(data) {
var segments = [], points0 = [], points1 = [], i = -1, n = data.length, d, fx0 = d3_functor(x0), fy0 = d3_functor(y0), fx1 = x0 === x1 ? function() {
return x;
@@ -6973,7 +8442,7 @@ d3 = function() {
return "M" + s.p0 + arc(s.r, s.p1, s.a1 - s.a0) + (equals(s, t) ? curve(s.r, s.p1, s.r, s.p0) : curve(s.r, s.p1, t.r, t.p0) + arc(t.r, t.p1, t.a1 - t.a0) + curve(t.r, t.p1, s.r, s.p0)) + "Z";
}
function subgroup(self, f, d, i) {
- var subgroup = f.call(self, d, i), r = radius.call(self, subgroup, i), a0 = startAngle.call(self, subgroup, i) + d3_svg_arcOffset, a1 = endAngle.call(self, subgroup, i) + d3_svg_arcOffset;
+ var subgroup = f.call(self, d, i), r = radius.call(self, subgroup, i), a0 = startAngle.call(self, subgroup, i) - halfπ, a1 = endAngle.call(self, subgroup, i) - halfπ;
return {
r: r,
a0: a0,
@@ -7063,7 +8532,7 @@ d3 = function() {
};
function d3_svg_diagonalRadialProjection(projection) {
return function() {
- var d = projection.apply(this, arguments), r = d[0], a = d[1] + d3_svg_arcOffset;
+ var d = projection.apply(this, arguments), r = d[0], a = d[1] - halfπ;
return [ r * Math.cos(a), r * Math.sin(a) ];
};
}
@@ -7119,57 +8588,85 @@ d3 = function() {
});
d3.svg.symbolTypes = d3_svg_symbols.keys();
var d3_svg_symbolSqrt3 = Math.sqrt(3), d3_svg_symbolTan30 = Math.tan(30 * d3_radians);
- function d3_transition(groups, id) {
- d3_arraySubclass(groups, d3_transitionPrototype);
+ d3_selectionPrototype.transition = function(name) {
+ var id = d3_transitionInheritId || ++d3_transitionId, ns = d3_transitionNamespace(name), subgroups = [], subgroup, node, transition = d3_transitionInherit || {
+ time: Date.now(),
+ ease: d3_ease_cubicInOut,
+ delay: 0,
+ duration: 250
+ };
+ for (var j = -1, m = this.length; ++j < m; ) {
+ subgroups.push(subgroup = []);
+ for (var group = this[j], i = -1, n = group.length; ++i < n; ) {
+ if (node = group[i]) d3_transitionNode(node, i, ns, id, transition);
+ subgroup.push(node);
+ }
+ }
+ return d3_transition(subgroups, ns, id);
+ };
+ d3_selectionPrototype.interrupt = function(name) {
+ return this.each(name == null ? d3_selection_interrupt : d3_selection_interruptNS(d3_transitionNamespace(name)));
+ };
+ var d3_selection_interrupt = d3_selection_interruptNS(d3_transitionNamespace());
+ function d3_selection_interruptNS(ns) {
+ return function() {
+ var lock, active;
+ if ((lock = this[ns]) && (active = lock[lock.active])) {
+ if (--lock.count) delete lock[lock.active]; else delete this[ns];
+ lock.active += .5;
+ active.event && active.event.interrupt.call(this, this.__data__, active.index);
+ }
+ };
+ }
+ function d3_transition(groups, ns, id) {
+ d3_subclass(groups, d3_transitionPrototype);
+ groups.namespace = ns;
groups.id = id;
return groups;
}
- var d3_transitionPrototype = [], d3_transitionId = 0, d3_transitionInheritId, d3_transitionInherit = {
- ease: d3_ease_cubicInOut,
- delay: 0,
- duration: 250
- };
+ var d3_transitionPrototype = [], d3_transitionId = 0, d3_transitionInheritId, d3_transitionInherit;
d3_transitionPrototype.call = d3_selectionPrototype.call;
d3_transitionPrototype.empty = d3_selectionPrototype.empty;
d3_transitionPrototype.node = d3_selectionPrototype.node;
- d3.transition = function(selection) {
- return arguments.length ? d3_transitionInheritId ? selection.transition() : selection : d3_selectionRoot.transition();
+ d3_transitionPrototype.size = d3_selectionPrototype.size;
+ d3.transition = function(selection, name) {
+ return selection && selection.transition ? d3_transitionInheritId ? selection.transition(name) : selection : d3.selection().transition(selection);
};
d3.transition.prototype = d3_transitionPrototype;
d3_transitionPrototype.select = function(selector) {
- var id = this.id, subgroups = [], subgroup, subnode, node;
- if (typeof selector !== "function") selector = d3_selection_selector(selector);
+ var id = this.id, ns = this.namespace, subgroups = [], subgroup, subnode, node;
+ selector = d3_selection_selector(selector);
for (var j = -1, m = this.length; ++j < m; ) {
subgroups.push(subgroup = []);
for (var group = this[j], i = -1, n = group.length; ++i < n; ) {
- if ((node = group[i]) && (subnode = selector.call(node, node.__data__, i))) {
+ if ((node = group[i]) && (subnode = selector.call(node, node.__data__, i, j))) {
if ("__data__" in node) subnode.__data__ = node.__data__;
- d3_transitionNode(subnode, i, id, node.__transition__[id]);
+ d3_transitionNode(subnode, i, ns, id, node[ns][id]);
subgroup.push(subnode);
} else {
subgroup.push(null);
}
}
}
- return d3_transition(subgroups, id);
+ return d3_transition(subgroups, ns, id);
};
d3_transitionPrototype.selectAll = function(selector) {
- var id = this.id, subgroups = [], subgroup, subnodes, node, subnode, transition;
- if (typeof selector !== "function") selector = d3_selection_selectorAll(selector);
+ var id = this.id, ns = this.namespace, subgroups = [], subgroup, subnodes, node, subnode, transition;
+ selector = d3_selection_selectorAll(selector);
for (var j = -1, m = this.length; ++j < m; ) {
for (var group = this[j], i = -1, n = group.length; ++i < n; ) {
if (node = group[i]) {
- transition = node.__transition__[id];
- subnodes = selector.call(node, node.__data__, i);
+ transition = node[ns][id];
+ subnodes = selector.call(node, node.__data__, i, j);
subgroups.push(subgroup = []);
for (var k = -1, o = subnodes.length; ++k < o; ) {
- d3_transitionNode(subnode = subnodes[k], k, id, transition);
+ if (subnode = subnodes[k]) d3_transitionNode(subnode, k, ns, id, transition);
subgroup.push(subnode);
}
}
}
}
- return d3_transition(subgroups, id);
+ return d3_transition(subgroups, ns, id);
};
d3_transitionPrototype.filter = function(filter) {
var subgroups = [], subgroup, group, node;
@@ -7177,28 +8674,28 @@ d3 = function() {
for (var j = 0, m = this.length; j < m; j++) {
subgroups.push(subgroup = []);
for (var group = this[j], i = 0, n = group.length; i < n; i++) {
- if ((node = group[i]) && filter.call(node, node.__data__, i)) {
+ if ((node = group[i]) && filter.call(node, node.__data__, i, j)) {
subgroup.push(node);
}
}
}
- return d3_transition(subgroups, this.id, this.time).ease(this.ease());
+ return d3_transition(subgroups, this.namespace, this.id);
};
d3_transitionPrototype.tween = function(name, tween) {
- var id = this.id;
- if (arguments.length < 2) return this.node().__transition__[id].tween.get(name);
+ var id = this.id, ns = this.namespace;
+ if (arguments.length < 2) return this.node()[ns][id].tween.get(name);
return d3_selection_each(this, tween == null ? function(node) {
- node.__transition__[id].tween.remove(name);
+ node[ns][id].tween.remove(name);
} : function(node) {
- node.__transition__[id].tween.set(name, tween);
+ node[ns][id].tween.set(name, tween);
});
};
function d3_transition_tween(groups, name, value, tween) {
- var id = groups.id;
+ var id = groups.id, ns = groups.namespace;
return d3_selection_each(groups, typeof value === "function" ? function(node, i, j) {
- node.__transition__[id].tween.set(name, tween(value.call(node, node.__data__, i, j)));
+ node[ns][id].tween.set(name, tween(value.call(node, node.__data__, i, j)));
} : (value = tween(value), function(node) {
- node.__transition__[id].tween.set(name, value);
+ node[ns][id].tween.set(name, value);
}));
}
d3_transitionPrototype.attr = function(nameNS, value) {
@@ -7206,28 +8703,30 @@ d3 = function() {
for (value in nameNS) this.attr(value, nameNS[value]);
return this;
}
- var interpolate = d3_interpolateByName(nameNS), name = d3.ns.qualify(nameNS);
+ var interpolate = nameNS == "transform" ? d3_interpolateTransform : d3_interpolate, name = d3.ns.qualify(nameNS);
function attrNull() {
this.removeAttribute(name);
}
function attrNullNS() {
this.removeAttributeNS(name.space, name.local);
}
- return d3_transition_tween(this, "attr." + nameNS, value, function(b) {
- function attrString() {
+ function attrTween(b) {
+ return b == null ? attrNull : (b += "", function() {
var a = this.getAttribute(name), i;
return a !== b && (i = interpolate(a, b), function(t) {
this.setAttribute(name, i(t));
});
- }
- function attrStringNS() {
+ });
+ }
+ function attrTweenNS(b) {
+ return b == null ? attrNullNS : (b += "", function() {
var a = this.getAttributeNS(name.space, name.local), i;
return a !== b && (i = interpolate(a, b), function(t) {
this.setAttributeNS(name.space, name.local, i(t));
});
- }
- return b == null ? name.local ? attrNullNS : attrNull : (b += "", name.local ? attrStringNS : attrString);
- });
+ });
+ }
+ return d3_transition_tween(this, "attr." + nameNS, value, name.local ? attrTweenNS : attrTween);
};
d3_transitionPrototype.attrTween = function(nameNS, tween) {
var name = d3.ns.qualify(nameNS);
@@ -7255,28 +8754,28 @@ d3 = function() {
}
priority = "";
}
- var interpolate = d3_interpolateByName(name);
function styleNull() {
this.style.removeProperty(name);
}
- return d3_transition_tween(this, "style." + name, value, function(b) {
- function styleString() {
- var a = d3_window.getComputedStyle(this, null).getPropertyValue(name), i;
- return a !== b && (i = interpolate(a, b), function(t) {
+ function styleString(b) {
+ return b == null ? styleNull : (b += "", function() {
+ var a = d3_window(this).getComputedStyle(this, null).getPropertyValue(name), i;
+ return a !== b && (i = d3_interpolate(a, b), function(t) {
this.style.setProperty(name, i(t), priority);
});
- }
- return b == null ? styleNull : (b += "", styleString);
- });
+ });
+ }
+ return d3_transition_tween(this, "style." + name, value, styleString);
};
d3_transitionPrototype.styleTween = function(name, tween, priority) {
if (arguments.length < 3) priority = "";
- return this.tween("style." + name, function(d, i) {
- var f = tween.call(this, d, i, d3_window.getComputedStyle(this, null).getPropertyValue(name));
+ function styleTween(d, i) {
+ var f = tween.call(this, d, i, d3_window(this).getComputedStyle(this, null).getPropertyValue(name));
return f && function(t) {
this.style.setProperty(name, f(t), priority);
};
- });
+ }
+ return this.tween("style." + name, styleTween);
};
d3_transitionPrototype.text = function(value) {
return d3_transition_tween(this, "text", value, d3_transition_text);
@@ -7288,70 +8787,84 @@ d3 = function() {
};
}
d3_transitionPrototype.remove = function() {
+ var ns = this.namespace;
return this.each("end.transition", function() {
var p;
- if (!this.__transition__ && (p = this.parentNode)) p.removeChild(this);
+ if (this[ns].count < 2 && (p = this.parentNode)) p.removeChild(this);
});
};
d3_transitionPrototype.ease = function(value) {
- var id = this.id;
- if (arguments.length < 1) return this.node().__transition__[id].ease;
+ var id = this.id, ns = this.namespace;
+ if (arguments.length < 1) return this.node()[ns][id].ease;
if (typeof value !== "function") value = d3.ease.apply(d3, arguments);
return d3_selection_each(this, function(node) {
- node.__transition__[id].ease = value;
+ node[ns][id].ease = value;
});
};
d3_transitionPrototype.delay = function(value) {
- var id = this.id;
+ var id = this.id, ns = this.namespace;
+ if (arguments.length < 1) return this.node()[ns][id].delay;
return d3_selection_each(this, typeof value === "function" ? function(node, i, j) {
- node.__transition__[id].delay = value.call(node, node.__data__, i, j) | 0;
- } : (value |= 0, function(node) {
- node.__transition__[id].delay = value;
+ node[ns][id].delay = +value.call(node, node.__data__, i, j);
+ } : (value = +value, function(node) {
+ node[ns][id].delay = value;
}));
};
d3_transitionPrototype.duration = function(value) {
- var id = this.id;
+ var id = this.id, ns = this.namespace;
+ if (arguments.length < 1) return this.node()[ns][id].duration;
return d3_selection_each(this, typeof value === "function" ? function(node, i, j) {
- node.__transition__[id].duration = Math.max(1, value.call(node, node.__data__, i, j) | 0);
- } : (value = Math.max(1, value | 0), function(node) {
- node.__transition__[id].duration = value;
+ node[ns][id].duration = Math.max(1, value.call(node, node.__data__, i, j));
+ } : (value = Math.max(1, value), function(node) {
+ node[ns][id].duration = value;
}));
};
d3_transitionPrototype.each = function(type, listener) {
- var id = this.id;
+ var id = this.id, ns = this.namespace;
if (arguments.length < 2) {
var inherit = d3_transitionInherit, inheritId = d3_transitionInheritId;
- d3_transitionInheritId = id;
- d3_selection_each(this, function(node, i, j) {
- d3_transitionInherit = node.__transition__[id];
- type.call(node, node.__data__, i, j);
- });
- d3_transitionInherit = inherit;
- d3_transitionInheritId = inheritId;
+ try {
+ d3_transitionInheritId = id;
+ d3_selection_each(this, function(node, i, j) {
+ d3_transitionInherit = node[ns][id];
+ type.call(node, node.__data__, i, j);
+ });
+ } finally {
+ d3_transitionInherit = inherit;
+ d3_transitionInheritId = inheritId;
+ }
} else {
d3_selection_each(this, function(node) {
- node.__transition__[id].event.on(type, listener);
+ var transition = node[ns][id];
+ (transition.event || (transition.event = d3.dispatch("start", "end", "interrupt"))).on(type, listener);
});
}
return this;
};
d3_transitionPrototype.transition = function() {
- var id0 = this.id, id1 = ++d3_transitionId, subgroups = [], subgroup, group, node, transition;
+ var id0 = this.id, id1 = ++d3_transitionId, ns = this.namespace, subgroups = [], subgroup, group, node, transition;
for (var j = 0, m = this.length; j < m; j++) {
subgroups.push(subgroup = []);
for (var group = this[j], i = 0, n = group.length; i < n; i++) {
if (node = group[i]) {
- transition = Object.create(node.__transition__[id0]);
- transition.delay += transition.duration;
- d3_transitionNode(node, i, id1, transition);
+ transition = node[ns][id0];
+ d3_transitionNode(node, i, ns, id1, {
+ time: transition.time,
+ ease: transition.ease,
+ delay: transition.delay + transition.duration,
+ duration: transition.duration
+ });
}
subgroup.push(node);
}
}
- return d3_transition(subgroups, id1);
+ return d3_transition(subgroups, ns, id1);
};
- function d3_transitionNode(node, i, id, inherit) {
- var lock = node.__transition__ || (node.__transition__ = {
+ function d3_transitionNamespace(name) {
+ return name == null ? "__transition__" : "__transition_" + name + "__";
+ }
+ function d3_transitionNode(node, i, ns, id, inherit) {
+ var lock = node[ns] || (node[ns] = {
active: 0,
count: 0
}), transition = lock[id];
@@ -7359,134 +8872,96 @@ d3 = function() {
var time = inherit.time;
transition = lock[id] = {
tween: new d3_Map(),
- event: d3.dispatch("start", "end"),
time: time,
- ease: inherit.ease,
delay: inherit.delay,
- duration: inherit.duration
+ duration: inherit.duration,
+ ease: inherit.ease,
+ index: i
};
+ inherit = null;
++lock.count;
d3.timer(function(elapsed) {
- var d = node.__data__, ease = transition.ease, event = transition.event, delay = transition.delay, duration = transition.duration, tweened = [];
- return delay <= elapsed ? start(elapsed) : d3.timer(start, delay, time), 1;
+ var delay = transition.delay, duration, ease, timer = d3_timer_active, tweened = [];
+ timer.t = delay + time;
+ if (delay <= elapsed) return start(elapsed - delay);
+ timer.c = start;
function start(elapsed) {
if (lock.active > id) return stop();
+ var active = lock[lock.active];
+ if (active) {
+ --lock.count;
+ delete lock[lock.active];
+ active.event && active.event.interrupt.call(node, node.__data__, active.index);
+ }
lock.active = id;
- event.start.call(node, d, i);
+ transition.event && transition.event.start.call(node, node.__data__, i);
transition.tween.forEach(function(key, value) {
- if (value = value.call(node, d, i)) {
+ if (value = value.call(node, node.__data__, i)) {
tweened.push(value);
}
});
- if (!tick(elapsed)) d3.timer(tick, 0, time);
- return 1;
+ ease = transition.ease;
+ duration = transition.duration;
+ d3.timer(function() {
+ timer.c = tick(elapsed || 1) ? d3_true : tick;
+ return 1;
+ }, 0, time);
}
function tick(elapsed) {
- if (lock.active !== id) return stop();
- var t = (elapsed - delay) / duration, e = ease(t), n = tweened.length;
+ if (lock.active !== id) return 1;
+ var t = elapsed / duration, e = ease(t), n = tweened.length;
while (n > 0) {
tweened[--n].call(node, e);
}
if (t >= 1) {
- stop();
- event.end.call(node, d, i);
- return 1;
+ transition.event && transition.event.end.call(node, node.__data__, i);
+ return stop();
}
}
function stop() {
- if (--lock.count) delete lock[id]; else delete node.__transition__;
+ if (--lock.count) delete lock[id]; else delete node[ns];
return 1;
}
}, 0, time);
- return transition;
}
}
d3.svg.axis = function() {
- var scale = d3.scale.linear(), orient = d3_svg_axisDefaultOrient, tickMajorSize = 6, tickMinorSize = 6, tickEndSize = 6, tickPadding = 3, tickArguments_ = [ 10 ], tickValues = null, tickFormat_, tickSubdivide = 0;
+ var scale = d3.scale.linear(), orient = d3_svg_axisDefaultOrient, innerTickSize = 6, outerTickSize = 6, tickPadding = 3, tickArguments_ = [ 10 ], tickValues = null, tickFormat_;
function axis(g) {
g.each(function() {
var g = d3.select(this);
- var ticks = tickValues == null ? scale.ticks ? scale.ticks.apply(scale, tickArguments_) : scale.domain() : tickValues, tickFormat = tickFormat_ == null ? scale.tickFormat ? scale.tickFormat.apply(scale, tickArguments_) : String : tickFormat_;
- var subticks = d3_svg_axisSubdivide(scale, ticks, tickSubdivide), subtick = g.selectAll(".tick.minor").data(subticks, String), subtickEnter = subtick.enter().insert("line", ".tick").attr("class", "tick minor").style("opacity", 1e-6), subtickExit = d3.transition(subtick.exit()).style("opacity", 1e-6).remove(), subtickUpdate = d3.transition(subtick).style("opacity", 1);
- var tick = g.selectAll(".tick.major").data(ticks, String), tickEnter = tick.enter().insert("g", "path").attr("class", "tick major").style("opacity", 1e-6), tickExit = d3.transition(tick.exit()).style("opacity", 1e-6).remove(), tickUpdate = d3.transition(tick).style("opacity", 1), tickTransform;
- var range = d3_scaleRange(scale), path = g.selectAll(".domain").data([ 0 ]), pathUpdate = (path.enter().append("path").attr("class", "domain"),
+ var scale0 = this.__chart__ || scale, scale1 = this.__chart__ = scale.copy();
+ var ticks = tickValues == null ? scale1.ticks ? scale1.ticks.apply(scale1, tickArguments_) : scale1.domain() : tickValues, tickFormat = tickFormat_ == null ? scale1.tickFormat ? scale1.tickFormat.apply(scale1, tickArguments_) : d3_identity : tickFormat_, tick = g.selectAll(".tick").data(ticks, scale1), tickEnter = tick.enter().insert("g", ".domain").attr("class", "tick").style("opacity", ε), tickExit = d3.transition(tick.exit()).style("opacity", ε).remove(), tickUpdate = d3.transition(tick.order()).style("opacity", 1), tickSpacing = Math.max(innerTickSize, 0) + tickPadding, tickTransform;
+ var range = d3_scaleRange(scale1), path = g.selectAll(".domain").data([ 0 ]), pathUpdate = (path.enter().append("path").attr("class", "domain"),
d3.transition(path));
- var scale1 = scale.copy(), scale0 = this.__chart__ || scale1;
- this.__chart__ = scale1;
tickEnter.append("line");
tickEnter.append("text");
- var lineEnter = tickEnter.select("line"), lineUpdate = tickUpdate.select("line"), text = tick.select("text").text(tickFormat), textEnter = tickEnter.select("text"), textUpdate = tickUpdate.select("text");
- switch (orient) {
- case "bottom":
- {
- tickTransform = d3_svg_axisX;
- subtickEnter.attr("y2", tickMinorSize);
- subtickUpdate.attr("x2", 0).attr("y2", tickMinorSize);
- lineEnter.attr("y2", tickMajorSize);
- textEnter.attr("y", Math.max(tickMajorSize, 0) + tickPadding);
- lineUpdate.attr("x2", 0).attr("y2", tickMajorSize);
- textUpdate.attr("x", 0).attr("y", Math.max(tickMajorSize, 0) + tickPadding);
- text.attr("dy", ".71em").style("text-anchor", "middle");
- pathUpdate.attr("d", "M" + range[0] + "," + tickEndSize + "V0H" + range[1] + "V" + tickEndSize);
- break;
- }
-
- case "top":
- {
- tickTransform = d3_svg_axisX;
- subtickEnter.attr("y2", -tickMinorSize);
- subtickUpdate.attr("x2", 0).attr("y2", -tickMinorSize);
- lineEnter.attr("y2", -tickMajorSize);
- textEnter.attr("y", -(Math.max(tickMajorSize, 0) + tickPadding));
- lineUpdate.attr("x2", 0).attr("y2", -tickMajorSize);
- textUpdate.attr("x", 0).attr("y", -(Math.max(tickMajorSize, 0) + tickPadding));
- text.attr("dy", "0em").style("text-anchor", "middle");
- pathUpdate.attr("d", "M" + range[0] + "," + -tickEndSize + "V0H" + range[1] + "V" + -tickEndSize);
- break;
- }
-
- case "left":
- {
- tickTransform = d3_svg_axisY;
- subtickEnter.attr("x2", -tickMinorSize);
- subtickUpdate.attr("x2", -tickMinorSize).attr("y2", 0);
- lineEnter.attr("x2", -tickMajorSize);
- textEnter.attr("x", -(Math.max(tickMajorSize, 0) + tickPadding));
- lineUpdate.attr("x2", -tickMajorSize).attr("y2", 0);
- textUpdate.attr("x", -(Math.max(tickMajorSize, 0) + tickPadding)).attr("y", 0);
- text.attr("dy", ".32em").style("text-anchor", "end");
- pathUpdate.attr("d", "M" + -tickEndSize + "," + range[0] + "H0V" + range[1] + "H" + -tickEndSize);
- break;
- }
-
- case "right":
- {
- tickTransform = d3_svg_axisY;
- subtickEnter.attr("x2", tickMinorSize);
- subtickUpdate.attr("x2", tickMinorSize).attr("y2", 0);
- lineEnter.attr("x2", tickMajorSize);
- textEnter.attr("x", Math.max(tickMajorSize, 0) + tickPadding);
- lineUpdate.attr("x2", tickMajorSize).attr("y2", 0);
- textUpdate.attr("x", Math.max(tickMajorSize, 0) + tickPadding).attr("y", 0);
- text.attr("dy", ".32em").style("text-anchor", "start");
- pathUpdate.attr("d", "M" + tickEndSize + "," + range[0] + "H0V" + range[1] + "H" + tickEndSize);
- break;
- }
- }
- if (scale.ticks) {
- tickEnter.call(tickTransform, scale0);
- tickUpdate.call(tickTransform, scale1);
- tickExit.call(tickTransform, scale1);
- subtickEnter.call(tickTransform, scale0);
- subtickUpdate.call(tickTransform, scale1);
- subtickExit.call(tickTransform, scale1);
+ var lineEnter = tickEnter.select("line"), lineUpdate = tickUpdate.select("line"), text = tick.select("text").text(tickFormat), textEnter = tickEnter.select("text"), textUpdate = tickUpdate.select("text"), sign = orient === "top" || orient === "left" ? -1 : 1, x1, x2, y1, y2;
+ if (orient === "bottom" || orient === "top") {
+ tickTransform = d3_svg_axisX, x1 = "x", y1 = "y", x2 = "x2", y2 = "y2";
+ text.attr("dy", sign < 0 ? "0em" : ".71em").style("text-anchor", "middle");
+ pathUpdate.attr("d", "M" + range[0] + "," + sign * outerTickSize + "V0H" + range[1] + "V" + sign * outerTickSize);
} else {
- var dx = scale1.rangeBand() / 2, x = function(d) {
- return scale1(d) + dx;
+ tickTransform = d3_svg_axisY, x1 = "y", y1 = "x", x2 = "y2", y2 = "x2";
+ text.attr("dy", ".32em").style("text-anchor", sign < 0 ? "end" : "start");
+ pathUpdate.attr("d", "M" + sign * outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + sign * outerTickSize);
+ }
+ lineEnter.attr(y2, sign * innerTickSize);
+ textEnter.attr(y1, sign * tickSpacing);
+ lineUpdate.attr(x2, 0).attr(y2, sign * innerTickSize);
+ textUpdate.attr(x1, 0).attr(y1, sign * tickSpacing);
+ if (scale1.rangeBand) {
+ var x = scale1, dx = x.rangeBand() / 2;
+ scale0 = scale1 = function(d) {
+ return x(d) + dx;
};
- tickEnter.call(tickTransform, x);
- tickUpdate.call(tickTransform, x);
+ } else if (scale0.rangeBand) {
+ scale0 = scale1;
+ } else {
+ tickExit.call(tickTransform, scale1, scale0);
}
+ tickEnter.call(tickTransform, scale0, scale1);
+ tickUpdate.call(tickTransform, scale1, scale1);
});
}
axis.scale = function(x) {
@@ -7514,12 +8989,21 @@ d3 = function() {
tickFormat_ = x;
return axis;
};
- axis.tickSize = function(x, y) {
- if (!arguments.length) return tickMajorSize;
- var n = arguments.length - 1;
- tickMajorSize = +x;
- tickMinorSize = n > 1 ? +y : tickMajorSize;
- tickEndSize = n > 0 ? +arguments[n] : tickMajorSize;
+ axis.tickSize = function(x) {
+ var n = arguments.length;
+ if (!n) return innerTickSize;
+ innerTickSize = +x;
+ outerTickSize = +arguments[n - 1];
+ return axis;
+ };
+ axis.innerTickSize = function(x) {
+ if (!arguments.length) return innerTickSize;
+ innerTickSize = +x;
+ return axis;
+ };
+ axis.outerTickSize = function(x) {
+ if (!arguments.length) return outerTickSize;
+ outerTickSize = +x;
return axis;
};
axis.tickPadding = function(x) {
@@ -7527,10 +9011,8 @@ d3 = function() {
tickPadding = +x;
return axis;
};
- axis.tickSubdivide = function(x) {
- if (!arguments.length) return tickSubdivide;
- tickSubdivide = +x;
- return axis;
+ axis.tickSubdivide = function() {
+ return arguments.length && axis;
};
return axis;
};
@@ -7540,42 +9022,29 @@ d3 = function() {
bottom: 1,
left: 1
};
- function d3_svg_axisX(selection, x) {
+ function d3_svg_axisX(selection, x0, x1) {
selection.attr("transform", function(d) {
- return "translate(" + x(d) + ",0)";
+ var v0 = x0(d);
+ return "translate(" + (isFinite(v0) ? v0 : x1(d)) + ",0)";
});
}
- function d3_svg_axisY(selection, y) {
+ function d3_svg_axisY(selection, y0, y1) {
selection.attr("transform", function(d) {
- return "translate(0," + y(d) + ")";
+ var v0 = y0(d);
+ return "translate(0," + (isFinite(v0) ? v0 : y1(d)) + ")";
});
}
- function d3_svg_axisSubdivide(scale, ticks, m) {
- subticks = [];
- if (m && ticks.length > 1) {
- var extent = d3_scaleExtent(scale.domain()), subticks, i = -1, n = ticks.length, d = (ticks[1] - ticks[0]) / ++m, j, v;
- while (++i < n) {
- for (j = m; --j > 0; ) {
- if ((v = +ticks[i] - j * d) >= extent[0]) {
- subticks.push(v);
- }
- }
- }
- for (--i, j = 0; ++j < m && (v = +ticks[i] + j * d) < extent[1]; ) {
- subticks.push(v);
- }
- }
- return subticks;
- }
d3.svg.brush = function() {
- var event = d3_eventDispatch(brush, "brushstart", "brush", "brushend"), x = null, y = null, resizes = d3_svg_brushResizes[0], extent = [ [ 0, 0 ], [ 0, 0 ] ], extentDomain;
+ var event = d3_eventDispatch(brush, "brushstart", "brush", "brushend"), x = null, y = null, xExtent = [ 0, 0 ], yExtent = [ 0, 0 ], xExtentDomain, yExtentDomain, xClamp = true, yClamp = true, resizes = d3_svg_brushResizes[0];
function brush(g) {
g.each(function() {
- var g = d3.select(this), bg = g.selectAll(".background").data([ 0 ]), fg = g.selectAll(".extent").data([ 0 ]), tz = g.selectAll(".resize").data(resizes, String), e;
- g.style("pointer-events", "all").on("mousedown.brush", brushstart).on("touchstart.brush", brushstart);
- bg.enter().append("rect").attr("class", "background").style("visibility", "hidden").style("cursor", "crosshair");
- fg.enter().append("rect").attr("class", "extent").style("cursor", "move");
- tz.enter().append("g").attr("class", function(d) {
+ var g = d3.select(this).style("pointer-events", "all").style("-webkit-tap-highlight-color", "rgba(0,0,0,0)").on("mousedown.brush", brushstart).on("touchstart.brush", brushstart);
+ var background = g.selectAll(".background").data([ 0 ]);
+ background.enter().append("rect").attr("class", "background").style("visibility", "hidden").style("cursor", "crosshair");
+ g.selectAll(".extent").data([ 0 ]).enter().append("rect").attr("class", "extent").style("cursor", "move");
+ var resize = g.selectAll(".resize").data(resizes, d3_identity);
+ resize.exit().remove();
+ resize.enter().append("g").attr("class", function(d) {
return "resize " + d;
}).style("cursor", function(d) {
return d3_svg_brushCursor[d];
@@ -7584,45 +9053,105 @@ d3 = function() {
}).attr("y", function(d) {
return /^[ns]/.test(d) ? -3 : null;
}).attr("width", 6).attr("height", 6).style("visibility", "hidden");
- tz.style("display", brush.empty() ? "none" : null);
- tz.exit().remove();
+ resize.style("display", brush.empty() ? "none" : null);
+ var gUpdate = d3.transition(g), backgroundUpdate = d3.transition(background), range;
if (x) {
- e = d3_scaleRange(x);
- bg.attr("x", e[0]).attr("width", e[1] - e[0]);
- redrawX(g);
+ range = d3_scaleRange(x);
+ backgroundUpdate.attr("x", range[0]).attr("width", range[1] - range[0]);
+ redrawX(gUpdate);
}
if (y) {
- e = d3_scaleRange(y);
- bg.attr("y", e[0]).attr("height", e[1] - e[0]);
- redrawY(g);
+ range = d3_scaleRange(y);
+ backgroundUpdate.attr("y", range[0]).attr("height", range[1] - range[0]);
+ redrawY(gUpdate);
}
- redraw(g);
+ redraw(gUpdate);
});
}
+ brush.event = function(g) {
+ g.each(function() {
+ var event_ = event.of(this, arguments), extent1 = {
+ x: xExtent,
+ y: yExtent,
+ i: xExtentDomain,
+ j: yExtentDomain
+ }, extent0 = this.__chart__ || extent1;
+ this.__chart__ = extent1;
+ if (d3_transitionInheritId) {
+ d3.select(this).transition().each("start.brush", function() {
+ xExtentDomain = extent0.i;
+ yExtentDomain = extent0.j;
+ xExtent = extent0.x;
+ yExtent = extent0.y;
+ event_({
+ type: "brushstart"
+ });
+ }).tween("brush:brush", function() {
+ var xi = d3_interpolateArray(xExtent, extent1.x), yi = d3_interpolateArray(yExtent, extent1.y);
+ xExtentDomain = yExtentDomain = null;
+ return function(t) {
+ xExtent = extent1.x = xi(t);
+ yExtent = extent1.y = yi(t);
+ event_({
+ type: "brush",
+ mode: "resize"
+ });
+ };
+ }).each("end.brush", function() {
+ xExtentDomain = extent1.i;
+ yExtentDomain = extent1.j;
+ event_({
+ type: "brush",
+ mode: "resize"
+ });
+ event_({
+ type: "brushend"
+ });
+ });
+ } else {
+ event_({
+ type: "brushstart"
+ });
+ event_({
+ type: "brush",
+ mode: "resize"
+ });
+ event_({
+ type: "brushend"
+ });
+ }
+ });
+ };
function redraw(g) {
g.selectAll(".resize").attr("transform", function(d) {
- return "translate(" + extent[+/e$/.test(d)][0] + "," + extent[+/^s/.test(d)][1] + ")";
+ return "translate(" + xExtent[+/e$/.test(d)] + "," + yExtent[+/^s/.test(d)] + ")";
});
}
function redrawX(g) {
- g.select(".extent").attr("x", extent[0][0]);
- g.selectAll(".extent,.n>rect,.s>rect").attr("width", extent[1][0] - extent[0][0]);
+ g.select(".extent").attr("x", xExtent[0]);
+ g.selectAll(".extent,.n>rect,.s>rect").attr("width", xExtent[1] - xExtent[0]);
}
function redrawY(g) {
- g.select(".extent").attr("y", extent[0][1]);
- g.selectAll(".extent,.e>rect,.w>rect").attr("height", extent[1][1] - extent[0][1]);
+ g.select(".extent").attr("y", yExtent[0]);
+ g.selectAll(".extent,.e>rect,.w>rect").attr("height", yExtent[1] - yExtent[0]);
}
function brushstart() {
- var target = this, eventTarget = d3.select(d3.event.target), event_ = event.of(target, arguments), g = d3.select(target), resizing = eventTarget.datum(), resizingX = !/^(n|s)$/.test(resizing) && x, resizingY = !/^(e|w)$/.test(resizing) && y, dragging = eventTarget.classed("extent"), center, origin = mouse(), offset;
- var w = d3.select(d3_window).on("mousemove.brush", brushmove).on("mouseup.brush", brushend).on("touchmove.brush", brushmove).on("touchend.brush", brushend).on("keydown.brush", keydown).on("keyup.brush", keyup);
+ var target = this, eventTarget = d3.select(d3.event.target), event_ = event.of(target, arguments), g = d3.select(target), resizing = eventTarget.datum(), resizingX = !/^(n|s)$/.test(resizing) && x, resizingY = !/^(e|w)$/.test(resizing) && y, dragging = eventTarget.classed("extent"), dragRestore = d3_event_dragSuppress(target), center, origin = d3.mouse(target), offset;
+ var w = d3.select(d3_window(target)).on("keydown.brush", keydown).on("keyup.brush", keyup);
+ if (d3.event.changedTouches) {
+ w.on("touchmove.brush", brushmove).on("touchend.brush", brushend);
+ } else {
+ w.on("mousemove.brush", brushmove).on("mouseup.brush", brushend);
+ }
+ g.interrupt().selectAll("*").interrupt();
if (dragging) {
- origin[0] = extent[0][0] - origin[0];
- origin[1] = extent[0][1] - origin[1];
+ origin[0] = xExtent[0] - origin[0];
+ origin[1] = yExtent[0] - origin[1];
} else if (resizing) {
var ex = +/w$/.test(resizing), ey = +/^n/.test(resizing);
- offset = [ extent[1 - ex][0] - origin[0], extent[1 - ey][1] - origin[1] ];
- origin[0] = extent[ex][0];
- origin[1] = extent[ey][1];
+ offset = [ xExtent[1 - ex] - origin[0], yExtent[1 - ey] - origin[1] ];
+ origin[0] = xExtent[ex];
+ origin[1] = yExtent[ey];
} else if (d3.event.altKey) center = origin.slice();
g.style("pointer-events", "none").selectAll(".resize").style("display", null);
d3.select("body").style("cursor", eventTarget.style("cursor"));
@@ -7630,41 +9159,36 @@ d3 = function() {
type: "brushstart"
});
brushmove();
- d3_eventCancel();
- function mouse() {
- var touches = d3.event.changedTouches;
- return touches ? d3.touches(target, touches)[0] : d3.mouse(target);
- }
function keydown() {
if (d3.event.keyCode == 32) {
if (!dragging) {
center = null;
- origin[0] -= extent[1][0];
- origin[1] -= extent[1][1];
+ origin[0] -= xExtent[1];
+ origin[1] -= yExtent[1];
dragging = 2;
}
- d3_eventCancel();
+ d3_eventPreventDefault();
}
}
function keyup() {
if (d3.event.keyCode == 32 && dragging == 2) {
- origin[0] += extent[1][0];
- origin[1] += extent[1][1];
+ origin[0] += xExtent[1];
+ origin[1] += yExtent[1];
dragging = 0;
- d3_eventCancel();
+ d3_eventPreventDefault();
}
}
function brushmove() {
- var point = mouse(), moved = false;
+ var point = d3.mouse(target), moved = false;
if (offset) {
point[0] += offset[0];
point[1] += offset[1];
}
if (!dragging) {
if (d3.event.altKey) {
- if (!center) center = [ (extent[0][0] + extent[1][0]) / 2, (extent[0][1] + extent[1][1]) / 2 ];
- origin[0] = extent[+(point[0] < center[0])][0];
- origin[1] = extent[+(point[1] < center[1])][1];
+ if (!center) center = [ (xExtent[0] + xExtent[1]) / 2, (yExtent[0] + yExtent[1]) / 2 ];
+ origin[0] = xExtent[+(point[0] < center[0])];
+ origin[1] = yExtent[+(point[1] < center[1])];
} else center = null;
}
if (resizingX && move1(point, x, 0)) {
@@ -7684,12 +9208,12 @@ d3 = function() {
}
}
function move1(point, scale, i) {
- var range = d3_scaleRange(scale), r0 = range[0], r1 = range[1], position = origin[i], size = extent[1][i] - extent[0][i], min, max;
+ var range = d3_scaleRange(scale), r0 = range[0], r1 = range[1], position = origin[i], extent = i ? yExtent : xExtent, size = extent[1] - extent[0], min, max;
if (dragging) {
r0 -= position;
r1 -= size + position;
}
- min = Math.max(r0, Math.min(r1, point[i]));
+ min = (i ? yClamp : xClamp) ? Math.max(r0, Math.min(r1, point[i])) : point[i];
if (dragging) {
max = (min += position) + size;
} else {
@@ -7701,10 +9225,10 @@ d3 = function() {
max = position;
}
}
- if (extent[0][i] !== min || extent[1][i] !== max) {
- extentDomain = null;
- extent[0][i] = min;
- extent[1][i] = max;
+ if (extent[0] != min || extent[1] != max) {
+ if (i) yExtentDomain = null; else xExtentDomain = null;
+ extent[0] = min;
+ extent[1] = max;
return true;
}
}
@@ -7713,10 +9237,10 @@ d3 = function() {
g.style("pointer-events", "all").selectAll(".resize").style("display", brush.empty() ? "none" : null);
d3.select("body").style("cursor", null);
w.on("mousemove.brush", null).on("mouseup.brush", null).on("touchmove.brush", null).on("touchend.brush", null).on("keydown.brush", null).on("keyup.brush", null);
+ dragRestore();
event_({
type: "brushend"
});
- d3_eventCancel();
}
}
brush.x = function(z) {
@@ -7731,54 +9255,61 @@ d3 = function() {
resizes = d3_svg_brushResizes[!x << 1 | !y];
return brush;
};
+ brush.clamp = function(z) {
+ if (!arguments.length) return x && y ? [ xClamp, yClamp ] : x ? xClamp : y ? yClamp : null;
+ if (x && y) xClamp = !!z[0], yClamp = !!z[1]; else if (x) xClamp = !!z; else if (y) yClamp = !!z;
+ return brush;
+ };
brush.extent = function(z) {
var x0, x1, y0, y1, t;
if (!arguments.length) {
- z = extentDomain || extent;
if (x) {
- x0 = z[0][0], x1 = z[1][0];
- if (!extentDomain) {
- x0 = extent[0][0], x1 = extent[1][0];
+ if (xExtentDomain) {
+ x0 = xExtentDomain[0], x1 = xExtentDomain[1];
+ } else {
+ x0 = xExtent[0], x1 = xExtent[1];
if (x.invert) x0 = x.invert(x0), x1 = x.invert(x1);
if (x1 < x0) t = x0, x0 = x1, x1 = t;
}
}
if (y) {
- y0 = z[0][1], y1 = z[1][1];
- if (!extentDomain) {
- y0 = extent[0][1], y1 = extent[1][1];
+ if (yExtentDomain) {
+ y0 = yExtentDomain[0], y1 = yExtentDomain[1];
+ } else {
+ y0 = yExtent[0], y1 = yExtent[1];
if (y.invert) y0 = y.invert(y0), y1 = y.invert(y1);
if (y1 < y0) t = y0, y0 = y1, y1 = t;
}
}
return x && y ? [ [ x0, y0 ], [ x1, y1 ] ] : x ? [ x0, x1 ] : y && [ y0, y1 ];
}
- extentDomain = [ [ 0, 0 ], [ 0, 0 ] ];
if (x) {
x0 = z[0], x1 = z[1];
if (y) x0 = x0[0], x1 = x1[0];
- extentDomain[0][0] = x0, extentDomain[1][0] = x1;
+ xExtentDomain = [ x0, x1 ];
if (x.invert) x0 = x(x0), x1 = x(x1);
if (x1 < x0) t = x0, x0 = x1, x1 = t;
- extent[0][0] = x0 | 0, extent[1][0] = x1 | 0;
+ if (x0 != xExtent[0] || x1 != xExtent[1]) xExtent = [ x0, x1 ];
}
if (y) {
y0 = z[0], y1 = z[1];
if (x) y0 = y0[1], y1 = y1[1];
- extentDomain[0][1] = y0, extentDomain[1][1] = y1;
+ yExtentDomain = [ y0, y1 ];
if (y.invert) y0 = y(y0), y1 = y(y1);
if (y1 < y0) t = y0, y0 = y1, y1 = t;
- extent[0][1] = y0 | 0, extent[1][1] = y1 | 0;
+ if (y0 != yExtent[0] || y1 != yExtent[1]) yExtent = [ y0, y1 ];
}
return brush;
};
brush.clear = function() {
- extentDomain = null;
- extent[0][0] = extent[0][1] = extent[1][0] = extent[1][1] = 0;
+ if (!brush.empty()) {
+ xExtent = [ 0, 0 ], yExtent = [ 0, 0 ];
+ xExtentDomain = yExtentDomain = null;
+ }
return brush;
};
brush.empty = function() {
- return x && extent[0][0] === extent[1][0] || y && extent[0][1] === extent[1][1];
+ return !!x && xExtent[0] == xExtent[1] || !!y && yExtent[0] == yExtent[1];
};
return d3.rebind(brush, event, "on");
};
@@ -7793,453 +9324,10 @@ d3 = function() {
sw: "nesw-resize"
};
var d3_svg_brushResizes = [ [ "n", "e", "s", "w", "nw", "ne", "se", "sw" ], [ "e", "w" ], [ "n", "s" ], [] ];
- d3.time = {};
- var d3_time = Date, d3_time_daySymbols = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ];
- function d3_time_utc() {
- this._ = new Date(arguments.length > 1 ? Date.UTC.apply(this, arguments) : arguments[0]);
- }
- d3_time_utc.prototype = {
- getDate: function() {
- return this._.getUTCDate();
- },
- getDay: function() {
- return this._.getUTCDay();
- },
- getFullYear: function() {
- return this._.getUTCFullYear();
- },
- getHours: function() {
- return this._.getUTCHours();
- },
- getMilliseconds: function() {
- return this._.getUTCMilliseconds();
- },
- getMinutes: function() {
- return this._.getUTCMinutes();
- },
- getMonth: function() {
- return this._.getUTCMonth();
- },
- getSeconds: function() {
- return this._.getUTCSeconds();
- },
- getTime: function() {
- return this._.getTime();
- },
- getTimezoneOffset: function() {
- return 0;
- },
- valueOf: function() {
- return this._.valueOf();
- },
- setDate: function() {
- d3_time_prototype.setUTCDate.apply(this._, arguments);
- },
- setDay: function() {
- d3_time_prototype.setUTCDay.apply(this._, arguments);
- },
- setFullYear: function() {
- d3_time_prototype.setUTCFullYear.apply(this._, arguments);
- },
- setHours: function() {
- d3_time_prototype.setUTCHours.apply(this._, arguments);
- },
- setMilliseconds: function() {
- d3_time_prototype.setUTCMilliseconds.apply(this._, arguments);
- },
- setMinutes: function() {
- d3_time_prototype.setUTCMinutes.apply(this._, arguments);
- },
- setMonth: function() {
- d3_time_prototype.setUTCMonth.apply(this._, arguments);
- },
- setSeconds: function() {
- d3_time_prototype.setUTCSeconds.apply(this._, arguments);
- },
- setTime: function() {
- d3_time_prototype.setTime.apply(this._, arguments);
- }
- };
- var d3_time_prototype = Date.prototype;
- var d3_time_formatDateTime = "%a %b %e %X %Y", d3_time_formatDate = "%m/%d/%Y", d3_time_formatTime = "%H:%M:%S";
- var d3_time_days = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ], d3_time_dayAbbreviations = [ "Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat" ], d3_time_months = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ], d3_time_monthAbbreviations = [ "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" ];
- function d3_time_interval(local, step, number) {
- function round(date) {
- var d0 = local(date), d1 = offset(d0, 1);
- return date - d0 < d1 - date ? d0 : d1;
- }
- function ceil(date) {
- step(date = local(new d3_time(date - 1)), 1);
- return date;
- }
- function offset(date, k) {
- step(date = new d3_time(+date), k);
- return date;
- }
- function range(t0, t1, dt) {
- var time = ceil(t0), times = [];
- if (dt > 1) {
- while (time < t1) {
- if (!(number(time) % dt)) times.push(new Date(+time));
- step(time, 1);
- }
- } else {
- while (time < t1) times.push(new Date(+time)), step(time, 1);
- }
- return times;
- }
- function range_utc(t0, t1, dt) {
- try {
- d3_time = d3_time_utc;
- var utc = new d3_time_utc();
- utc._ = t0;
- return range(utc, t1, dt);
- } finally {
- d3_time = Date;
- }
- }
- local.floor = local;
- local.round = round;
- local.ceil = ceil;
- local.offset = offset;
- local.range = range;
- var utc = local.utc = d3_time_interval_utc(local);
- utc.floor = utc;
- utc.round = d3_time_interval_utc(round);
- utc.ceil = d3_time_interval_utc(ceil);
- utc.offset = d3_time_interval_utc(offset);
- utc.range = range_utc;
- return local;
- }
- function d3_time_interval_utc(method) {
- return function(date, k) {
- try {
- d3_time = d3_time_utc;
- var utc = new d3_time_utc();
- utc._ = date;
- return method(utc, k)._;
- } finally {
- d3_time = Date;
- }
- };
- }
- d3.time.year = d3_time_interval(function(date) {
- date = d3.time.day(date);
- date.setMonth(0, 1);
- return date;
- }, function(date, offset) {
- date.setFullYear(date.getFullYear() + offset);
- }, function(date) {
- return date.getFullYear();
- });
- d3.time.years = d3.time.year.range;
- d3.time.years.utc = d3.time.year.utc.range;
- d3.time.day = d3_time_interval(function(date) {
- var day = new d3_time(1970, 0);
- day.setFullYear(date.getFullYear(), date.getMonth(), date.getDate());
- return day;
- }, function(date, offset) {
- date.setDate(date.getDate() + offset);
- }, function(date) {
- return date.getDate() - 1;
- });
- d3.time.days = d3.time.day.range;
- d3.time.days.utc = d3.time.day.utc.range;
- d3.time.dayOfYear = function(date) {
- var year = d3.time.year(date);
- return Math.floor((date - year - (date.getTimezoneOffset() - year.getTimezoneOffset()) * 6e4) / 864e5);
- };
- d3_time_daySymbols.forEach(function(day, i) {
- day = day.toLowerCase();
- i = 7 - i;
- var interval = d3.time[day] = d3_time_interval(function(date) {
- (date = d3.time.day(date)).setDate(date.getDate() - (date.getDay() + i) % 7);
- return date;
- }, function(date, offset) {
- date.setDate(date.getDate() + Math.floor(offset) * 7);
- }, function(date) {
- var day = d3.time.year(date).getDay();
- return Math.floor((d3.time.dayOfYear(date) + (day + i) % 7) / 7) - (day !== i);
- });
- d3.time[day + "s"] = interval.range;
- d3.time[day + "s"].utc = interval.utc.range;
- d3.time[day + "OfYear"] = function(date) {
- var day = d3.time.year(date).getDay();
- return Math.floor((d3.time.dayOfYear(date) + (day + i) % 7) / 7);
- };
- });
- d3.time.week = d3.time.sunday;
- d3.time.weeks = d3.time.sunday.range;
- d3.time.weeks.utc = d3.time.sunday.utc.range;
- d3.time.weekOfYear = d3.time.sundayOfYear;
- d3.time.format = function(template) {
- var n = template.length;
- function format(date) {
- var string = [], i = -1, j = 0, c, p, f;
- while (++i < n) {
- if (template.charCodeAt(i) === 37) {
- string.push(template.substring(j, i));
- if ((p = d3_time_formatPads[c = template.charAt(++i)]) != null) c = template.charAt(++i);
- if (f = d3_time_formats[c]) c = f(date, p == null ? c === "e" ? " " : "0" : p);
- string.push(c);
- j = i + 1;
- }
- }
- string.push(template.substring(j, i));
- return string.join("");
- }
- format.parse = function(string) {
- var d = {
- y: 1900,
- m: 0,
- d: 1,
- H: 0,
- M: 0,
- S: 0,
- L: 0
- }, i = d3_time_parse(d, template, string, 0);
- if (i != string.length) return null;
- if ("p" in d) d.H = d.H % 12 + d.p * 12;
- var date = new d3_time();
- date.setFullYear(d.y, d.m, d.d);
- date.setHours(d.H, d.M, d.S, d.L);
- return date;
- };
- format.toString = function() {
- return template;
- };
- return format;
- };
- function d3_time_parse(date, template, string, j) {
- var c, p, i = 0, n = template.length, m = string.length;
- while (i < n) {
- if (j >= m) return -1;
- c = template.charCodeAt(i++);
- if (c === 37) {
- p = d3_time_parsers[template.charAt(i++)];
- if (!p || (j = p(date, string, j)) < 0) return -1;
- } else if (c != string.charCodeAt(j++)) {
- return -1;
- }
- }
- return j;
- }
- function d3_time_formatRe(names) {
- return new RegExp("^(?:" + names.map(d3.requote).join("|") + ")", "i");
- }
- function d3_time_formatLookup(names) {
- var map = new d3_Map(), i = -1, n = names.length;
- while (++i < n) map.set(names[i].toLowerCase(), i);
- return map;
- }
- function d3_time_formatPad(value, fill, width) {
- value += "";
- var length = value.length;
- return length < width ? new Array(width - length + 1).join(fill) + value : value;
- }
- var d3_time_dayRe = d3_time_formatRe(d3_time_days), d3_time_dayAbbrevRe = d3_time_formatRe(d3_time_dayAbbreviations), d3_time_monthRe = d3_time_formatRe(d3_time_months), d3_time_monthLookup = d3_time_formatLookup(d3_time_months), d3_time_monthAbbrevRe = d3_time_formatRe(d3_time_monthAbbreviations), d3_time_monthAbbrevLookup = d3_time_formatLookup(d3_time_monthAbbreviations);
- var d3_time_formatPads = {
- "-": "",
- _: " ",
- "0": "0"
- };
- var d3_time_formats = {
- a: function(d) {
- return d3_time_dayAbbreviations[d.getDay()];
- },
- A: function(d) {
- return d3_time_days[d.getDay()];
- },
- b: function(d) {
- return d3_time_monthAbbreviations[d.getMonth()];
- },
- B: function(d) {
- return d3_time_months[d.getMonth()];
- },
- c: d3.time.format(d3_time_formatDateTime),
- d: function(d, p) {
- return d3_time_formatPad(d.getDate(), p, 2);
- },
- e: function(d, p) {
- return d3_time_formatPad(d.getDate(), p, 2);
- },
- H: function(d, p) {
- return d3_time_formatPad(d.getHours(), p, 2);
- },
- I: function(d, p) {
- return d3_time_formatPad(d.getHours() % 12 || 12, p, 2);
- },
- j: function(d, p) {
- return d3_time_formatPad(1 + d3.time.dayOfYear(d), p, 3);
- },
- L: function(d, p) {
- return d3_time_formatPad(d.getMilliseconds(), p, 3);
- },
- m: function(d, p) {
- return d3_time_formatPad(d.getMonth() + 1, p, 2);
- },
- M: function(d, p) {
- return d3_time_formatPad(d.getMinutes(), p, 2);
- },
- p: function(d) {
- return d.getHours() >= 12 ? "PM" : "AM";
- },
- S: function(d, p) {
- return d3_time_formatPad(d.getSeconds(), p, 2);
- },
- U: function(d, p) {
- return d3_time_formatPad(d3.time.sundayOfYear(d), p, 2);
- },
- w: function(d) {
- return d.getDay();
- },
- W: function(d, p) {
- return d3_time_formatPad(d3.time.mondayOfYear(d), p, 2);
- },
- x: d3.time.format(d3_time_formatDate),
- X: d3.time.format(d3_time_formatTime),
- y: function(d, p) {
- return d3_time_formatPad(d.getFullYear() % 100, p, 2);
- },
- Y: function(d, p) {
- return d3_time_formatPad(d.getFullYear() % 1e4, p, 4);
- },
- Z: d3_time_zone,
- "%": function() {
- return "%";
- }
- };
- var d3_time_parsers = {
- a: d3_time_parseWeekdayAbbrev,
- A: d3_time_parseWeekday,
- b: d3_time_parseMonthAbbrev,
- B: d3_time_parseMonth,
- c: d3_time_parseLocaleFull,
- d: d3_time_parseDay,
- e: d3_time_parseDay,
- H: d3_time_parseHour24,
- I: d3_time_parseHour24,
- L: d3_time_parseMilliseconds,
- m: d3_time_parseMonthNumber,
- M: d3_time_parseMinutes,
- p: d3_time_parseAmPm,
- S: d3_time_parseSeconds,
- x: d3_time_parseLocaleDate,
- X: d3_time_parseLocaleTime,
- y: d3_time_parseYear,
- Y: d3_time_parseFullYear
- };
- function d3_time_parseWeekdayAbbrev(date, string, i) {
- d3_time_dayAbbrevRe.lastIndex = 0;
- var n = d3_time_dayAbbrevRe.exec(string.substring(i));
- return n ? i += n[0].length : -1;
- }
- function d3_time_parseWeekday(date, string, i) {
- d3_time_dayRe.lastIndex = 0;
- var n = d3_time_dayRe.exec(string.substring(i));
- return n ? i += n[0].length : -1;
- }
- function d3_time_parseMonthAbbrev(date, string, i) {
- d3_time_monthAbbrevRe.lastIndex = 0;
- var n = d3_time_monthAbbrevRe.exec(string.substring(i));
- return n ? (date.m = d3_time_monthAbbrevLookup.get(n[0].toLowerCase()), i += n[0].length) : -1;
- }
- function d3_time_parseMonth(date, string, i) {
- d3_time_monthRe.lastIndex = 0;
- var n = d3_time_monthRe.exec(string.substring(i));
- return n ? (date.m = d3_time_monthLookup.get(n[0].toLowerCase()), i += n[0].length) : -1;
- }
- function d3_time_parseLocaleFull(date, string, i) {
- return d3_time_parse(date, d3_time_formats.c.toString(), string, i);
- }
- function d3_time_parseLocaleDate(date, string, i) {
- return d3_time_parse(date, d3_time_formats.x.toString(), string, i);
- }
- function d3_time_parseLocaleTime(date, string, i) {
- return d3_time_parse(date, d3_time_formats.X.toString(), string, i);
- }
- function d3_time_parseFullYear(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 4));
- return n ? (date.y = +n[0], i += n[0].length) : -1;
- }
- function d3_time_parseYear(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 2));
- return n ? (date.y = d3_time_expandYear(+n[0]), i += n[0].length) : -1;
- }
- function d3_time_expandYear(d) {
- return d + (d > 68 ? 1900 : 2e3);
- }
- function d3_time_parseMonthNumber(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 2));
- return n ? (date.m = n[0] - 1, i += n[0].length) : -1;
- }
- function d3_time_parseDay(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 2));
- return n ? (date.d = +n[0], i += n[0].length) : -1;
- }
- function d3_time_parseHour24(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 2));
- return n ? (date.H = +n[0], i += n[0].length) : -1;
- }
- function d3_time_parseMinutes(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 2));
- return n ? (date.M = +n[0], i += n[0].length) : -1;
- }
- function d3_time_parseSeconds(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 2));
- return n ? (date.S = +n[0], i += n[0].length) : -1;
- }
- function d3_time_parseMilliseconds(date, string, i) {
- d3_time_numberRe.lastIndex = 0;
- var n = d3_time_numberRe.exec(string.substring(i, i + 3));
- return n ? (date.L = +n[0], i += n[0].length) : -1;
- }
- var d3_time_numberRe = /^\s*\d+/;
- function d3_time_parseAmPm(date, string, i) {
- var n = d3_time_amPmLookup.get(string.substring(i, i += 2).toLowerCase());
- return n == null ? -1 : (date.p = n, i);
- }
- var d3_time_amPmLookup = d3.map({
- am: 0,
- pm: 1
- });
- function d3_time_zone(d) {
- var z = d.getTimezoneOffset(), zs = z > 0 ? "-" : "+", zh = ~~(Math.abs(z) / 60), zm = Math.abs(z) % 60;
- return zs + d3_time_formatPad(zh, "0", 2) + d3_time_formatPad(zm, "0", 2);
- }
- d3.time.format.utc = function(template) {
- var local = d3.time.format(template);
- function format(date) {
- try {
- d3_time = d3_time_utc;
- var utc = new d3_time();
- utc._ = date;
- return local(utc);
- } finally {
- d3_time = Date;
- }
- }
- format.parse = function(string) {
- try {
- d3_time = d3_time_utc;
- var date = local.parse(string);
- return date && date._;
- } finally {
- d3_time = Date;
- }
- };
- format.toString = local.toString;
- return format;
- };
- var d3_time_formatIso = d3.time.format.utc("%Y-%m-%dT%H:%M:%S.%LZ");
- d3.time.format.iso = Date.prototype.toISOString && +new Date("2000-01-01T00:00:00.000Z") ? d3_time_formatIsoNative : d3_time_formatIso;
+ var d3_time_format = d3_time.format = d3_locale_enUS.timeFormat;
+ var d3_time_formatUtc = d3_time_format.utc;
+ var d3_time_formatIso = d3_time_formatUtc("%Y-%m-%dT%H:%M:%S.%LZ");
+ d3_time_format.iso = Date.prototype.toISOString && +new Date("2000-01-01T00:00:00.000Z") ? d3_time_formatIsoNative : d3_time_formatIso;
function d3_time_formatIsoNative(date) {
return date.toISOString();
}
@@ -8248,36 +9336,36 @@ d3 = function() {
return isNaN(date) ? null : date;
};
d3_time_formatIsoNative.toString = d3_time_formatIso.toString;
- d3.time.second = d3_time_interval(function(date) {
- return new d3_time(Math.floor(date / 1e3) * 1e3);
+ d3_time.second = d3_time_interval(function(date) {
+ return new d3_date(Math.floor(date / 1e3) * 1e3);
}, function(date, offset) {
date.setTime(date.getTime() + Math.floor(offset) * 1e3);
}, function(date) {
return date.getSeconds();
});
- d3.time.seconds = d3.time.second.range;
- d3.time.seconds.utc = d3.time.second.utc.range;
- d3.time.minute = d3_time_interval(function(date) {
- return new d3_time(Math.floor(date / 6e4) * 6e4);
+ d3_time.seconds = d3_time.second.range;
+ d3_time.seconds.utc = d3_time.second.utc.range;
+ d3_time.minute = d3_time_interval(function(date) {
+ return new d3_date(Math.floor(date / 6e4) * 6e4);
}, function(date, offset) {
date.setTime(date.getTime() + Math.floor(offset) * 6e4);
}, function(date) {
return date.getMinutes();
});
- d3.time.minutes = d3.time.minute.range;
- d3.time.minutes.utc = d3.time.minute.utc.range;
- d3.time.hour = d3_time_interval(function(date) {
+ d3_time.minutes = d3_time.minute.range;
+ d3_time.minutes.utc = d3_time.minute.utc.range;
+ d3_time.hour = d3_time_interval(function(date) {
var timezone = date.getTimezoneOffset() / 60;
- return new d3_time((Math.floor(date / 36e5 - timezone) + timezone) * 36e5);
+ return new d3_date((Math.floor(date / 36e5 - timezone) + timezone) * 36e5);
}, function(date, offset) {
date.setTime(date.getTime() + Math.floor(offset) * 36e5);
}, function(date) {
return date.getHours();
});
- d3.time.hours = d3.time.hour.range;
- d3.time.hours.utc = d3.time.hour.utc.range;
- d3.time.month = d3_time_interval(function(date) {
- date = d3.time.day(date);
+ d3_time.hours = d3_time.hour.range;
+ d3_time.hours.utc = d3_time.hour.utc.range;
+ d3_time.month = d3_time_interval(function(date) {
+ date = d3_time.day(date);
date.setDate(1);
return date;
}, function(date, offset) {
@@ -8285,8 +9373,8 @@ d3 = function() {
}, function(date) {
return date.getMonth();
});
- d3.time.months = d3.time.month.range;
- d3.time.months.utc = d3.time.month.utc.range;
+ d3_time.months = d3_time.month.range;
+ d3_time.months.utc = d3_time.month.utc.range;
function d3_time_scale(linear, methods, format) {
function scale(x) {
return linear(x);
@@ -8299,23 +9387,35 @@ d3 = function() {
linear.domain(x);
return scale;
};
- scale.nice = function(m) {
- return scale.domain(d3_scale_nice(scale.domain(), function() {
- return m;
- }));
+ function tickMethod(extent, count) {
+ var span = extent[1] - extent[0], target = span / count, i = d3.bisect(d3_time_scaleSteps, target);
+ return i == d3_time_scaleSteps.length ? [ methods.year, d3_scale_linearTickRange(extent.map(function(d) {
+ return d / 31536e6;
+ }), count)[2] ] : !i ? [ d3_time_scaleMilliseconds, d3_scale_linearTickRange(extent, count)[2] ] : methods[target / d3_time_scaleSteps[i - 1] < d3_time_scaleSteps[i] / target ? i - 1 : i];
+ }
+ scale.nice = function(interval, skip) {
+ var domain = scale.domain(), extent = d3_scaleExtent(domain), method = interval == null ? tickMethod(extent, 10) : typeof interval === "number" && tickMethod(extent, interval);
+ if (method) interval = method[0], skip = method[1];
+ function skipped(date) {
+ return !isNaN(date) && !interval.range(date, d3_time_scaleDate(+date + 1), skip).length;
+ }
+ return scale.domain(d3_scale_nice(domain, skip > 1 ? {
+ floor: function(date) {
+ while (skipped(date = interval.floor(date))) date = d3_time_scaleDate(date - 1);
+ return date;
+ },
+ ceil: function(date) {
+ while (skipped(date = interval.ceil(date))) date = d3_time_scaleDate(+date + 1);
+ return date;
+ }
+ } : interval));
};
- scale.ticks = function(m, k) {
- var extent = d3_time_scaleExtent(scale.domain());
- if (typeof m !== "function") {
- var span = extent[1] - extent[0], target = span / m, i = d3.bisect(d3_time_scaleSteps, target);
- if (i == d3_time_scaleSteps.length) return methods.year(extent, m);
- if (!i) return linear.ticks(m).map(d3_time_scaleDate);
- if (Math.log(target / d3_time_scaleSteps[i - 1]) < Math.log(d3_time_scaleSteps[i] / target)) --i;
- m = methods[i];
- k = m[1];
- m = m[0].range;
- }
- return m(extent[0], new Date(+extent[1] + 1), k);
+ scale.ticks = function(interval, skip) {
+ var extent = d3_scaleExtent(scale.domain()), method = interval == null ? tickMethod(extent, 10) : typeof interval === "number" ? tickMethod(extent, interval) : !interval.range && [ {
+ range: interval
+ }, skip ];
+ if (method) interval = method[0], skip = method[1];
+ return interval.range(extent[0], d3_time_scaleDate(+extent[1] + 1), skip < 1 ? 1 : skip);
};
scale.tickFormat = function() {
return format;
@@ -8323,114 +9423,81 @@ d3 = function() {
scale.copy = function() {
return d3_time_scale(linear.copy(), methods, format);
};
- return d3.rebind(scale, linear, "range", "rangeRound", "interpolate", "clamp");
- }
- function d3_time_scaleExtent(domain) {
- var start = domain[0], stop = domain[domain.length - 1];
- return start < stop ? [ start, stop ] : [ stop, start ];
+ return d3_scale_linearRebind(scale, linear);
}
function d3_time_scaleDate(t) {
return new Date(t);
}
- function d3_time_scaleFormat(formats) {
- return function(date) {
- var i = formats.length - 1, f = formats[i];
- while (!f[1](date)) f = formats[--i];
- return f[0](date);
- };
- }
- function d3_time_scaleSetYear(y) {
- var d = new Date(y, 0, 1);
- d.setFullYear(y);
- return d;
- }
- function d3_time_scaleGetYear(d) {
- var y = d.getFullYear(), d0 = d3_time_scaleSetYear(y), d1 = d3_time_scaleSetYear(y + 1);
- return y + (d - d0) / (d1 - d0);
- }
var d3_time_scaleSteps = [ 1e3, 5e3, 15e3, 3e4, 6e4, 3e5, 9e5, 18e5, 36e5, 108e5, 216e5, 432e5, 864e5, 1728e5, 6048e5, 2592e6, 7776e6, 31536e6 ];
- var d3_time_scaleLocalMethods = [ [ d3.time.second, 1 ], [ d3.time.second, 5 ], [ d3.time.second, 15 ], [ d3.time.second, 30 ], [ d3.time.minute, 1 ], [ d3.time.minute, 5 ], [ d3.time.minute, 15 ], [ d3.time.minute, 30 ], [ d3.time.hour, 1 ], [ d3.time.hour, 3 ], [ d3.time.hour, 6 ], [ d3.time.hour, 12 ], [ d3.time.day, 1 ], [ d3.time.day, 2 ], [ d3.time.week, 1 ], [ d3.time.month, 1 ], [ d3.time.month, 3 ], [ d3.time.year, 1 ] ];
- var d3_time_scaleLocalFormats = [ [ d3.time.format("%Y"), d3_true ], [ d3.time.format("%B"), function(d) {
- return d.getMonth();
- } ], [ d3.time.format("%b %d"), function(d) {
- return d.getDate() != 1;
- } ], [ d3.time.format("%a %d"), function(d) {
- return d.getDay() && d.getDate() != 1;
- } ], [ d3.time.format("%I %p"), function(d) {
- return d.getHours();
- } ], [ d3.time.format("%I:%M"), function(d) {
- return d.getMinutes();
- } ], [ d3.time.format(":%S"), function(d) {
- return d.getSeconds();
- } ], [ d3.time.format(".%L"), function(d) {
+ var d3_time_scaleLocalMethods = [ [ d3_time.second, 1 ], [ d3_time.second, 5 ], [ d3_time.second, 15 ], [ d3_time.second, 30 ], [ d3_time.minute, 1 ], [ d3_time.minute, 5 ], [ d3_time.minute, 15 ], [ d3_time.minute, 30 ], [ d3_time.hour, 1 ], [ d3_time.hour, 3 ], [ d3_time.hour, 6 ], [ d3_time.hour, 12 ], [ d3_time.day, 1 ], [ d3_time.day, 2 ], [ d3_time.week, 1 ], [ d3_time.month, 1 ], [ d3_time.month, 3 ], [ d3_time.year, 1 ] ];
+ var d3_time_scaleLocalFormat = d3_time_format.multi([ [ ".%L", function(d) {
return d.getMilliseconds();
- } ] ];
- var d3_time_scaleLinear = d3.scale.linear(), d3_time_scaleLocalFormat = d3_time_scaleFormat(d3_time_scaleLocalFormats);
- d3_time_scaleLocalMethods.year = function(extent, m) {
- return d3_time_scaleLinear.domain(extent.map(d3_time_scaleGetYear)).ticks(m).map(d3_time_scaleSetYear);
+ } ], [ ":%S", function(d) {
+ return d.getSeconds();
+ } ], [ "%I:%M", function(d) {
+ return d.getMinutes();
+ } ], [ "%I %p", function(d) {
+ return d.getHours();
+ } ], [ "%a %d", function(d) {
+ return d.getDay() && d.getDate() != 1;
+ } ], [ "%b %d", function(d) {
+ return d.getDate() != 1;
+ } ], [ "%B", function(d) {
+ return d.getMonth();
+ } ], [ "%Y", d3_true ] ]);
+ var d3_time_scaleMilliseconds = {
+ range: function(start, stop, step) {
+ return d3.range(Math.ceil(start / step) * step, +stop, step).map(d3_time_scaleDate);
+ },
+ floor: d3_identity,
+ ceil: d3_identity
};
- d3.time.scale = function() {
+ d3_time_scaleLocalMethods.year = d3_time.year;
+ d3_time.scale = function() {
return d3_time_scale(d3.scale.linear(), d3_time_scaleLocalMethods, d3_time_scaleLocalFormat);
};
- var d3_time_scaleUTCMethods = d3_time_scaleLocalMethods.map(function(m) {
+ var d3_time_scaleUtcMethods = d3_time_scaleLocalMethods.map(function(m) {
return [ m[0].utc, m[1] ];
});
- var d3_time_scaleUTCFormats = [ [ d3.time.format.utc("%Y"), d3_true ], [ d3.time.format.utc("%B"), function(d) {
- return d.getUTCMonth();
- } ], [ d3.time.format.utc("%b %d"), function(d) {
- return d.getUTCDate() != 1;
- } ], [ d3.time.format.utc("%a %d"), function(d) {
- return d.getUTCDay() && d.getUTCDate() != 1;
- } ], [ d3.time.format.utc("%I %p"), function(d) {
- return d.getUTCHours();
- } ], [ d3.time.format.utc("%I:%M"), function(d) {
- return d.getUTCMinutes();
- } ], [ d3.time.format.utc(":%S"), function(d) {
- return d.getUTCSeconds();
- } ], [ d3.time.format.utc(".%L"), function(d) {
+ var d3_time_scaleUtcFormat = d3_time_formatUtc.multi([ [ ".%L", function(d) {
return d.getUTCMilliseconds();
- } ] ];
- var d3_time_scaleUTCFormat = d3_time_scaleFormat(d3_time_scaleUTCFormats);
- function d3_time_scaleUTCSetYear(y) {
- var d = new Date(Date.UTC(y, 0, 1));
- d.setUTCFullYear(y);
- return d;
- }
- function d3_time_scaleUTCGetYear(d) {
- var y = d.getUTCFullYear(), d0 = d3_time_scaleUTCSetYear(y), d1 = d3_time_scaleUTCSetYear(y + 1);
- return y + (d - d0) / (d1 - d0);
- }
- d3_time_scaleUTCMethods.year = function(extent, m) {
- return d3_time_scaleLinear.domain(extent.map(d3_time_scaleUTCGetYear)).ticks(m).map(d3_time_scaleUTCSetYear);
- };
- d3.time.scale.utc = function() {
- return d3_time_scale(d3.scale.linear(), d3_time_scaleUTCMethods, d3_time_scaleUTCFormat);
- };
- d3.text = function() {
- return d3.xhr.apply(d3, arguments).response(d3_text);
+ } ], [ ":%S", function(d) {
+ return d.getUTCSeconds();
+ } ], [ "%I:%M", function(d) {
+ return d.getUTCMinutes();
+ } ], [ "%I %p", function(d) {
+ return d.getUTCHours();
+ } ], [ "%a %d", function(d) {
+ return d.getUTCDay() && d.getUTCDate() != 1;
+ } ], [ "%b %d", function(d) {
+ return d.getUTCDate() != 1;
+ } ], [ "%B", function(d) {
+ return d.getUTCMonth();
+ } ], [ "%Y", d3_true ] ]);
+ d3_time_scaleUtcMethods.year = d3_time.year.utc;
+ d3_time.scale.utc = function() {
+ return d3_time_scale(d3.scale.linear(), d3_time_scaleUtcMethods, d3_time_scaleUtcFormat);
};
- function d3_text(request) {
+ d3.text = d3_xhrType(function(request) {
return request.responseText;
- }
+ });
d3.json = function(url, callback) {
- return d3.xhr(url, "application/json", callback).response(d3_json);
+ return d3_xhr(url, "application/json", d3_json, callback);
};
function d3_json(request) {
return JSON.parse(request.responseText);
}
d3.html = function(url, callback) {
- return d3.xhr(url, "text/html", callback).response(d3_html);
+ return d3_xhr(url, "text/html", d3_html, callback);
};
function d3_html(request) {
var range = d3_document.createRange();
range.selectNode(d3_document.body);
return range.createContextualFragment(request.responseText);
}
- d3.xml = function() {
- return d3.xhr.apply(d3, arguments).response(d3_xml);
- };
- function d3_xml(request) {
+ d3.xml = d3_xhrType(function(request) {
return request.responseXML;
- }
- return d3;
+ });
+ if (typeof define === "function" && define.amd) define(d3); else if (typeof module === "object" && module.exports) module.exports = d3;
+ this.d3 = d3;
}(); \ No newline at end of file
diff --git a/addons/web/static/lib/nvd3/nv.d3.css b/addons/web/static/lib/nvd3/nv.d3.css
index cae834827cc..a1f8ef877ef 100755
--- a/addons/web/static/lib/nvd3/nv.d3.css
+++ b/addons/web/static/lib/nvd3/nv.d3.css
@@ -1,769 +1,644 @@
-
-/********************
- * HTML CSS
- */
-
-
-.chartWrap {
- margin: 0;
- padding: 0;
- overflow: hidden;
-}
-
-/********************
- Box shadow and border radius styling
-*/
-.nvtooltip.with-3d-shadow, .with-3d-shadow .nvtooltip {
- -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
- -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
- box-shadow: 0 5px 10px rgba(0,0,0,.2);
-
- -webkit-border-radius: 6px;
- -moz-border-radius: 6px;
- border-radius: 6px;
-}
-
-/********************
- * TOOLTIP CSS
- */
-
-.nvtooltip {
- position: absolute;
- background-color: rgba(255,255,255,1.0);
- padding: 1px;
- border: 1px solid rgba(0,0,0,.2);
- z-index: 10000;
-
- font-family: Arial;
- font-size: 13px;
- text-align: left;
- pointer-events: none;
-
- white-space: nowrap;
-
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
-}
-
-/*Give tooltips that old fade in transition by
- putting a "with-transitions" class on the container div.
-*/
-.nvtooltip.with-transitions, .with-transitions .nvtooltip {
- transition: opacity 250ms linear;
- -moz-transition: opacity 250ms linear;
- -webkit-transition: opacity 250ms linear;
-
- transition-delay: 250ms;
- -moz-transition-delay: 250ms;
- -webkit-transition-delay: 250ms;
-}
-
-.nvtooltip.x-nvtooltip,
-.nvtooltip.y-nvtooltip {
- padding: 8px;
-}
-
-.nvtooltip h3 {
- margin: 0;
- padding: 4px 14px;
- line-height: 18px;
- font-weight: normal;
- background-color: rgba(247,247,247,0.75);
- text-align: center;
-
- border-bottom: 1px solid #ebebeb;
-
- -webkit-border-radius: 5px 5px 0 0;
- -moz-border-radius: 5px 5px 0 0;
- border-radius: 5px 5px 0 0;
-}
-
-.nvtooltip p {
- margin: 0;
- padding: 5px 14px;
- text-align: center;
-}
-
-.nvtooltip span {
- display: inline-block;
- margin: 2px 0;
-}
-
-.nvtooltip table {
- margin: 6px;
- border-spacing:0;
-}
-
-
-.nvtooltip table td {
- padding: 2px 9px 2px 0;
- vertical-align: middle;
-}
-
-.nvtooltip table td.key {
- font-weight:normal;
-}
-.nvtooltip table td.value {
- text-align: right;
- font-weight: bold;
-}
-
-.nvtooltip table tr.highlight td {
- padding: 1px 9px 1px 0;
- border-bottom-style: solid;
- border-bottom-width: 1px;
- border-top-style: solid;
- border-top-width: 1px;
-}
-
-.nvtooltip table td.legend-color-guide div {
- width: 8px;
- height: 8px;
- vertical-align: middle;
-}
-
-.nvtooltip .footer {
- padding: 3px;
- text-align: center;
-}
-
-
-.nvtooltip-pending-removal {
- position: absolute;
- pointer-events: none;
-}
-
-
-/********************
- * SVG CSS
- */
-
-
-svg {
- -webkit-touch-callout: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
- -ms-user-select: none;
- user-select: none;
- /* Trying to get SVG to act like a greedy block in all browsers */
- display: block;
- width:100%;
- height:100%;
-}
-
-
-svg text {
- font: normal 12px Arial;
-}
-
-svg .title {
- font: bold 14px Arial;
-}
-
-.nvd3 .nv-background {
- fill: white;
- fill-opacity: 0;
- /*
- pointer-events: none;
- */
-}
-
-.nvd3.nv-noData {
- font-size: 18px;
- font-weight: bold;
-}
-
-
-/**********
-* Brush
-*/
-
-.nv-brush .extent {
- fill-opacity: .125;
- shape-rendering: crispEdges;
-}
-
-
-
-/**********
-* Legend
-*/
-
-.nvd3 .nv-legend .nv-series {
- cursor: pointer;
-}
-
-.nvd3 .nv-legend .disabled circle {
- fill-opacity: 0;
-}
-
-
-
-/**********
-* Axes
-*/
-.nvd3 .nv-axis {
- pointer-events:none;
-}
-
-.nvd3 .nv-axis path {
- fill: none;
- stroke: #000;
- stroke-opacity: .75;
- shape-rendering: crispEdges;
-}
-
-.nvd3 .nv-axis path.domain {
- stroke-opacity: .75;
-}
-
-.nvd3 .nv-axis.nv-x path.domain {
- stroke-opacity: 0;
-}
-
-.nvd3 .nv-axis line {
- fill: none;
- stroke: #e5e5e5;
- shape-rendering: crispEdges;
-}
-
-.nvd3 .nv-axis .zero line,
-/*this selector may not be necessary*/ .nvd3 .nv-axis line.zero {
- stroke-opacity: .75;
-}
-
-.nvd3 .nv-axis .nv-axisMaxMin text {
- font-weight: bold;
-}
-
-.nvd3 .x .nv-axis .nv-axisMaxMin text,
-.nvd3 .x2 .nv-axis .nv-axisMaxMin text,
-.nvd3 .x3 .nv-axis .nv-axisMaxMin text {
- text-anchor: middle
-}
-
-
-
-/**********
-* Brush
-*/
-
-.nv-brush .resize path {
- fill: #eee;
- stroke: #666;
-}
-
-
-
-/**********
-* Bars
-*/
-
-.nvd3 .nv-bars .negative rect {
- zfill: brown;
-}
-
-.nvd3 .nv-bars rect {
- zfill: steelblue;
- fill-opacity: .75;
-
- transition: fill-opacity 250ms linear;
- -moz-transition: fill-opacity 250ms linear;
- -webkit-transition: fill-opacity 250ms linear;
-}
-
-.nvd3 .nv-bars rect.hover {
+/* nvd3 version 1.8.1-dev (https://github.com/novus/nvd3) 2015-09-10 */
+.nvd3 .nv-axis {
+ pointer-events:none;
+ opacity: 1;
+}
+
+.nvd3 .nv-axis path {
+ fill: none;
+ stroke: #000;
+ stroke-opacity: .75;
+ shape-rendering: crispEdges;
+}
+
+.nvd3 .nv-axis path.domain {
+ stroke-opacity: .75;
+}
+
+.nvd3 .nv-axis.nv-x path.domain {
+ stroke-opacity: 0;
+}
+
+.nvd3 .nv-axis line {
+ fill: none;
+ stroke: #e5e5e5;
+ shape-rendering: crispEdges;
+}
+
+.nvd3 .nv-axis .zero line,
+ /*this selector may not be necessary*/ .nvd3 .nv-axis line.zero {
+ stroke-opacity: .75;
+}
+
+.nvd3 .nv-axis .nv-axisMaxMin text {
+ font-weight: bold;
+}
+
+.nvd3 .x .nv-axis .nv-axisMaxMin text,
+.nvd3 .x2 .nv-axis .nv-axisMaxMin text,
+.nvd3 .x3 .nv-axis .nv-axisMaxMin text {
+ text-anchor: middle
+}
+
+.nvd3 .nv-axis.nv-disabled {
+ opacity: 0;
+}
+
+.nvd3 .nv-bars rect {
+ fill-opacity: .75;
+
+ transition: fill-opacity 250ms linear;
+ -moz-transition: fill-opacity 250ms linear;
+ -webkit-transition: fill-opacity 250ms linear;
+}
+
+.nvd3 .nv-bars rect.hover {
+ fill-opacity: 1;
+}
+
+.nvd3 .nv-bars .hover rect {
+ fill: lightblue;
+}
+
+.nvd3 .nv-bars text {
+ fill: rgba(0,0,0,0);
+}
+
+.nvd3 .nv-bars .hover text {
+ fill: rgba(0,0,0,1);
+}
+
+.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;
+ -moz-transition: fill-opacity 250ms linear;
+ -webkit-transition: fill-opacity 250ms linear;
+}
+
+.nvd3 .nv-multibar .nv-groups rect:hover,
+.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
+.nvd3 .nv-candlestickBar .nv-ticks rect:hover,
+.nvd3 .nv-discretebar .nv-groups rect:hover {
+ fill-opacity: 1;
+}
+
+.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);
+}
+
+/* boxplot CSS */
+.nvd3 .nv-boxplot circle {
+ fill-opacity: 0.5;
+}
+
+.nvd3 .nv-boxplot circle:hover {
fill-opacity: 1;
}
-.nvd3 .nv-bars .hover rect {
- fill: lightblue;
-}
-
-.nvd3 .nv-bars text {
- fill: rgba(0,0,0,0);
-}
-
-.nvd3 .nv-bars .hover text {
- fill: rgba(0,0,0,1);
-}
-
-
-/**********
-* Bars
-*/
-
-.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;
- -moz-transition: fill-opacity 250ms linear;
- -webkit-transition: fill-opacity 250ms linear;
-}
-
-.nvd3 .nv-multibar .nv-groups rect:hover,
-.nvd3 .nv-multibarHorizontal .nv-groups rect:hover,
-.nvd3 .nv-discretebar .nv-groups rect:hover {
+.nvd3 .nv-boxplot rect:hover {
fill-opacity: 1;
}
-.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);
-}
-
-/***********
-* Pie Chart
-*/
-
-.nvd3.nv-pie path {
- stroke-opacity: 0;
- transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
- -moz-transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
- -webkit-transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
-
-}
-
-.nvd3.nv-pie .nv-slice text {
- stroke: #000;
- stroke-width: 0;
-}
-
-.nvd3.nv-pie path {
- stroke: #fff;
- stroke-width: 1px;
- stroke-opacity: 1;
+.nvd3 line.nv-boxplot-median {
+ stroke: black;
}
-.nvd3.nv-pie .hover path {
- fill-opacity: .7;
-}
-.nvd3.nv-pie .nv-label {
- pointer-events: none;
-}
-.nvd3.nv-pie .nv-label rect {
- fill-opacity: 0;
- stroke-opacity: 0;
-}
-
-/**********
-* Lines
-*/
-
-.nvd3 .nv-groups path.nv-line {
- fill: none;
- stroke-width: 1.5px;
- /*
- stroke-linecap: round;
- shape-rendering: geometricPrecision;
-
- transition: stroke-width 250ms linear;
- -moz-transition: stroke-width 250ms linear;
- -webkit-transition: stroke-width 250ms linear;
-
- transition-delay: 250ms
- -moz-transition-delay: 250ms;
- -webkit-transition-delay: 250ms;
- */
-}
-
-.nvd3 .nv-groups path.nv-line.nv-thin-line {
- stroke-width: 1px;
-}
-
-
-.nvd3 .nv-groups path.nv-area {
- stroke: none;
- /*
- stroke-linecap: round;
- shape-rendering: geometricPrecision;
-
+.nv-boxplot-tick:hover {
stroke-width: 2.5px;
- transition: stroke-width 250ms linear;
- -moz-transition: stroke-width 250ms linear;
- -webkit-transition: stroke-width 250ms linear;
-
- transition-delay: 250ms
- -moz-transition-delay: 250ms;
- -webkit-transition-delay: 250ms;
- */
-}
-
-.nvd3 .nv-line.hover path {
- stroke-width: 6px;
-}
-
-/*
-.nvd3.scatter .groups .point {
- fill-opacity: 0.1;
- stroke-opacity: 0.1;
-}
- */
-
-.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
- fill-opacity: 0;
- stroke-opacity: 0;
-}
-
-.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
- fill-opacity: .5 !important;
- stroke-opacity: .5 !important;
-}
-
-
-.with-transitions .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.nv-scatter .nv-groups .nv-point.hover,
-.nvd3 .nv-groups .nv-point.hover {
- stroke-width: 7px;
- fill-opacity: .95 !important;
- stroke-opacity: .95 !important;
-}
-
-
-.nvd3 .nv-point-paths path {
- stroke: #aaa;
- stroke-opacity: 0;
- fill: #eee;
- fill-opacity: 0;
-}
-
-
-
-.nvd3 .nv-indexLine {
- cursor: ew-resize;
-}
-
-
-/**********
-* Distribution
-*/
-
-.nvd3 .nv-distribution {
- pointer-events: none;
-}
-
-
-
-/**********
-* Scatter
-*/
-
-/* **Attempting to remove this for useVoronoi(false), need to see if it's required anywhere
-.nvd3 .nv-groups .nv-point {
- pointer-events: none;
-}
-*/
-
-.nvd3 .nv-groups .nv-point.hover {
- stroke-width: 20px;
- stroke-opacity: .5;
-}
-
-.nvd3 .nv-scatter .nv-point.hover {
- fill-opacity: 1;
-}
-
-/*
-.nv-group.hover .nv-point {
- fill-opacity: 1;
-}
-*/
-
-
-/**********
-* Stacked Area
-*/
-
-.nvd3.nv-stackedarea path.nv-area {
- fill-opacity: .7;
- /*
- stroke-opacity: .65;
- fill-opacity: 1;
- */
- stroke-opacity: 0;
-
- transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
- -moz-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
- -webkit-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
-
- /*
- transition-delay: 500ms;
- -moz-transition-delay: 500ms;
- -webkit-transition-delay: 500ms;
- */
-
-}
-
-.nvd3.nv-stackedarea path.nv-area.hover {
- fill-opacity: .9;
- /*
- stroke-opacity: .85;
- */
-}
-/*
-.d3stackedarea .groups path {
- stroke-opacity: 0;
-}
- */
-
-
-
-.nvd3.nv-stackedarea .nv-groups .nv-point {
- stroke-opacity: 0;
- fill-opacity: 0;
-}
-
-/*
-.nvd3.nv-stackedarea .nv-groups .nv-point.hover {
- stroke-width: 20px;
- stroke-opacity: .75;
- fill-opacity: 1;
-}*/
-
-
-
-/**********
-* Line Plus Bar
-*/
-
-.nvd3.nv-linePlusBar .nv-bar rect {
- fill-opacity: .75;
-}
-
-.nvd3.nv-linePlusBar .nv-bar rect:hover {
- fill-opacity: 1;
-}
-
-
-/**********
-* Bullet
-*/
-
-.nvd3.nv-bullet { font: 10px sans-serif; }
-.nvd3.nv-bullet .nv-measure { fill-opacity: .8; }
-.nvd3.nv-bullet .nv-measure: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-title { font-size: 14px; font-weight: bold; }
-.nvd3.nv-bullet .nv-subtitle { fill: #999; }
-
-
-.nvd3.nv-bullet .nv-range {
- fill: #bababa;
- fill-opacity: .4;
-}
-.nvd3.nv-bullet .nv-range:hover {
- fill-opacity: .7;
-}
-
-
-
-/**********
-* Sparkline
-*/
-
-.nvd3.nv-sparkline path {
- fill: none;
-}
-
-.nvd3.nv-sparklineplus g.nv-hoverValue {
- pointer-events: none;
-}
-
-.nvd3.nv-sparklineplus .nv-hoverValue line {
- stroke: #333;
- stroke-width: 1.5px;
- }
-
-.nvd3.nv-sparklineplus,
-.nvd3.nv-sparklineplus g {
- pointer-events: all;
-}
-
-.nvd3 .nv-hoverArea {
- fill-opacity: 0;
- stroke-opacity: 0;
-}
-
-.nvd3.nv-sparklineplus .nv-xValue,
-.nvd3.nv-sparklineplus .nv-yValue {
- /*
- stroke: #666;
- */
- stroke-width: 0;
- font-size: .9em;
- font-weight: normal;
-}
-
-.nvd3.nv-sparklineplus .nv-yValue {
- stroke: #f66;
-}
-
-.nvd3.nv-sparklineplus .nv-maxValue {
- stroke: #2ca02c;
- fill: #2ca02c;
-}
-
-.nvd3.nv-sparklineplus .nv-minValue {
- stroke: #d62728;
- fill: #d62728;
-}
-
-.nvd3.nv-sparklineplus .nv-currentValue {
- /*
- stroke: #444;
- fill: #000;
- */
- font-weight: bold;
- font-size: 1.1em;
-}
-
-/**********
-* historical stock
-*/
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick {
- stroke-width: 2px;
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
- stroke-width: 4px;
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
- stroke: #2ca02c;
-}
-
-.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
- stroke: #d62728;
-}
-
-.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
-*/
-
-
-/**
- * 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;
-}
-
-.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;
-}
-
-.nvd3.nv-indentedtree .nv-treeicon {
- cursor: pointer;
- /*
- cursor: n-resize;
- */
-}
-
-.nvd3.nv-indentedtree .nv-treeicon.nv-folded {
- cursor: pointer;
- /*
- cursor: s-resize;
- */
-}
-
-/**********
-* Parallel Coordinates
-*/
-
-.nvd3 .background path {
- fill: none;
- stroke: #ccc;
- stroke-opacity: .4;
- shape-rendering: crispEdges;
-}
-
-.nvd3 .foreground path {
- fill: none;
- stroke: steelblue;
- stroke-opacity: .7;
-}
-
-.nvd3 .brush .extent {
- fill-opacity: .3;
- stroke: #fff;
- shape-rendering: crispEdges;
-}
-
-.nvd3 .axis line, .axis path {
- fill: none;
- stroke: #000;
- shape-rendering: crispEdges;
-}
-
-.nvd3 .axis text {
- text-shadow: 0 1px 0 #fff;
-}
-
-/****
-Interactive Layer
-*/
-.nvd3 .nv-interactiveGuideLine {
- pointer-events:none;
}
-.nvd3 line.nv-guideline {
- stroke: #ccc;
-} \ No newline at end of file
+/* bullet */
+.nvd3.nv-bullet { font: 10px sans-serif; }
+.nvd3.nv-bullet .nv-measure { fill-opacity: .8; }
+.nvd3.nv-bullet .nv-measure: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-title { font-size: 14px; font-weight: bold; }
+.nvd3.nv-bullet .nv-subtitle { fill: #999; }
+
+
+.nvd3.nv-bullet .nv-range {
+ fill: #bababa;
+ fill-opacity: .4;
+}
+.nvd3.nv-bullet .nv-range:hover {
+ fill-opacity: .7;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick {
+ stroke-width: 1px;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.hover {
+ stroke-width: 2px;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.positive rect {
+ stroke: #2ca02c;
+ fill: #2ca02c;
+}
+
+.nvd3.nv-candlestickBar .nv-ticks .nv-tick.negative rect {
+ stroke: #d62728;
+ fill: #d62728;
+}
+
+.with-transitions .nv-candlestickBar .nv-ticks .nv-tick {
+ 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.nv-candlestickBar .nv-ticks line {
+ stroke: #333;
+}
+
+
+.nvd3 .nv-legend .nv-disabled rect {
+ /*fill-opacity: 0;*/
+}
+
+.nvd3 .nv-check-box .nv-box {
+ fill-opacity:0;
+ stroke-width:2;
+}
+
+.nvd3 .nv-check-box .nv-check {
+ fill-opacity:0;
+ stroke-width:4;
+}
+
+.nvd3 .nv-series.nv-disabled .nv-check-box .nv-check {
+ fill-opacity:0;
+ stroke-opacity:0;
+}
+
+.nvd3 .nv-controlsWrap .nv-legend .nv-check-box .nv-check {
+ opacity: 0;
+}
+
+/* line plus bar */
+.nvd3.nv-linePlusBar .nv-bar rect {
+ fill-opacity: .75;
+}
+
+.nvd3.nv-linePlusBar .nv-bar rect:hover {
+ fill-opacity: 1;
+}
+.nvd3 .nv-groups path.nv-line {
+ fill: none;
+}
+
+.nvd3 .nv-groups path.nv-area {
+ stroke: none;
+}
+
+.nvd3.nv-line .nvd3.nv-scatter .nv-groups .nv-point {
+ fill-opacity: 0;
+ stroke-opacity: 0;
+}
+
+.nvd3.nv-scatter.nv-single-point .nv-groups .nv-point {
+ fill-opacity: .5 !important;
+ stroke-opacity: .5 !important;
+}
+
+
+.with-transitions .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.nv-scatter .nv-groups .nv-point.hover,
+.nvd3 .nv-groups .nv-point.hover {
+ stroke-width: 7px;
+ fill-opacity: .95 !important;
+ stroke-opacity: .95 !important;
+}
+
+
+.nvd3 .nv-point-paths path {
+ stroke: #aaa;
+ stroke-opacity: 0;
+ fill: #eee;
+ fill-opacity: 0;
+}
+
+
+
+.nvd3 .nv-indexLine {
+ cursor: ew-resize;
+}
+
+/********************
+ * SVG CSS
+ */
+
+/********************
+ Default CSS for an svg element nvd3 used
+*/
+svg.nvd3-svg {
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -ms-user-select: none;
+ -moz-user-select: none;
+ user-select: none;
+ display: block;
+ width:100%;
+ height:100%;
+}
+
+/********************
+ Box shadow and border radius styling
+*/
+.nvtooltip.with-3d-shadow, .with-3d-shadow .nvtooltip {
+ -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
+ -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
+ box-shadow: 0 5px 10px rgba(0,0,0,.2);
+
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+
+
+.nvd3 text {
+ font: normal 12px Arial;
+}
+
+.nvd3 .title {
+ font: bold 14px Arial;
+}
+
+.nvd3 .nv-background {
+ fill: white;
+ fill-opacity: 0;
+}
+
+.nvd3.nv-noData {
+ font-size: 18px;
+ font-weight: bold;
+}
+
+
+/**********
+* Brush
+*/
+
+.nv-brush .extent {
+ fill-opacity: .125;
+ shape-rendering: crispEdges;
+}
+
+.nv-brush .resize path {
+ fill: #eee;
+ stroke: #666;
+}
+
+
+/**********
+* Legend
+*/
+
+.nvd3 .nv-legend .nv-series {
+ cursor: pointer;
+}
+
+.nvd3 .nv-legend .nv-disabled circle {
+ fill-opacity: 0;
+}
+
+/* focus */
+.nvd3 .nv-brush .extent {
+ fill-opacity: 0 !important;
+}
+
+.nvd3 .nv-brushBackground rect {
+ stroke: #000;
+ stroke-width: .4;
+ fill: #fff;
+ fill-opacity: .7;
+}
+
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick {
+ stroke-width: 1px;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.hover {
+ stroke-width: 2px;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.positive {
+ stroke: #2ca02c;
+}
+
+.nvd3.nv-ohlcBar .nv-ticks .nv-tick.negative {
+ stroke: #d62728;
+}
+
+
+.nvd3 .background path {
+ fill: none;
+ stroke: #EEE;
+ stroke-opacity: .4;
+ shape-rendering: crispEdges;
+}
+
+.nvd3 .foreground path {
+ fill: none;
+ stroke-opacity: .7;
+}
+
+.nvd3 .nv-parallelCoordinates-brush .extent
+{
+ fill: #fff;
+ fill-opacity: .6;
+ stroke: gray;
+ shape-rendering: crispEdges;
+}
+
+.nvd3 .nv-parallelCoordinates .hover {
+ fill-opacity: 1;
+ stroke-width: 3px;
+}
+
+
+.nvd3 .missingValuesline line {
+ fill: none;
+ stroke: black;
+ stroke-width: 1;
+ stroke-opacity: 1;
+ stroke-dasharray: 5, 5;
+}
+.nvd3.nv-pie path {
+ stroke-opacity: 0;
+ transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
+ -moz-transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
+ -webkit-transition: fill-opacity 250ms linear, stroke-width 250ms linear, stroke-opacity 250ms linear;
+
+}
+
+.nvd3.nv-pie .nv-pie-title {
+ font-size: 24px;
+ fill: rgba(19, 196, 249, 0.59);
+}
+
+.nvd3.nv-pie .nv-slice text {
+ stroke: #000;
+ stroke-width: 0;
+}
+
+.nvd3.nv-pie path {
+ stroke: #fff;
+ stroke-width: 1px;
+ stroke-opacity: 1;
+}
+
+.nvd3.nv-pie .hover path {
+ fill-opacity: .7;
+}
+.nvd3.nv-pie .nv-label {
+ pointer-events: none;
+}
+.nvd3.nv-pie .nv-label rect {
+ fill-opacity: 0;
+ stroke-opacity: 0;
+}
+
+/* scatter */
+.nvd3 .nv-groups .nv-point.hover {
+ stroke-width: 20px;
+ stroke-opacity: .5;
+}
+
+.nvd3 .nv-scatter .nv-point.hover {
+ fill-opacity: 1;
+}
+.nv-noninteractive {
+ pointer-events: none;
+}
+
+.nv-distx, .nv-disty {
+ pointer-events: none;
+}
+
+/* sparkline */
+.nvd3.nv-sparkline path {
+ fill: none;
+}
+
+.nvd3.nv-sparklineplus g.nv-hoverValue {
+ pointer-events: none;
+}
+
+.nvd3.nv-sparklineplus .nv-hoverValue line {
+ stroke: #333;
+ stroke-width: 1.5px;
+}
+
+.nvd3.nv-sparklineplus,
+.nvd3.nv-sparklineplus g {
+ pointer-events: all;
+}
+
+.nvd3 .nv-hoverArea {
+ fill-opacity: 0;
+ stroke-opacity: 0;
+}
+
+.nvd3.nv-sparklineplus .nv-xValue,
+.nvd3.nv-sparklineplus .nv-yValue {
+ stroke-width: 0;
+ font-size: .9em;
+ font-weight: normal;
+}
+
+.nvd3.nv-sparklineplus .nv-yValue {
+ stroke: #f66;
+}
+
+.nvd3.nv-sparklineplus .nv-maxValue {
+ stroke: #2ca02c;
+ fill: #2ca02c;
+}
+
+.nvd3.nv-sparklineplus .nv-minValue {
+ stroke: #d62728;
+ fill: #d62728;
+}
+
+.nvd3.nv-sparklineplus .nv-currentValue {
+ font-weight: bold;
+ font-size: 1.1em;
+}
+/* stacked area */
+.nvd3.nv-stackedarea path.nv-area {
+ fill-opacity: .7;
+ stroke-opacity: 0;
+ transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+ -moz-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+ -webkit-transition: fill-opacity 250ms linear, stroke-opacity 250ms linear;
+}
+
+.nvd3.nv-stackedarea path.nv-area.hover {
+ fill-opacity: .9;
+}
+
+
+.nvd3.nv-stackedarea .nv-groups .nv-point {
+ stroke-opacity: 0;
+ fill-opacity: 0;
+}
+
+
+.nvtooltip {
+ position: absolute;
+ background-color: rgba(255,255,255,1.0);
+ color: rgba(0,0,0,1.0);
+ padding: 1px;
+ border: 1px solid rgba(0,0,0,.2);
+ z-index: 10000;
+ display: block;
+
+ font-family: Arial;
+ font-size: 13px;
+ text-align: left;
+ pointer-events: none;
+
+ white-space: nowrap;
+
+ -webkit-touch-callout: none;
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+.nvtooltip {
+ background: rgba(255,255,255, 0.8);
+ border: 1px solid rgba(0,0,0,0.5);
+ border-radius: 4px;
+}
+
+/*Give tooltips that old fade in transition by
+ putting a "with-transitions" class on the container div.
+*/
+.nvtooltip.with-transitions, .with-transitions .nvtooltip {
+ transition: opacity 50ms linear;
+ -moz-transition: opacity 50ms linear;
+ -webkit-transition: opacity 50ms linear;
+
+ transition-delay: 200ms;
+ -moz-transition-delay: 200ms;
+ -webkit-transition-delay: 200ms;
+}
+
+.nvtooltip.x-nvtooltip,
+.nvtooltip.y-nvtooltip {
+ padding: 8px;
+}
+
+.nvtooltip h3 {
+ margin: 0;
+ padding: 4px 14px;
+ line-height: 18px;
+ font-weight: normal;
+ background-color: rgba(247,247,247,0.75);
+ color: rgba(0,0,0,1.0);
+ text-align: center;
+
+ border-bottom: 1px solid #ebebeb;
+
+ -webkit-border-radius: 5px 5px 0 0;
+ -moz-border-radius: 5px 5px 0 0;
+ border-radius: 5px 5px 0 0;
+}
+
+.nvtooltip p {
+ margin: 0;
+ padding: 5px 14px;
+ text-align: center;
+}
+
+.nvtooltip span {
+ display: inline-block;
+ margin: 2px 0;
+}
+
+.nvtooltip table {
+ margin: 6px;
+ border-spacing:0;
+}
+
+
+.nvtooltip table td {
+ padding: 2px 9px 2px 0;
+ vertical-align: middle;
+}
+
+.nvtooltip table td.key {
+ font-weight: normal;
+}
+.nvtooltip table td.key.total {
+ font-weight: bold;
+}
+.nvtooltip table td.value {
+ text-align: right;
+ font-weight: bold;
+}
+
+.nvtooltip table tr.highlight td {
+ padding: 1px 9px 1px 0;
+ border-bottom-style: solid;
+ border-bottom-width: 1px;
+ border-top-style: solid;
+ border-top-width: 1px;
+}
+
+.nvtooltip table td.legend-color-guide div {
+ width: 8px;
+ height: 8px;
+ vertical-align: middle;
+}
+
+.nvtooltip table td.legend-color-guide div {
+ width: 12px;
+ height: 12px;
+ border: 1px solid #999;
+}
+
+.nvtooltip .footer {
+ padding: 3px;
+ text-align: center;
+}
+
+.nvtooltip-pending-removal {
+ pointer-events: none;
+ display: none;
+}
+
+
+/****
+Interactive Layer
+*/
+.nvd3 .nv-interactiveGuideLine {
+ pointer-events:none;
+}
+.nvd3 line.nv-guideline {
+ stroke: #ccc;
+}
diff --git a/addons/web/static/lib/nvd3/nv.d3.js b/addons/web/static/lib/nvd3/nv.d3.js
index 1aaff86c786..2a1631984a9 100755
--- a/addons/web/static/lib/nvd3/nv.d3.js
+++ b/addons/web/static/lib/nvd3/nv.d3.js
@@ -1,14368 +1,13222 @@
+/* nvd3 version 1.8.1-dev (https://github.com/novus/nvd3) 2015-09-10 */
(function(){
-var nv = window.nv || {};
-
-
-nv.version = '1.1.15b';
-nv.dev = true //set false when in production
-
-window.nv = nv;
+// set up main nv object
+var nv = {};
+// the major global objects under the nv namespace
+nv.dev = false; //set false when in production
nv.tooltip = nv.tooltip || {}; // For the tooltip system
nv.utils = nv.utils || {}; // Utility subsystem
nv.models = nv.models || {}; //stores all the possible models/components
nv.charts = {}; //stores all the ready to use charts
-nv.graphs = []; //stores all the graphs currently on the page
nv.logs = {}; //stores some statistics and potential error messages
+nv.dom = {}; //DOM manipulation functions
nv.dispatch = d3.dispatch('render_start', 'render_end');
-// *************************************************************************
-// Development render timers - disabled if dev = false
+// Function bind polyfill
+// Needed ONLY for phantomJS as it's missing until version 2.0 which is unreleased as of this comment
+// https://github.com/ariya/phantomjs/issues/10522
+// http://kangax.github.io/compat-table/es5/#Function.prototype.bind
+// phantomJS is used for running the test suite
+if (!Function.prototype.bind) {
+ Function.prototype.bind = function (oThis) {
+ if (typeof this !== "function") {
+ // closest thing possible to the ECMAScript 5 internal IsCallable function
+ throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
+ }
-if (nv.dev) {
- nv.dispatch.on('render_start', function(e) {
- nv.logs.startTime = +new Date();
- });
-
- nv.dispatch.on('render_end', function(e) {
- nv.logs.endTime = +new Date();
- nv.logs.totalTime = nv.logs.endTime - nv.logs.startTime;
- nv.log('total', nv.logs.totalTime); // used for development, to keep track of graph generation times
- });
+ var aArgs = Array.prototype.slice.call(arguments, 1),
+ fToBind = this,
+ fNOP = function () {},
+ fBound = function () {
+ return fToBind.apply(this instanceof fNOP && oThis
+ ? this
+ : oThis,
+ aArgs.concat(Array.prototype.slice.call(arguments)));
+ };
+
+ fNOP.prototype = this.prototype;
+ fBound.prototype = new fNOP();
+ return fBound;
+ };
}
-// ********************************************
-// Public Core NV functions
+// Development render timers - disabled if dev = false
+if (nv.dev) {
+ nv.dispatch.on('render_start', function(e) {
+ nv.logs.startTime = +new Date();
+ });
+
+ nv.dispatch.on('render_end', function(e) {
+ nv.logs.endTime = +new Date();
+ nv.logs.totalTime = nv.logs.endTime - nv.logs.startTime;
+ nv.log('total', nv.logs.totalTime); // used for development, to keep track of graph generation times
+ });
+}
// Logs all arguments, and returns the last so you can test things in place
// Note: in IE8 console.log is an object not a function, and if modernizr is used
// then calling Function.prototype.bind with with anything other than a function
// causes a TypeError to be thrown.
nv.log = function() {
- if (nv.dev && console.log && console.log.apply)
- console.log.apply(console, arguments)
- else if (nv.dev && typeof console.log == "function" && Function.prototype.bind) {
- var log = Function.prototype.bind.call(console.log, console);
- log.apply(console, arguments);
- }
- return arguments[arguments.length - 1];
+ if (nv.dev && window.console && console.log && console.log.apply)
+ console.log.apply(console, arguments);
+ else if (nv.dev && window.console && typeof console.log == "function" && Function.prototype.bind) {
+ var log = Function.prototype.bind.call(console.log, console);
+ log.apply(console, arguments);
+ }
+ return arguments[arguments.length - 1];
};
+// print console warning, should be used by deprecated functions
+nv.deprecated = function(name, info) {
+ if (console && console.warn) {
+ console.warn('nvd3 warning: `' + name + '` has been deprecated. ', info || '');
+ }
+};
+// The nv.render function is used to queue up chart rendering
+// in non-blocking async functions.
+// When all queued charts are done rendering, nv.dispatch.render_end is invoked.
nv.render = function render(step) {
- step = step || 1; // number of graphs to generate in each timeout loop
+ // number of graphs to generate in each timeout loop
+ step = step || 1;
- nv.render.active = true;
- nv.dispatch.render_start();
+ nv.render.active = true;
+ nv.dispatch.render_start();
- setTimeout(function() {
- var chart, graph;
+ var renderLoop = function() {
+ var chart, graph;
- for (var i = 0; i < step && (graph = nv.render.queue[i]); i++) {
- chart = graph.generate();
- if (typeof graph.callback == typeof(Function)) graph.callback(chart);
- nv.graphs.push(chart);
- }
+ for (var i = 0; i < step && (graph = nv.render.queue[i]); i++) {
+ chart = graph.generate();
+ if (typeof graph.callback == typeof(Function)) graph.callback(chart);
+ }
- nv.render.queue.splice(0, i);
+ nv.render.queue.splice(0, i);
- if (nv.render.queue.length) setTimeout(arguments.callee, 0);
- else {
- nv.dispatch.render_end();
- nv.render.active = false;
- }
- }, 0);
+ if (nv.render.queue.length) {
+ setTimeout(renderLoop);
+ }
+ else {
+ nv.dispatch.render_end();
+ nv.render.active = false;
+ }
+ };
+
+ setTimeout(renderLoop);
};
nv.render.active = false;
nv.render.queue = [];
-nv.addGraph = function(obj) {
- if (typeof arguments[0] === typeof(Function))
- obj = {generate: arguments[0], callback: arguments[1]};
+/*
+Adds a chart to the async rendering queue. This method can take arguments in two forms:
+nv.addGraph({
+ generate: <Function>
+ callback: <Function>
+})
- nv.render.queue.push(obj);
+or
- if (!nv.render.active) nv.render();
-};
+nv.addGraph(<generate Function>, <callback Function>)
-nv.identity = function(d) { return d; };
+The generate function should contain code that creates the NVD3 model, sets options
+on it, adds data to an SVG element, and invokes the chart model. The generate function
+should return the chart model. See examples/lineChart.html for a usage example.
-nv.strip = function(s) { return s.replace(/(\s|&)/g,''); };
+The callback function is optional, and it is called when the generate function completes.
+*/
+nv.addGraph = function(obj) {
+ if (typeof arguments[0] === typeof(Function)) {
+ obj = {generate: arguments[0], callback: arguments[1]};
+ }
-function daysInMonth(month,year) {
- return (new Date(year, month+1, 0)).getDate();
-}
+ nv.render.queue.push(obj);
-function d3_time_range(floor, step, number) {
- return function(t0, t1, dt) {
- var time = floor(t0), times = [];
- if (time < t0) step(time);
- if (dt > 1) {
- while (time < t1) {
- var date = new Date(+time);
- if ((number(date) % dt === 0)) times.push(date);
- step(time);
- }
- } else {
- while (time < t1) { times.push(new Date(+time)); step(time); }
+ if (!nv.render.active) {
+ nv.render();
}
- return times;
- };
-}
-
-d3.time.monthEnd = function(date) {
- return new Date(date.getFullYear(), date.getMonth(), 0);
};
-d3.time.monthEnds = d3_time_range(d3.time.monthEnd, function(date) {
- date.setUTCDate(date.getUTCDate() + 1);
- date.setDate(daysInMonth(date.getMonth() + 1, date.getFullYear()));
- }, function(date) {
- return date.getMonth();
- }
-);
-
-/* Utility class to handle creation of an interactive layer.
-This places a rectangle on top of the chart. When you mouse move over it, it sends a dispatch
-containing the X-coordinate. It can also render a vertical line where the mouse is located.
-
-dispatch.elementMousemove is the important event to latch onto. It is fired whenever the mouse moves over
-the rectangle. The dispatch is given one object which contains the mouseX/Y location.
-It also has 'pointXValue', which is the conversion of mouseX to the x-axis scale.
-*/
+// Node/CommonJS exports
+if (typeof(module) !== 'undefined' && typeof(exports) !== 'undefined') {
+ module.exports = nv;
+}
+
+if (typeof(window) !== 'undefined') {
+ window.nv = nv;
+}
+/* Facade for queueing DOM write operations
+ * with Fastdom (https://github.com/wilsonpage/fastdom)
+ * if available.
+ * This could easily be extended to support alternate
+ * implementations in the future.
+ */
+nv.dom.write = function(callback) {
+ if (window.fastdom !== undefined) {
+ return fastdom.write(callback);
+ }
+ return callback();
+};
+
+/* Facade for queueing DOM read operations
+ * with Fastdom (https://github.com/wilsonpage/fastdom)
+ * if available.
+ * This could easily be extended to support alternate
+ * implementations in the future.
+ */
+nv.dom.read = function(callback) {
+ if (window.fastdom !== undefined) {
+ return fastdom.read(callback);
+ }
+ return callback();
+};/* Utility class to handle creation of an interactive layer.
+ This places a rectangle on top of the chart. When you mouse move over it, it sends a dispatch
+ containing the X-coordinate. It can also render a vertical line where the mouse is located.
+
+ dispatch.elementMousemove is the important event to latch onto. It is fired whenever the mouse moves over
+ the rectangle. The dispatch is given one object which contains the mouseX/Y location.
+ It also has 'pointXValue', which is the conversion of mouseX to the x-axis scale.
+ */
nv.interactiveGuideline = function() {
- "use strict";
- var tooltip = nv.models.tooltip();
- //Public settings
- var width = null
- , height = null
- //Please pass in the bounding chart's top and left margins
- //This is important for calculating the correct mouseX/Y positions.
- , margin = {left: 0, top: 0}
- , xScale = d3.scale.linear()
- , yScale = d3.scale.linear()
- , dispatch = d3.dispatch('elementMousemove', 'elementMouseout','elementDblclick')
- , showGuideLine = true
- , svgContainer = null
- //Must pass in the bounding chart's <svg> container.
- //The mousemove event is attached to this container.
- ;
-
- //Private variables
- var isMSIE = navigator.userAgent.indexOf("MSIE") !== -1 //Check user-agent for Microsoft Internet Explorer.
- ;
-
-
- function layer(selection) {
- selection.each(function(data) {
- var container = d3.select(this);
-
- var availableWidth = (width || 960), availableHeight = (height || 400);
-
- var wrap = container.selectAll("g.nv-wrap.nv-interactiveLineLayer").data([data]);
- var wrapEnter = wrap.enter()
- .append("g").attr("class", " nv-wrap nv-interactiveLineLayer");
-
-
- wrapEnter.append("g").attr("class","nv-interactiveGuideLine");
-
- if (!svgContainer) {
- return;
- }
-
- function mouseHandler() {
- var d3mouse = d3.mouse(this);
- var mouseX = d3mouse[0];
- var mouseY = d3mouse[1];
- var subtractMargin = true;
- var mouseOutAnyReason = false;
- if (isMSIE) {
- /*
- D3.js (or maybe SVG.getScreenCTM) has a nasty bug in Internet Explorer 10.
- d3.mouse() returns incorrect X,Y mouse coordinates when mouse moving
- over a rect in IE 10.
- However, d3.event.offsetX/Y also returns the mouse coordinates
- relative to the triggering <rect>. So we use offsetX/Y on IE.
- */
- mouseX = d3.event.offsetX;
- mouseY = d3.event.offsetY;
-
- /*
- On IE, if you attach a mouse event listener to the <svg> container,
- it will actually trigger it for all the child elements (like <path>, <circle>, etc).
- When this happens on IE, the offsetX/Y is set to where ever the child element
- is located.
- As a result, we do NOT need to subtract margins to figure out the mouse X/Y
- position under this scenario. Removing the line below *will* cause
- the interactive layer to not work right on IE.
- */
- if(d3.event.target.tagName !== "svg")
- subtractMargin = false;
-
- if (d3.event.target.className.baseVal.match("nv-legend"))
- mouseOutAnyReason = true;
-
- }
-
- if(subtractMargin) {
- mouseX -= margin.left;
- mouseY -= margin.top;
- }
-
- /* If mouseX/Y is outside of the chart's bounds,
- trigger a mouseOut event.
- */
- if (mouseX < 0 || mouseY < 0
- || mouseX > availableWidth || mouseY > availableHeight
- || (d3.event.relatedTarget && d3.event.relatedTarget.ownerSVGElement === undefined)
- || mouseOutAnyReason
- )
- {
- if (isMSIE) {
- if (d3.event.relatedTarget
- && d3.event.relatedTarget.ownerSVGElement === undefined
- && d3.event.relatedTarget.className.match(tooltip.nvPointerEventsClass)) {
- return;
- }
- }
- dispatch.elementMouseout({
- mouseX: mouseX,
- mouseY: mouseY
- });
- layer.renderGuideLine(null); //hide the guideline
+ "use strict";
+
+ var margin = { left: 0, top: 0 } //Pass the chart's top and left magins. Used to calculate the mouseX/Y.
+ , width = null
+ , height = null
+ , xScale = d3.scale.linear()
+ , dispatch = d3.dispatch('elementMousemove', 'elementMouseout', 'elementClick', 'elementDblclick', 'elementMouseDown', 'elementMouseUp')
+ , showGuideLine = true
+ , svgContainer = null // Must pass the chart's svg, we'll use its mousemove event.
+ , tooltip = nv.models.tooltip()
+ , isMSIE = "ActiveXObject" in window // Checkt if IE by looking for activeX.
+ ;
+
+ tooltip
+ .duration(0)
+ .hideDelay(0)
+ .hidden(false);
+
+ function layer(selection) {
+ selection.each(function(data) {
+ var container = d3.select(this);
+ var availableWidth = (width || 960), availableHeight = (height || 400);
+ var wrap = container.selectAll("g.nv-wrap.nv-interactiveLineLayer")
+ .data([data]);
+ var wrapEnter = wrap.enter()
+ .append("g").attr("class", " nv-wrap nv-interactiveLineLayer");
+ wrapEnter.append("g").attr("class","nv-interactiveGuideLine");
+
+ if (!svgContainer) {
+ return;
+ }
+
+ function mouseHandler() {
+ var d3mouse = d3.mouse(this);
+ var mouseX = d3mouse[0];
+ var mouseY = d3mouse[1];
+ var subtractMargin = true;
+ var mouseOutAnyReason = false;
+ if (isMSIE) {
+ /*
+ D3.js (or maybe SVG.getScreenCTM) has a nasty bug in Internet Explorer 10.
+ d3.mouse() returns incorrect X,Y mouse coordinates when mouse moving
+ over a rect in IE 10.
+ However, d3.event.offsetX/Y also returns the mouse coordinates
+ relative to the triggering <rect>. So we use offsetX/Y on IE.
+ */
+ mouseX = d3.event.offsetX;
+ mouseY = d3.event.offsetY;
+
+ /*
+ On IE, if you attach a mouse event listener to the <svg> container,
+ it will actually trigger it for all the child elements (like <path>, <circle>, etc).
+ When this happens on IE, the offsetX/Y is set to where ever the child element
+ is located.
+ As a result, we do NOT need to subtract margins to figure out the mouse X/Y
+ position under this scenario. Removing the line below *will* cause
+ the interactive layer to not work right on IE.
+ */
+ if(d3.event.target.tagName !== "svg") {
+ subtractMargin = false;
+ }
+
+ if (d3.event.target.className.baseVal.match("nv-legend")) {
+ mouseOutAnyReason = true;
+ }
+
+ }
+
+ if(subtractMargin) {
+ mouseX -= margin.left;
+ mouseY -= margin.top;
+ }
+
+ /* If mouseX/Y is outside of the chart's bounds,
+ trigger a mouseOut event.
+ */
+ if (mouseX < 0 || mouseY < 0
+ || mouseX > availableWidth || mouseY > availableHeight
+ || (d3.event.relatedTarget && d3.event.relatedTarget.ownerSVGElement === undefined)
+ || mouseOutAnyReason
+ ) {
+
+ if (isMSIE) {
+ if (d3.event.relatedTarget
+ && d3.event.relatedTarget.ownerSVGElement === undefined
+ && (d3.event.relatedTarget.className === undefined
+ || d3.event.relatedTarget.className.match(tooltip.nvPointerEventsClass))) {
+
return;
- }
-
- var pointXValue = xScale.invert(mouseX);
- dispatch.elementMousemove({
- mouseX: mouseX,
- mouseY: mouseY,
- pointXValue: pointXValue
- });
-
- //If user double clicks the layer, fire a elementDblclick dispatch.
- if (d3.event.type === "dblclick") {
- dispatch.elementDblclick({
- mouseX: mouseX,
- mouseY: mouseY,
- pointXValue: pointXValue
- });
- }
+ }
+ }
+ dispatch.elementMouseout({
+ mouseX: mouseX,
+ mouseY: mouseY
+ });
+ layer.renderGuideLine(null); //hide the guideline
+ tooltip.hidden(true);
+ return;
+ } else {
+ tooltip.hidden(false);
+ }
+
+ var pointXValue = xScale.invert(mouseX);
+ dispatch.elementMousemove({
+ mouseX: mouseX,
+ mouseY: mouseY,
+ pointXValue: pointXValue
+ });
+
+ //If user double clicks the layer, fire a elementDblclick
+ if (d3.event.type === "dblclick") {
+ dispatch.elementDblclick({
+ mouseX: mouseX,
+ mouseY: mouseY,
+ pointXValue: pointXValue
+ });
+ }
+
+ // if user single clicks the layer, fire elementClick
+ if (d3.event.type === 'click') {
+ dispatch.elementClick({
+ mouseX: mouseX,
+ mouseY: mouseY,
+ pointXValue: pointXValue
+ });
}
- svgContainer
- .on("mousemove",mouseHandler, true)
- .on("mouseout" ,mouseHandler,true)
- .on("dblclick" ,mouseHandler)
- ;
-
- //Draws a vertical guideline at the given X postion.
- layer.renderGuideLine = function(x) {
- if (!showGuideLine) return;
- var line = wrap.select(".nv-interactiveGuideLine")
- .selectAll("line")
- .data((x != null) ? [nv.utils.NaNtoZero(x)] : [], String);
-
- line.enter()
- .append("line")
- .attr("class", "nv-guideline")
- .attr("x1", function(d) { return d;})
- .attr("x2", function(d) { return d;})
- .attr("y1", availableHeight)
- .attr("y2",0)
- ;
- line.exit().remove();
-
- }
- });
- }
-
- layer.dispatch = dispatch;
- layer.tooltip = tooltip;
-
- layer.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return layer;
+ // if user presses mouse down the layer, fire elementMouseDown
+ if (d3.event.type === 'mousedown') {
+ dispatch.elementMouseDown({
+ mouseX: mouseX,
+ mouseY: mouseY,
+ pointXValue: pointXValue
+ });
+ }
+
+ // if user presses mouse down the layer, fire elementMouseUp
+ if (d3.event.type === 'mouseup') {
+ dispatch.elementMouseUp({
+ mouseX: mouseX,
+ mouseY: mouseY,
+ pointXValue: pointXValue
+ });
+ }
+ }
+
+ svgContainer
+ .on("touchmove",mouseHandler)
+ .on("mousemove",mouseHandler, true)
+ .on("mouseout" ,mouseHandler,true)
+ .on("mousedown" ,mouseHandler,true)
+ .on("mouseup" ,mouseHandler,true)
+ .on("dblclick" ,mouseHandler)
+ .on("click", mouseHandler)
+ ;
+
+ layer.guideLine = null;
+ //Draws a vertical guideline at the given X postion.
+ layer.renderGuideLine = function(x) {
+ if (!showGuideLine) return;
+ if (layer.guideLine && layer.guideLine.attr("x1") === x) return;
+ nv.dom.write(function() {
+ var line = wrap.select(".nv-interactiveGuideLine")
+ .selectAll("line")
+ .data((x != null) ? [nv.utils.NaNtoZero(x)] : [], String);
+ line.enter()
+ .append("line")
+ .attr("class", "nv-guideline")
+ .attr("x1", function(d) { return d;})
+ .attr("x2", function(d) { return d;})
+ .attr("y1", availableHeight)
+ .attr("y2",0);
+ line.exit().remove();
+ });
+ }
+ });
+ }
+
+ layer.dispatch = dispatch;
+ layer.tooltip = tooltip;
+
+ layer.margin = function(_) {
+ if (!arguments.length) return margin;
+ margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
+ margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
+ return layer;
+ };
+
+ layer.width = function(_) {
+ if (!arguments.length) return width;
+ width = _;
+ return layer;
+ };
+
+ layer.height = function(_) {
+ if (!arguments.length) return height;
+ height = _;
+ return layer;
+ };
+
+ layer.xScale = function(_) {
+ if (!arguments.length) return xScale;
+ xScale = _;
+ return layer;
+ };
+
+ layer.showGuideLine = function(_) {
+ if (!arguments.length) return showGuideLine;
+ showGuideLine = _;
+ return layer;
};
- layer.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return layer;
- };
-
- layer.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return layer;
- };
-
- layer.xScale = function(_) {
- if (!arguments.length) return xScale;
- xScale = _;
- return layer;
- };
-
- layer.showGuideLine = function(_) {
- if (!arguments.length) return showGuideLine;
- showGuideLine = _;
- return layer;
- };
-
- layer.svgContainer = function(_) {
- if (!arguments.length) return svgContainer;
- svgContainer = _;
- return layer;
- };
-
-
- return layer;
+ layer.svgContainer = function(_) {
+ if (!arguments.length) return svgContainer;
+ svgContainer = _;
+ return layer;
+ };
+
+ return layer;
};
/* Utility class that uses d3.bisect to find the index in a given array, where a search value can be inserted.
-This is different from normal bisectLeft; this function finds the nearest index to insert the search value.
+ This is different from normal bisectLeft; this function finds the nearest index to insert the search value.
-For instance, lets say your array is [1,2,3,5,10,30], and you search for 28.
-Normal d3.bisectLeft will return 4, because 28 is inserted after the number 10. But interactiveBisect will return 5
-because 28 is closer to 30 than 10.
+ For instance, lets say your array is [1,2,3,5,10,30], and you search for 28.
+ Normal d3.bisectLeft will return 4, because 28 is inserted after the number 10. But interactiveBisect will return 5
+ because 28 is closer to 30 than 10.
-Unit tests can be found in: interactiveBisectTest.html
+ Unit tests can be found in: interactiveBisectTest.html
-Has the following known issues:
- * Will not work if the data points move backwards (ie, 10,9,8,7, etc) or if the data points are in random order.
- * Won't work if there are duplicate x coordinate values.
-*/
+ Has the following known issues:
+ * Will not work if the data points move backwards (ie, 10,9,8,7, etc) or if the data points are in random order.
+ * Won't work if there are duplicate x coordinate values.
+ */
nv.interactiveBisect = function (values, searchVal, xAccessor) {
- "use strict";
- if (! values instanceof Array) return null;
- if (typeof xAccessor !== 'function') xAccessor = function(d,i) { return d.x;}
+ "use strict";
+ if (! (values instanceof Array)) {
+ return null;
+ }
+ var _xAccessor;
+ if (typeof xAccessor !== 'function') {
+ _xAccessor = function(d) {
+ return d.x;
+ }
+ } else {
+ _xAccessor = xAccessor;
+ }
+ var _cmp = function(d, v) {
+ // Accessors are no longer passed the index of the element along with
+ // the element itself when invoked by d3.bisector.
+ //
+ // Starting at D3 v3.4.4, d3.bisector() started inspecting the
+ // function passed to determine if it should consider it an accessor
+ // or a comparator. This meant that accessors that take two arguments
+ // (expecting an index as the second parameter) are treated as
+ // comparators where the second argument is the search value against
+ // which the first argument is compared.
+ return _xAccessor(d) - v;
+ };
+
+ var bisect = d3.bisector(_cmp).left;
+ var index = d3.max([0, bisect(values,searchVal) - 1]);
+ var currentValue = _xAccessor(values[index]);
- var bisect = d3.bisector(xAccessor).left;
- var index = d3.max([0, bisect(values,searchVal) - 1]);
- var currentValue = xAccessor(values[index], index);
- if (typeof currentValue === 'undefined') currentValue = index;
+ if (typeof currentValue === 'undefined') {
+ currentValue = index;
+ }
- if (currentValue === searchVal) return index; //found exact match
+ if (currentValue === searchVal) {
+ return index; //found exact match
+ }
- var nextIndex = d3.min([index+1, values.length - 1]);
- var nextValue = xAccessor(values[nextIndex], nextIndex);
- if (typeof nextValue === 'undefined') nextValue = nextIndex;
+ var nextIndex = d3.min([index+1, values.length - 1]);
+ var nextValue = _xAccessor(values[nextIndex]);
- if (Math.abs(nextValue - searchVal) >= Math.abs(currentValue - searchVal))
- return index;
- else
- return nextIndex
+ if (typeof nextValue === 'undefined') {
+ nextValue = nextIndex;
+ }
+
+ if (Math.abs(nextValue - searchVal) >= Math.abs(currentValue - searchVal)) {
+ return index;
+ } else {
+ return nextIndex
+ }
};
/*
-Returns the index in the array "values" that is closest to searchVal.
-Only returns an index if searchVal is within some "threshold".
-Otherwise, returns null.
-*/
+ Returns the index in the array "values" that is closest to searchVal.
+ Only returns an index if searchVal is within some "threshold".
+ Otherwise, returns null.
+ */
nv.nearestValueIndex = function (values, searchVal, threshold) {
- "use strict";
- var yDistMax = Infinity, indexToHighlight = null;
- values.forEach(function(d,i) {
- var delta = Math.abs(searchVal - d);
- if ( delta <= yDistMax && delta < threshold) {
+ "use strict";
+ var yDistMax = Infinity, indexToHighlight = null;
+ values.forEach(function(d,i) {
+ var delta = Math.abs(searchVal - d);
+ if ( d != null && delta <= yDistMax && delta < threshold) {
yDistMax = delta;
indexToHighlight = i;
- }
- });
- return indexToHighlight;
-};/* Tooltip rendering model for nvd3 charts.
-window.nv.models.tooltip is the updated,new way to render tooltips.
-
-window.nv.tooltip.show is the old tooltip code.
-window.nv.tooltip.* also has various helper methods.
-*/
-(function() {
- "use strict";
- window.nv.tooltip = {};
-
- /* Model which can be instantiated to handle tooltip rendering.
- Example usage:
- var tip = nv.models.tooltip().gravity('w').distance(23)
- .data(myDataObject);
-
- tip(); //just invoke the returned function to render tooltip.
- */
- window.nv.models.tooltip = function() {
- var content = null //HTML contents of the tooltip. If null, the content is generated via the data variable.
- , data = null /* Tooltip data. If data is given in the proper format, a consistent tooltip is generated.
- Format of data:
- {
- key: "Date",
- value: "August 2009",
- series: [
- {
- key: "Series 1",
- value: "Value 1",
- color: "#000"
- },
- {
- key: "Series 2",
- value: "Value 2",
- color: "#00f"
- }
- ]
-
}
+ });
+ return indexToHighlight;
+};
- */
- , gravity = 'w' //Can be 'n','s','e','w'. Determines how tooltip is positioned.
- , distance = 50 //Distance to offset tooltip from the mouse location.
- , snapDistance = 25 //Tolerance allowed before tooltip is moved from its current position (creates 'snapping' effect)
- , fixedTop = null //If not null, this fixes the top position of the tooltip.
- , classes = null //Attaches additional CSS classes to the tooltip DIV that is created.
- , chartContainer = null //Parent DIV, of the SVG Container that holds the chart.
- , tooltipElem = null //actual DOM element representing the tooltip.
- , position = {left: null, top: null} //Relative position of the tooltip inside chartContainer.
- , enabled = true //True -> tooltips are rendered. False -> don't render tooltips.
- //Generates a unique id when you create a new tooltip() object
- , id = "nvtooltip-" + Math.floor(Math.random() * 100000)
- ;
+/* Model which can be instantiated to handle tooltip rendering.
+ Example usage:
+ var tip = nv.models.tooltip().gravity('w').distance(23)
+ .data(myDataObject);
- //CSS class to specify whether element should not have mouse events.
- var nvPointerEventsClass = "nv-pointer-events-none";
+ tip(); //just invoke the returned function to render tooltip.
+ */
+nv.models.tooltip = function() {
+ "use strict";
- //Format function for the tooltip values column
- var valueFormatter = function(d,i) {
- return d;
- };
+ /*
+ Tooltip data. If data is given in the proper format, a consistent tooltip is generated.
+ Example Format of data:
+ {
+ key: "Date",
+ value: "August 2009",
+ series: [
+ {key: "Series 1", value: "Value 1", color: "#000"},
+ {key: "Series 2", value: "Value 2", color: "#00f"}
+ ]
+ }
+ */
+ var id = "nvtooltip-" + Math.floor(Math.random() * 100000) // Generates a unique id when you create a new tooltip() object.
+ , data = null
+ , gravity = 'w' // Can be 'n','s','e','w'. Determines how tooltip is positioned.
+ , distance = 25 // Distance to offset tooltip from the mouse location.
+ , snapDistance = 0 // Tolerance allowed before tooltip is moved from its current position (creates 'snapping' effect)
+ , fixedTop = null // If not null, this fixes the top position of the tooltip.
+ , classes = null // Attaches additional CSS classes to the tooltip DIV that is created.
+ , chartContainer = null // Parent dom element of the SVG that holds the chart.
+ , hidden = true // Start off hidden, toggle with hide/show functions below.
+ , hideDelay = 200 // Delay (in ms) before the tooltip hides after calling hide().
+ , tooltip = null // d3 select of the tooltip div.
+ , lastPosition = { left: null, top: null } // Last position the tooltip was in.
+ , enabled = true // True -> tooltips are rendered. False -> don't render tooltips.
+ , duration = 100 // Tooltip movement duration, in ms.
+ , headerEnabled = true // If is to show the tooltip header.
+ , nvPointerEventsClass = "nv-pointer-events-none" // CSS class to specify whether element should not have mouse events.
+ ;
- //Format function for the tooltip header value.
- var headerFormatter = function(d) {
- return d;
+ /*
+ Function that returns the position (relative to the viewport) the tooltip should be placed in.
+ Should return: {
+ left: <leftPos>,
+ top: <topPos>
+ }
+ */
+ var position = function() {
+ return {
+ left: d3.event.clientX,
+ top: d3.event.clientY
};
+ };
+
+ // Format function for the tooltip values column.
+ var valueFormatter = function(d, i) {
+ return d;
+ };
+
+ // Format function for the tooltip header value.
+ var headerFormatter = function(d) {
+ return d;
+ };
- //By default, the tooltip model renders a beautiful table inside a DIV.
- //You can override this function if a custom tooltip is desired.
- var contentGenerator = function(d) {
- if (content != null) return content;
+ var keyFormatter = function(d, i) {
+ return d;
+ };
- if (d == null) return '';
+ // By default, the tooltip model renders a beautiful table inside a DIV.
+ // You can override this function if a custom tooltip is desired.
+ var contentGenerator = function(d) {
+ if (d === null) {
+ return '';
+ }
- var table = d3.select(document.createElement("table"));
+ var table = d3.select(document.createElement("table"));
+ if (headerEnabled) {
var theadEnter = table.selectAll("thead")
.data([d])
.enter().append("thead");
+
theadEnter.append("tr")
.append("td")
- .attr("colspan",3)
+ .attr("colspan", 3)
.append("strong")
- .classed("x-value",true)
- .html(headerFormatter(d.value));
+ .classed("x-value", true)
+ .html(headerFormatter(d.value));
+ }
- var tbodyEnter = table.selectAll("tbody")
- .data([d])
- .enter().append("tbody");
- var trowEnter = tbodyEnter.selectAll("tr")
+ var tbodyEnter = table.selectAll("tbody")
+ .data([d])
+ .enter().append("tbody");
+
+ var trowEnter = tbodyEnter.selectAll("tr")
.data(function(p) { return p.series})
.enter()
.append("tr")
- .classed("highlight", function(p) { return p.highlight})
+ .classed("highlight", function(p) { return p.highlight});
+
+ trowEnter.append("td")
+ .classed("legend-color-guide",true)
+ .append("div")
+ .style("background-color", function(p) { return p.color});
+
+ trowEnter.append("td")
+ .classed("key",true)
+ .classed("total",function(p) { return !!p.total})
+ .html(function(p, i) { return keyFormatter(p.key, i)});
+
+ trowEnter.append("td")
+ .classed("value",true)
+ .html(function(p, i) { return valueFormatter(p.value, i) });
+
+ trowEnter.selectAll("td").each(function(p) {
+ if (p.highlight) {
+ var opacityScale = d3.scale.linear().domain([0,1]).range(["#fff",p.color]);
+ var opacity = 0.6;
+ d3.select(this)
+ .style("border-bottom-color", opacityScale(opacity))
+ .style("border-top-color", opacityScale(opacity))
;
+ }
+ });
- trowEnter.append("td")
- .classed("legend-color-guide",true)
- .append("div")
- .style("background-color", function(p) { return p.color});
- trowEnter.append("td")
- .classed("key",true)
- .html(function(p) {return p.key});
- trowEnter.append("td")
- .classed("value",true)
- .html(function(p,i) { return valueFormatter(p.value,i) });
-
-
- trowEnter.selectAll("td").each(function(p) {
- if (p.highlight) {
- var opacityScale = d3.scale.linear().domain([0,1]).range(["#fff",p.color]);
- var opacity = 0.6;
- d3.select(this)
- .style("border-bottom-color", opacityScale(opacity))
- .style("border-top-color", opacityScale(opacity))
- ;
- }
- });
-
- var html = table.node().outerHTML;
- if (d.footer !== undefined)
- html += "<div class='footer'>" + d.footer + "</div>";
- return html;
-
- };
-
- var dataSeriesExists = function(d) {
- if (d && d.series && d.series.length > 0) return true;
+ var html = table.node().outerHTML;
+ if (d.footer !== undefined)
+ html += "<div class='footer'>" + d.footer + "</div>";
+ return html;
- return false;
- };
+ };
- //In situations where the chart is in a 'viewBox', re-position the tooltip based on how far chart is zoomed.
- function convertViewBoxRatio() {
- if (chartContainer) {
- var svg = d3.select(chartContainer);
- if (svg.node().tagName !== "svg") {
- svg = svg.select("svg");
- }
- var viewBox = (svg.node()) ? svg.attr('viewBox') : null;
- if (viewBox) {
- viewBox = viewBox.split(' ');
- var ratio = parseInt(svg.style('width')) / viewBox[2];
-
- position.left = position.left * ratio;
- position.top = position.top * ratio;
- }
+ var dataSeriesExists = function(d) {
+ if (d && d.series) {
+ if (d.series instanceof Array) {
+ return !!d.series.length;
+ }
+ // if object, it's okay just convert to array of the object
+ if (d.series instanceof Object) {
+ d.series = [d.series];
+ return true;
}
}
+ return false;
+ };
- //Creates new tooltip container, or uses existing one on DOM.
- function getTooltipContainer(newContent) {
- var body;
- if (chartContainer)
- body = d3.select(chartContainer);
- else
- body = d3.select("body");
-
- var container = body.select(".nvtooltip");
- if (container.node() === null) {
- //Create new tooltip div if it doesn't exist on DOM.
- container = body.append("div")
- .attr("class", "nvtooltip " + (classes? classes: "xy-tooltip"))
- .attr("id",id)
- ;
- }
-
-
- container.node().innerHTML = newContent;
- container.style("top",0).style("left",0).style("opacity",0);
- container.selectAll("div, table, td, tr").classed(nvPointerEventsClass,true)
- container.classed(nvPointerEventsClass,true);
- return container.node();
+ // Calculates the gravity offset of the tooltip. Parameter is position of tooltip
+ // relative to the viewport.
+ var calcGravityOffset = function(pos) {
+ var height = tooltip.node().offsetHeight,
+ width = tooltip.node().offsetWidth,
+ clientWidth = document.documentElement.clientWidth, // Don't want scrollbars.
+ clientHeight = document.documentElement.clientHeight, // Don't want scrollbars.
+ left, top, tmp;
+
+ // calculate position based on gravity
+ switch (gravity) {
+ case 'e':
+ left = - width - distance;
+ top = - (height / 2);
+ if(pos.left + left < 0) left = distance;
+ if((tmp = pos.top + top) < 0) top -= tmp;
+ if((tmp = pos.top + top + height) > clientHeight) top -= tmp - clientHeight;
+ break;
+ case 'w':
+ left = distance;
+ top = - (height / 2);
+ if (pos.left + left + width > clientWidth) left = - width - distance;
+ if ((tmp = pos.top + top) < 0) top -= tmp;
+ if ((tmp = pos.top + top + height) > clientHeight) top -= tmp - clientHeight;
+ break;
+ case 'n':
+ left = - (width / 2) - 5; // - 5 is an approximation of the mouse's height.
+ top = distance;
+ if (pos.top + top + height > clientHeight) top = - height - distance;
+ if ((tmp = pos.left + left) < 0) left -= tmp;
+ if ((tmp = pos.left + left + width) > clientWidth) left -= tmp - clientWidth;
+ break;
+ case 's':
+ left = - (width / 2);
+ top = - height - distance;
+ if (pos.top + top < 0) top = distance;
+ if ((tmp = pos.left + left) < 0) left -= tmp;
+ if ((tmp = pos.left + left + width) > clientWidth) left -= tmp - clientWidth;
+ break;
+ case 'center':
+ left = - (width / 2);
+ top = - (height / 2);
+ break;
+ default:
+ left = 0;
+ top = 0;
+ break;
}
-
-
- //Draw the tooltip onto the DOM.
- function nvtooltip() {
- if (!enabled) return;
- if (!dataSeriesExists(data)) return;
-
- convertViewBoxRatio();
-
- var left = position.left;
- var top = (fixedTop != null) ? fixedTop : position.top;
- var container = getTooltipContainer(contentGenerator(data));
- tooltipElem = container;
- if (chartContainer) {
- var svgComp = chartContainer.getElementsByTagName("svg")[0];
- var boundRect = (svgComp) ? svgComp.getBoundingClientRect() : chartContainer.getBoundingClientRect();
- var svgOffset = {left:0,top:0};
- if (svgComp) {
- var svgBound = svgComp.getBoundingClientRect();
- var chartBound = chartContainer.getBoundingClientRect();
- var svgBoundTop = svgBound.top;
-
- //Defensive code. Sometimes, svgBoundTop can be a really negative
- // number, like -134254. That's a bug.
- // If such a number is found, use zero instead. FireFox bug only
- if (svgBoundTop < 0) {
- var containerBound = chartContainer.getBoundingClientRect();
- svgBoundTop = (Math.abs(svgBoundTop) > containerBound.height) ? 0 : svgBoundTop;
- }
- svgOffset.top = Math.abs(svgBoundTop - chartBound.top);
- svgOffset.left = Math.abs(svgBound.left - chartBound.left);
- }
- //If the parent container is an overflow <div> with scrollbars, subtract the scroll offsets.
- //You need to also add any offset between the <svg> element and its containing <div>
- //Finally, add any offset of the containing <div> on the whole page.
- left += chartContainer.offsetLeft + svgOffset.left - 2*chartContainer.scrollLeft;
- top += chartContainer.offsetTop + svgOffset.top - 2*chartContainer.scrollTop;
- }
+ return { 'left': left, 'top': top };
+ };
- if (snapDistance && snapDistance > 0) {
- top = Math.floor(top/snapDistance) * snapDistance;
+ /*
+ Positions the tooltip in the correct place, as given by the position() function.
+ */
+ var positionTooltip = function() {
+ nv.dom.read(function() {
+ var pos = position(),
+ gravityOffset = calcGravityOffset(pos),
+ left = pos.left + gravityOffset.left,
+ top = pos.top + gravityOffset.top;
+
+ // delay hiding a bit to avoid flickering
+ if (hidden) {
+ tooltip
+ .interrupt()
+ .transition()
+ .delay(hideDelay)
+ .duration(0)
+ .style('opacity', 0);
+ } else {
+ // using tooltip.style('transform') returns values un-usable for tween
+ var old_translate = 'translate(' + lastPosition.left + 'px, ' + lastPosition.top + 'px)';
+ var new_translate = 'translate(' + left + 'px, ' + top + 'px)';
+ var translateInterpolator = d3.interpolateString(old_translate, new_translate);
+ var is_hidden = tooltip.style('opacity') < 0.1;
+
+ tooltip
+ .interrupt() // cancel running transitions
+ .transition()
+ .duration(is_hidden ? 0 : duration)
+ // using tween since some versions of d3 can't auto-tween a translate on a div
+ .styleTween('transform', function (d) {
+ return translateInterpolator;
+ }, 'important')
+ // Safari has its own `-webkit-transform` and does not support `transform`
+ .styleTween('-webkit-transform', function (d) {
+ return translateInterpolator;
+ })
+ .style('-ms-transform', new_translate)
+ .style('opacity', 1);
}
- nv.tooltip.calcTooltipPosition([left,top], gravity, distance, container);
- return nvtooltip;
- };
-
- nvtooltip.nvPointerEventsClass = nvPointerEventsClass;
-
- nvtooltip.content = function(_) {
- if (!arguments.length) return content;
- content = _;
- return nvtooltip;
- };
-
- //Returns tooltipElem...not able to set it.
- nvtooltip.tooltipElem = function() {
- return tooltipElem;
- };
-
- nvtooltip.contentGenerator = function(_) {
- if (!arguments.length) return contentGenerator;
- if (typeof _ === 'function') {
- contentGenerator = _;
- }
- return nvtooltip;
- };
-
- nvtooltip.data = function(_) {
- if (!arguments.length) return data;
- data = _;
- return nvtooltip;
- };
-
- nvtooltip.gravity = function(_) {
- if (!arguments.length) return gravity;
- gravity = _;
- return nvtooltip;
- };
-
- nvtooltip.distance = function(_) {
- if (!arguments.length) return distance;
- distance = _;
- return nvtooltip;
- };
-
- nvtooltip.snapDistance = function(_) {
- if (!arguments.length) return snapDistance;
- snapDistance = _;
- return nvtooltip;
- };
-
- nvtooltip.classes = function(_) {
- if (!arguments.length) return classes;
- classes = _;
- return nvtooltip;
- };
-
- nvtooltip.chartContainer = function(_) {
- if (!arguments.length) return chartContainer;
- chartContainer = _;
- return nvtooltip;
- };
-
- nvtooltip.position = function(_) {
- if (!arguments.length) return position;
- position.left = (typeof _.left !== 'undefined') ? _.left : position.left;
- position.top = (typeof _.top !== 'undefined') ? _.top : position.top;
- return nvtooltip;
- };
-
- nvtooltip.fixedTop = function(_) {
- if (!arguments.length) return fixedTop;
- fixedTop = _;
- return nvtooltip;
- };
-
- nvtooltip.enabled = function(_) {
- if (!arguments.length) return enabled;
- enabled = _;
- return nvtooltip;
- };
+ lastPosition.left = left;
+ lastPosition.top = top;
+ });
+ };
- nvtooltip.valueFormatter = function(_) {
- if (!arguments.length) return valueFormatter;
- if (typeof _ === 'function') {
- valueFormatter = _;
- }
- return nvtooltip;
- };
+ // Creates new tooltip container, or uses existing one on DOM.
+ function initTooltip() {
+ if (!tooltip) {
+ var container = chartContainer ? chartContainer : document.body;
+
+ // Create new tooltip div if it doesn't exist on DOM.
+ tooltip = d3.select(container).append("div")
+ .attr("class", "nvtooltip " + (classes ? classes : "xy-tooltip"))
+ .attr("id", id);
+ tooltip.style("top", 0).style("left", 0);
+ tooltip.style('opacity', 0);
+ tooltip.style('position', 'fixed');
+ tooltip.selectAll("div, table, td, tr").classed(nvPointerEventsClass, true);
+ tooltip.classed(nvPointerEventsClass, true);
+ }
+ }
- nvtooltip.headerFormatter = function(_) {
- if (!arguments.length) return headerFormatter;
- if (typeof _ === 'function') {
- headerFormatter = _;
+ // Draw the tooltip onto the DOM.
+ function nvtooltip() {
+ if (!enabled) return;
+ if (!dataSeriesExists(data)) return;
+
+ nv.dom.write(function () {
+ initTooltip();
+ // Generate data and set it into tooltip.
+ // Bonus - If you override contentGenerator and return falsey you can use something like
+ // React or Knockout to bind the data for your tooltip.
+ var newContent = contentGenerator(data);
+ if (newContent) {
+ tooltip.node().innerHTML = newContent;
}
- return nvtooltip;
- };
-
- //id() is a read-only function. You can't use it to set the id.
- nvtooltip.id = function() {
- return id;
- };
+ positionTooltip();
+ });
return nvtooltip;
- };
-
-
- //Original tooltip.show function. Kept for backward compatibility.
- // pos = [left,top]
- nv.tooltip.show = function(pos, content, gravity, dist, parentContainer, classes) {
-
- //Create new tooltip div if it doesn't exist on DOM.
- var container = document.createElement('div');
- container.className = 'nvtooltip ' + (classes ? classes : 'xy-tooltip');
-
- var body = parentContainer;
- if ( !parentContainer || parentContainer.tagName.match(/g|svg/i)) {
- //If the parent element is an SVG element, place tooltip in the <body> element.
- body = document.getElementsByTagName('body')[0];
- }
-
- container.style.left = 0;
- container.style.top = 0;
- container.style.opacity = 0;
- container.innerHTML = content;
- body.appendChild(container);
-
- //If the parent container is an overflow <div> with scrollbars, subtract the scroll offsets.
- if (parentContainer) {
- pos[0] = pos[0] - parentContainer.scrollLeft;
- pos[1] = pos[1] - parentContainer.scrollTop;
- }
- nv.tooltip.calcTooltipPosition(pos, gravity, dist, container);
- };
-
- //Looks up the ancestry of a DOM element, and returns the first NON-svg node.
- nv.tooltip.findFirstNonSVGParent = function(Elem) {
- while(Elem.tagName.match(/^g|svg$/i) !== null) {
- Elem = Elem.parentNode;
- }
- return Elem;
- };
-
- //Finds the total offsetTop of a given DOM element.
- //Looks up the entire ancestry of an element, up to the first relatively positioned element.
- nv.tooltip.findTotalOffsetTop = function ( Elem, initialTop ) {
- var offsetTop = initialTop;
-
- do {
- if( !isNaN( Elem.offsetTop ) ) {
- offsetTop += (Elem.offsetTop);
- }
- } while( Elem = Elem.offsetParent );
- return offsetTop;
- };
-
- //Finds the total offsetLeft of a given DOM element.
- //Looks up the entire ancestry of an element, up to the first relatively positioned element.
- nv.tooltip.findTotalOffsetLeft = function ( Elem, initialLeft) {
- var offsetLeft = initialLeft;
-
- do {
- if( !isNaN( Elem.offsetLeft ) ) {
- offsetLeft += (Elem.offsetLeft);
- }
- } while( Elem = Elem.offsetParent );
- return offsetLeft;
- };
-
- //Global utility function to render a tooltip on the DOM.
- //pos = [left,top] coordinates of where to place the tooltip, relative to the SVG chart container.
- //gravity = how to orient the tooltip
- //dist = how far away from the mouse to place tooltip
- //container = tooltip DIV
- nv.tooltip.calcTooltipPosition = function(pos, gravity, dist, container) {
-
- var height = parseInt(container.offsetHeight),
- width = parseInt(container.offsetWidth),
- windowWidth = nv.utils.windowSize().width,
- windowHeight = nv.utils.windowSize().height,
- scrollTop = window.pageYOffset,
- scrollLeft = window.pageXOffset,
- left, top;
-
- windowHeight = window.innerWidth >= document.body.scrollWidth ? windowHeight : windowHeight - 16;
- windowWidth = window.innerHeight >= document.body.scrollHeight ? windowWidth : windowWidth - 16;
-
- gravity = gravity || 's';
- dist = dist || 20;
-
- var tooltipTop = function ( Elem ) {
- return nv.tooltip.findTotalOffsetTop(Elem, top);
- };
-
- var tooltipLeft = function ( Elem ) {
- return nv.tooltip.findTotalOffsetLeft(Elem,left);
- };
+ }
- switch (gravity) {
- case 'e':
- left = pos[0] - width - dist;
- top = pos[1] - (height / 2);
- var tLeft = tooltipLeft(container);
- var tTop = tooltipTop(container);
- if (tLeft < scrollLeft) left = pos[0] + dist > scrollLeft ? pos[0] + dist : scrollLeft - tLeft + left;
- if (tTop < scrollTop) top = scrollTop - tTop + top;
- if (tTop + height > scrollTop + windowHeight) top = scrollTop + windowHeight - tTop + top - height;
- break;
- case 'w':
- left = pos[0] + dist;
- top = pos[1] - (height / 2);
- var tLeft = tooltipLeft(container);
- var tTop = tooltipTop(container);
- if (tLeft + width > windowWidth) left = pos[0] - width - dist;
- if (tTop < scrollTop) top = scrollTop + 5;
- if (tTop + height > scrollTop + windowHeight) top = scrollTop + windowHeight - tTop + top - height;
- break;
- case 'n':
- left = pos[0] - (width / 2) - 5;
- top = pos[1] + dist;
- var tLeft = tooltipLeft(container);
- var tTop = tooltipTop(container);
- if (tLeft < scrollLeft) left = scrollLeft + 5;
- if (tLeft + width > windowWidth) left = left - width/2 + 5;
- if (tTop + height > scrollTop + windowHeight) top = scrollTop + windowHeight - tTop + top - height;
- break;
- case 's':
- left = pos[0] - (width / 2);
- top = pos[1] - height - dist;
- var tLeft = tooltipLeft(container);
- var tTop = tooltipTop(container);
- if (tLeft < scrollLeft) left = scrollLeft + 5;
- if (tLeft + width > windowWidth) left = left - width/2 + 5;
- if (scrollTop > tTop) top = scrollTop;
- break;
- case 'none':
- left = pos[0];
- top = pos[1] - dist;
- var tLeft = tooltipLeft(container);
- var tTop = tooltipTop(container);
- break;
+ nvtooltip.nvPointerEventsClass = nvPointerEventsClass;
+ nvtooltip.options = nv.utils.optionsFunc.bind(nvtooltip);
+
+ nvtooltip._options = Object.create({}, {
+ // simple read/write options
+ duration: {get: function(){return duration;}, set: function(_){duration=_;}},
+ gravity: {get: function(){return gravity;}, set: function(_){gravity=_;}},
+ distance: {get: function(){return distance;}, set: function(_){distance=_;}},
+ snapDistance: {get: function(){return snapDistance;}, set: function(_){snapDistance=_;}},
+ classes: {get: function(){return classes;}, set: function(_){classes=_;}},
+ chartContainer: {get: function(){return chartContainer;}, set: function(_){chartContainer=_;}},
+ enabled: {get: function(){return enabled;}, set: function(_){enabled=_;}},
+ hideDelay: {get: function(){return hideDelay;}, set: function(_){hideDelay=_;}},
+ contentGenerator: {get: function(){return contentGenerator;}, set: function(_){contentGenerator=_;}},
+ valueFormatter: {get: function(){return valueFormatter;}, set: function(_){valueFormatter=_;}},
+ headerFormatter: {get: function(){return headerFormatter;}, set: function(_){headerFormatter=_;}},
+ keyFormatter: {get: function(){return keyFormatter;}, set: function(_){keyFormatter=_;}},
+ headerEnabled: {get: function(){return headerEnabled;}, set: function(_){headerEnabled=_;}},
+ position: {get: function(){return position;}, set: function(_){position=_;}},
+
+ // options with extra logic
+ hidden: {get: function(){return hidden;}, set: function(_){
+ if (hidden != _) {
+ hidden = !!_;
+ nvtooltip();
}
+ }},
+ data: {get: function(){return data;}, set: function(_){
+ // if showing a single data point, adjust data format with that
+ if (_.point) {
+ _.value = _.point.x;
+ _.series = _.series || {};
+ _.series.value = _.point.y;
+ _.series.color = _.point.color || _.series.color;
+ }
+ data = _;
+ }},
+ // read only properties
+ node: {get: function(){return tooltip.node();}, set: function(_){}},
+ id: {get: function(){return id;}, set: function(_){}}
+ });
- container.style.left = left+'px';
- container.style.top = top+'px';
- container.style.opacity = 1;
- container.style.position = 'absolute';
-
- return container;
- };
+ nv.utils.initOptions(nvtooltip);
+ return nvtooltip;
+};
- //Global utility function to remove tooltips from the DOM.
- nv.tooltip.cleanup = function() {
-
- // Find the tooltips, mark them for removal by this class (so others cleanups won't find it)
- var tooltips = document.getElementsByClassName('nvtooltip');
- var purging = [];
- while(tooltips.length) {
- purging.push(tooltips[0]);
- tooltips[0].style.transitionDelay = '0 !important';
- tooltips[0].style.opacity = 0;
- tooltips[0].className = 'nvtooltip-pending-removal';
- }
-
- setTimeout(function() {
-
- while (purging.length) {
- var removeMe = purging.pop();
- removeMe.parentNode.removeChild(removeMe);
- }
- }, 500);
- };
-})();
+/*
+Gets the browser window size
+Returns object with height and width properties
+ */
nv.utils.windowSize = function() {
// Sane defaults
var size = {width: 640, height: 480};
- // Earlier IE uses Doc.body
- if (document.body && document.body.offsetWidth) {
- size.width = document.body.offsetWidth;
- size.height = document.body.offsetHeight;
+ // Most recent browsers use
+ if (window.innerWidth && window.innerHeight) {
+ size.width = window.innerWidth;
+ size.height = window.innerHeight;
+ return (size);
}
// IE can use depending on mode it is in
if (document.compatMode=='CSS1Compat' &&
document.documentElement &&
document.documentElement.offsetWidth ) {
+
size.width = document.documentElement.offsetWidth;
size.height = document.documentElement.offsetHeight;
+ return (size);
}
- // Most recent browsers use
- if (window.innerWidth && window.innerHeight) {
- size.width = window.innerWidth;
- size.height = window.innerHeight;
+ // Earlier IE uses Doc.body
+ if (document.body && document.body.offsetWidth) {
+ size.width = document.body.offsetWidth;
+ size.height = document.body.offsetHeight;
+ return (size);
}
+
return (size);
};
+/*
+Binds callback function to run when window is resized
+ */
+nv.utils.windowResize = function(handler) {
+ if (window.addEventListener) {
+ window.addEventListener('resize', handler);
+ } else {
+ nv.log("ERROR: Failed to bind to window.resize with: ", handler);
+ }
+ // return object with clear function to remove the single added callback.
+ return {
+ callback: handler,
+ clear: function() {
+ window.removeEventListener('resize', handler);
+ }
+ }
+};
-// Easy way to bind multiple functions to window.onresize
-// TODO: give a way to remove a function after its bound, other than removing all of them
-nv.utils.windowResize = function(fun){
- if (fun === undefined) return;
- var oldresize = window.onresize;
-
- window.onresize = function(e) {
- if (typeof oldresize == 'function') oldresize(e);
- 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
-// behavior
+/*
+Backwards compatible way to implement more d3-like coloring of graphs.
+Can take in nothing, an array, or a function/scale
+To use a normal scale, get the range and pass that because we must be able
+to take two arguments and use the index to keep backward compatibility
+*/
nv.utils.getColor = function(color) {
- if (!arguments.length) return nv.utils.defaultColor(); //if you pass in nothing, get default colors back
+ //if you pass in nothing, get default colors back
+ if (color === undefined) {
+ return nv.utils.defaultColor();
+
+ //if passed an array, turn it into a color scale
+ // use isArray, instanceof fails if d3 range is created in an iframe
+ } else if(Array.isArray(color)) {
+ var color_scale = d3.scale.ordinal().range(color);
+ return function(d, i) {
+ var key = i === undefined ? d : i;
+ return d.color || color_scale(key);
+ };
- if( Object.prototype.toString.call( color ) === '[object Array]' )
- return function(d, i) { return d.color || color[i % color.length]; };
- else
- return color;
+ //if passed a function or scale, return it, or whatever it may be
+ //external libs, such as angularjs-nvd3-directives use this
+ } else {
//can't really help it if someone passes rubbish as color
-}
+ return color;
+ }
+};
+
-// Default color chooser uses the index of an object as before.
+/*
+Default color chooser uses a color scale of 20 colors from D3
+ https://github.com/mbostock/d3/wiki/Ordinal-Scales#categorical-colors
+ */
nv.utils.defaultColor = function() {
- var colors = d3.scale.category20().range();
- return function(d, i) { return d.color || colors[i % colors.length] };
-}
+ // get range of the scale so we'll turn it into our own function.
+ return nv.utils.getColor(d3.scale.category20().range());
+};
-// Returns a color function that takes the result of 'getKey' for each series and
-// looks for a corresponding color from the dictionary,
+/*
+Returns a color function that takes the result of 'getKey' for each series and
+looks for a corresponding color from the dictionary
+*/
nv.utils.customTheme = function(dictionary, getKey, defaultColors) {
- getKey = getKey || function(series) { return series.key }; // use default series.key if getKey is undefined
- defaultColors = defaultColors || d3.scale.category20().range(); //default color function
-
- var defIndex = defaultColors.length; //current default color (going in reverse)
-
- return function(series, index) {
- var key = getKey(series);
+ // use default series.key if getKey is undefined
+ getKey = getKey || function(series) { return series.key };
+ defaultColors = defaultColors || d3.scale.category20().range();
+
+ // start at end of default color list and walk back to index 0
+ var defIndex = defaultColors.length;
+
+ return function(series, index) {
+ var key = getKey(series);
+ if (typeof dictionary[key] === 'function') {
+ return dictionary[key]();
+ } else if (dictionary[key] !== undefined) {
+ return dictionary[key];
+ } else {
+ // no match in dictionary, use a default color
+ if (!defIndex) {
+ // used all the default colors, start over
+ defIndex = defaultColors.length;
+ }
+ defIndex = defIndex - 1;
+ return defaultColors[defIndex];
+ }
+ };
+};
- if (!defIndex) defIndex = defaultColors.length; //used all the default colors, start over
- if (typeof dictionary[key] !== "undefined")
- return (typeof dictionary[key] === "function") ? dictionary[key]() : dictionary[key];
- else
- return defaultColors[--defIndex]; // no match in dictionary, use default color
- }
-}
+/*
+From the PJAX example on d3js.org, while this is not really directly needed
+it's a very cool method for doing pjax, I may expand upon it a little bit,
+open to suggestions on anything that may be useful
+*/
+nv.utils.pjax = function(links, content) {
+ var load = function(href) {
+ d3.html(href, function(fragment) {
+ var target = d3.select(content).node();
+ target.parentNode.replaceChild(
+ d3.select(fragment).select(content).node(),
+ target);
+ nv.utils.pjax(links, content);
+ });
+ };
+ d3.selectAll(links).on("click", function() {
+ history.pushState(this.href, this.textContent, this.href);
+ load(this.href);
+ d3.event.preventDefault();
+ });
-// From the PJAX example on d3js.org, while this is not really directly needed
-// it's a very cool method for doing pjax, I may expand upon it a little bit,
-// open to suggestions on anything that may be useful
-nv.utils.pjax = function(links, content) {
- d3.selectAll(links).on("click", function() {
- history.pushState(this.href, this.textContent, this.href);
- load(this.href);
- d3.event.preventDefault();
- });
-
- function load(href) {
- d3.html(href, function(fragment) {
- var target = d3.select(content).node();
- target.parentNode.replaceChild(d3.select(fragment).select(content).node(), target);
- nv.utils.pjax(links, content);
+ d3.select(window).on("popstate", function() {
+ if (d3.event.state) {
+ load(d3.event.state);
+ }
});
- }
+};
- d3.select(window).on("popstate", function() {
- if (d3.event.state) load(d3.event.state);
- });
-}
-/* For situations where we want to approximate the width in pixels for an SVG:text element.
+/*
+For when we want to approximate the width in pixels for an SVG:text element.
Most common instance is when the element is in a display:none; container.
Forumla is : text.length * font-size * constant_factor
*/
nv.utils.calcApproxTextWidth = function (svgTextElem) {
if (typeof svgTextElem.style === 'function'
&& typeof svgTextElem.text === 'function') {
- var fontSize = parseInt(svgTextElem.style("font-size").replace("px",""));
- var textLength = svgTextElem.text().length;
+ var fontSize = parseInt(svgTextElem.style("font-size").replace("px",""), 10);
+ var textLength = svgTextElem.text().length;
return textLength * fontSize * 0.5;
}
return 0;
};
-/* Numbers that are undefined, null or NaN, convert them to zeros.
+
+/*
+Numbers that are undefined, null or NaN, convert them to zeros.
*/
nv.utils.NaNtoZero = function(n) {
if (typeof n !== 'number'
|| isNaN(n)
|| n === null
- || n === Infinity) return 0;
+ || n === Infinity
+ || n === -Infinity) {
+ return 0;
+ }
return n;
};
/*
-Snippet of code you can insert into each nv.models.* to give you the ability to
-do things like:
-chart.options({
- showXAxis: true,
- tooltips: true
-});
-
-To enable in the chart:
-chart.options = nv.utils.optionsFunc.bind(chart);
+Add a way to watch for d3 transition ends to d3
*/
-nv.utils.optionsFunc = function(args) {
- if (args) {
- d3.map(args).forEach((function(key,value) {
- if (typeof this[key] === "function") {
- this[key](value);
- }
- }).bind(this));
- }
- return this;
-};nv.models.axis = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var axis = d3.svg.axis()
- ;
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 75 //only used for tickLabel currently
- , height = 60 //only used for tickLabel currently
- , scale = d3.scale.linear()
- , axisLabelText = null
- , showMaxMin = true //TODO: showMaxMin should be disabled on all ordinal scaled axes
- , highlightZero = true
- , rotateLabels = 0
- , rotateYLabel = true
- , staggerLabels = false
- , isOrdinal = false
- , ticks = null
- , axisLabelDistance = 12 //The larger this number is, the closer the axis label is to the axis.
- ;
-
- axis
- .scale(scale)
- .orient('bottom')
- .tickFormat(function(d) { return d })
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var scale0;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this);
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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')
+d3.selection.prototype.watchTransition = function(renderWatch){
+ var args = [this].concat([].slice.call(arguments, 1));
+ return renderWatch.transition.apply(renderWatch, args);
+};
- //------------------------------------------------------------
+/*
+Helper object to watch when d3 has rendered something
+*/
+nv.utils.renderWatch = function(dispatch, duration) {
+ if (!(this instanceof nv.utils.renderWatch)) {
+ return new nv.utils.renderWatch(dispatch, duration);
+ }
- if (ticks !== null)
- axis.ticks(ticks);
- else if (axis.orient() == 'top' || axis.orient() == 'bottom')
- axis.ticks(Math.abs(scale.range()[1] - scale.range()[0]) / 100);
+ var _duration = duration !== undefined ? duration : 250;
+ var renderStack = [];
+ var self = this;
+
+ this.models = function(models) {
+ models = [].slice.call(arguments, 0);
+ models.forEach(function(model){
+ model.__rendered = false;
+ (function(m){
+ m.dispatch.on('renderEnd', function(arg){
+ m.__rendered = true;
+ self.renderEnd('model');
+ });
+ })(model);
+ if (renderStack.indexOf(model) < 0) {
+ renderStack.push(model);
+ }
+ });
+ return this;
+ };
- //TODO: consider calculating width/height based on whether or not label is added, for reference in charts using this component
+ this.reset = function(duration) {
+ if (duration !== undefined) {
+ _duration = duration;
+ }
+ renderStack = [];
+ };
+ this.transition = function(selection, args, duration) {
+ args = arguments.length > 1 ? [].slice.call(arguments, 1) : [];
- g.transition().call(axis);
+ if (args.length > 1) {
+ duration = args.pop();
+ } else {
+ duration = _duration !== undefined ? _duration : 250;
+ }
+ selection.__rendered = false;
- scale0 = scale0 || axis.scale();
+ if (renderStack.indexOf(selection) < 0) {
+ renderStack.push(selection);
+ }
- var fmt = axis.tickFormat();
- if (fmt == null) {
- fmt = scale0.tickFormat();
- }
+ if (duration === 0) {
+ selection.__rendered = true;
+ selection.delay = function() { return this; };
+ selection.duration = function() { return this; };
+ return selection;
+ } else {
+ if (selection.length === 0) {
+ selection.__rendered = true;
+ } else if (selection.every( function(d){ return !d.length; } )) {
+ selection.__rendered = true;
+ } else {
+ selection.__rendered = false;
+ }
- var axisLabel = g.selectAll('text.nv-axislabel')
- .data([axisLabelText || null]);
- axisLabel.exit().remove();
- switch (axis.orient()) {
- case 'top':
- axisLabel.enter().append('text').attr('class', 'nv-axislabel');
- var w = (scale.range().length==2) ? scale.range()[1] : (scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]));
- axisLabel
- .attr('text-anchor', 'middle')
- .attr('y', 0)
- .attr('x', w/2);
- if (showMaxMin) {
- var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
- .data(scale.domain());
- axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text');
- axisMaxMin.exit().remove();
- axisMaxMin
- .attr('transform', function(d,i) {
- return 'translate(' + scale(d) + ',0)'
- })
- .select('text')
- .attr('dy', '-0.5em')
- .attr('y', -axis.tickPadding())
- .attr('text-anchor', 'middle')
- .text(function(d,i) {
- var v = fmt(d);
- return ('' + v).match('NaN') ? '' : v;
- });
- axisMaxMin.transition()
- .attr('transform', function(d,i) {
- return 'translate(' + scale.range()[i] + ',0)'
- });
- }
- break;
- case 'bottom':
- var xLabelMargin = 36;
- var maxTextWidth = 30;
- var xTicks = g.selectAll('g').select("text");
- if (rotateLabels%360) {
- //Calculate the longest xTick width
- xTicks.each(function(d,i){
- var width = this.getBBox().width;
- if(width > maxTextWidth) maxTextWidth = width;
- });
- //Convert to radians before calculating sin. Add 30 to margin for healthy padding.
- var sin = Math.abs(Math.sin(rotateLabels*Math.PI/180));
- var xLabelMargin = (sin ? sin*maxTextWidth : maxTextWidth)+30;
- //Rotate all xTicks
- xTicks
- .attr('transform', function(d,i,j) { return 'rotate(' + rotateLabels + ' 0,0)' })
- .style('text-anchor', rotateLabels%360 > 0 ? 'start' : 'end');
- }
- axisLabel.enter().append('text').attr('class', 'nv-axislabel');
- var w = (scale.range().length==2) ? scale.range()[1] : (scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]));
- axisLabel
- .attr('text-anchor', 'middle')
- .attr('y', xLabelMargin)
- .attr('x', w/2);
- if (showMaxMin) {
- //if (showMaxMin && !isOrdinal) {
- var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
- //.data(scale.domain())
- .data([scale.domain()[0], scale.domain()[scale.domain().length - 1]]);
- axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text');
- axisMaxMin.exit().remove();
- axisMaxMin
- .attr('transform', function(d,i) {
- return 'translate(' + (scale(d) + (isOrdinal ? scale.rangeBand() / 2 : 0)) + ',0)'
- })
- .select('text')
- .attr('dy', '.71em')
- .attr('y', axis.tickPadding())
- .attr('transform', function(d,i,j) { return 'rotate(' + rotateLabels + ' 0,0)' })
- .style('text-anchor', rotateLabels ? (rotateLabels%360 > 0 ? 'start' : 'end') : 'middle')
- .text(function(d,i) {
- var v = fmt(d);
- return ('' + v).match('NaN') ? '' : v;
- });
- axisMaxMin.transition()
- .attr('transform', function(d,i) {
- //return 'translate(' + scale.range()[i] + ',0)'
- //return 'translate(' + scale(d) + ',0)'
- return 'translate(' + (scale(d) + (isOrdinal ? scale.rangeBand() / 2 : 0)) + ',0)'
- });
- }
- if (staggerLabels)
- xTicks
- .attr('transform', function(d,i) { return 'translate(0,' + (i % 2 == 0 ? '0' : '12') + ')' });
-
- break;
- case 'right':
- axisLabel.enter().append('text').attr('class', 'nv-axislabel');
- axisLabel
- .style('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
- .attr('x', rotateYLabel ? (scale.range()[0] / 2) : axis.tickPadding());
- if (showMaxMin) {
- var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
- .data(scale.domain());
- axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text')
- .style('opacity', 0);
- axisMaxMin.exit().remove();
- axisMaxMin
- .attr('transform', function(d,i) {
- return 'translate(0,' + scale(d) + ')'
- })
- .select('text')
- .attr('dy', '.32em')
- .attr('y', 0)
- .attr('x', axis.tickPadding())
- .style('text-anchor', 'start')
- .text(function(d,i) {
- var v = fmt(d);
- return ('' + v).match('NaN') ? '' : v;
- });
- axisMaxMin.transition()
- .attr('transform', function(d,i) {
- return 'translate(0,' + scale.range()[i] + ')'
- })
- .select('text')
- .style('opacity', 1);
- }
- break;
- case 'left':
- /*
- //For dynamically placing the label. Can be used with dynamically-sized chart axis margins
- var yTicks = g.selectAll('g').select("text");
- yTicks.each(function(d,i){
- var labelPadding = this.getBBox().width + axis.tickPadding() + 16;
- if(labelPadding > width) width = labelPadding;
- });
- */
- axisLabel.enter().append('text').attr('class', 'nv-axislabel');
- axisLabel
- .style('text-anchor', rotateYLabel ? 'middle' : 'end')
- .attr('transform', rotateYLabel ? 'rotate(-90)' : '')
- .attr('y', rotateYLabel ? (-Math.max(margin.left,width) + axisLabelDistance) : -10) //TODO: consider calculating this based on largest tick width... OR at least expose this on chart
- .attr('x', rotateYLabel ? (-scale.range()[0] / 2) : -axis.tickPadding());
- if (showMaxMin) {
- var axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
- .data(scale.domain());
- axisMaxMin.enter().append('g').attr('class', 'nv-axisMaxMin').append('text')
- .style('opacity', 0);
- axisMaxMin.exit().remove();
- axisMaxMin
- .attr('transform', function(d,i) {
- return 'translate(0,' + scale0(d) + ')'
- })
- .select('text')
- .attr('dy', '.32em')
- .attr('y', 0)
- .attr('x', -axis.tickPadding())
- .attr('text-anchor', 'end')
- .text(function(d,i) {
- var v = fmt(d);
- return ('' + v).match('NaN') ? '' : v;
+ var n = 0;
+ return selection
+ .transition()
+ .duration(duration)
+ .each(function(){ ++n; })
+ .each('end', function(d, i) {
+ if (--n === 0) {
+ selection.__rendered = true;
+ self.renderEnd.apply(this, args);
+ }
});
- axisMaxMin.transition()
- .attr('transform', function(d,i) {
- return 'translate(0,' + scale.range()[i] + ')'
- })
- .select('text')
- .style('opacity', 1);
- }
- break;
- }
- axisLabel
- .text(function(d) { return d });
-
-
- if (showMaxMin && (axis.orient() === 'left' || axis.orient() === 'right')) {
- //check if max and min overlap other values, if so, hide the values that overlap
- g.selectAll('g') // the g's wrapping each tick
- .each(function(d,i) {
- d3.select(this).select('text').attr('opacity', 1);
- if (scale(d) < scale.range()[1] + 10 || scale(d) > scale.range()[0] - 10) { // 10 is assuming text height is 16... if d is 0, leave it!
- if (d > 1e-10 || d < -1e-10) // accounts for minor floating point errors... though could be problematic if the scale is EXTREMELY SMALL
- d3.select(this).attr('opacity', 0);
-
- d3.select(this).select('text').attr('opacity', 0); // Don't remove the ZERO line!!
- }
- });
-
- //if Max and Min = 0 only show min, Issue #281
- if (scale.domain()[0] == scale.domain()[1] && scale.domain()[0] == 0)
- wrap.selectAll('g.nv-axisMaxMin')
- .style('opacity', function(d,i) { return !i ? 1 : 0 });
-
- }
-
- if (showMaxMin && (axis.orient() === 'top' || axis.orient() === 'bottom')) {
- var maxMinRange = [];
- wrap.selectAll('g.nv-axisMaxMin')
- .each(function(d,i) {
- try {
- 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)
- else // i==0, min position
- maxMinRange.push(scale(d) + this.getBBox().width + 4)
- }catch (err) {
- if (i) // i== 1, max position
- maxMinRange.push(scale(d) - 4) //assuming the max and min labels are as wide as the next tick (with an extra 4 pixels just in case)
- else // i==0, min position
- maxMinRange.push(scale(d) + 4)
- }
- });
- g.selectAll('g') // the g's wrapping each tick
- .each(function(d,i) {
- if (scale(d) < maxMinRange[0] || scale(d) > maxMinRange[1]) {
- if (d > 1e-10 || d < -1e-10) // accounts for minor floating point errors... though could be problematic if the scale is EXTREMELY SMALL
- d3.select(this).remove();
- else
- d3.select(this).select('text').remove(); // Don't remove the ZERO line!!
- }
- });
- }
+ }
+ };
+ this.renderEnd = function() {
+ if (renderStack.every( function(d){ return d.__rendered; } )) {
+ renderStack.forEach( function(d){ d.__rendered = false; });
+ dispatch.renderEnd.apply(this, arguments);
+ }
+ }
- //highlight zero line ... Maybe should not be an option and should just be in CSS?
- if (highlightZero)
- g.selectAll('.tick')
- .filter(function(d) { return !parseFloat(Math.round(d.__data__*100000)/1000000) && (d.__data__ !== undefined) }) //this is because sometimes the 0 tick is a very small fraction, TODO: think of cleaner technique
- .classed('zero', true);
+};
- //store old scales for use in transitions on update
- scale0 = scale.copy();
+/*
+Takes multiple objects and combines them into the first one (dst)
+example: nv.utils.deepExtend({a: 1}, {a: 2, b: 3}, {c: 4});
+gives: {a: 2, b: 3, c: 4}
+*/
+nv.utils.deepExtend = function(dst){
+ var sources = arguments.length > 1 ? [].slice.call(arguments, 1) : [];
+ sources.forEach(function(source) {
+ for (var key in source) {
+ var isArray = dst[key] instanceof Array;
+ var isObject = typeof dst[key] === 'object';
+ var srcObj = typeof source[key] === 'object';
+
+ if (isObject && !isArray && srcObj) {
+ nv.utils.deepExtend(dst[key], source[key]);
+ } else {
+ dst[key] = source[key];
+ }
+ }
});
+};
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.axis = axis;
-
- d3.rebind(chart, axis, 'orient', 'tickValues', 'tickSubdivide', 'tickSize', 'tickPadding', 'tickFormat');
- d3.rebind(chart, scale, 'domain', 'range', 'rangeBand', 'rangeBands'); //these are also accessible by chart.scale(), but added common ones directly for ease of use
-
- chart.options = nv.utils.optionsFunc.bind(chart);
- chart.margin = function(_) {
- if(!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- }
+/*
+state utility object, used to track d3 states in the models
+*/
+nv.utils.state = function(){
+ if (!(this instanceof nv.utils.state)) {
+ return new nv.utils.state();
+ }
+ var state = {};
+ var _self = this;
+ var _setState = function(){};
+ var _getState = function(){ return {}; };
+ var init = null;
+ var changed = null;
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ this.dispatch = d3.dispatch('change', 'set');
- chart.ticks = function(_) {
- if (!arguments.length) return ticks;
- ticks = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ this.dispatch.on('set', function(state){
+ _setState(state, true);
+ });
- chart.axisLabel = function(_) {
- if (!arguments.length) return axisLabelText;
- axisLabelText = _;
- return chart;
- }
+ this.getter = function(fn){
+ _getState = fn;
+ return this;
+ };
- chart.showMaxMin = function(_) {
- if (!arguments.length) return showMaxMin;
- showMaxMin = _;
- return chart;
- }
+ this.setter = function(fn, callback) {
+ if (!callback) {
+ callback = function(){};
+ }
+ _setState = function(state, update){
+ fn(state);
+ if (update) {
+ callback();
+ }
+ };
+ return this;
+ };
- chart.highlightZero = function(_) {
- if (!arguments.length) return highlightZero;
- highlightZero = _;
- return chart;
- }
-
- chart.scale = function(_) {
- if (!arguments.length) return scale;
- scale = _;
- axis.scale(scale);
- isOrdinal = typeof scale.rangeBands === 'function';
- d3.rebind(chart, scale, 'domain', 'range', 'rangeBand', 'rangeBands');
- return chart;
- }
+ this.init = function(state){
+ init = init || {};
+ nv.utils.deepExtend(init, state);
+ };
- chart.rotateYLabel = function(_) {
- if(!arguments.length) return rotateYLabel;
- rotateYLabel = _;
- return chart;
- }
+ var _set = function(){
+ var settings = _getState();
- chart.rotateLabels = function(_) {
- if(!arguments.length) return rotateLabels;
- rotateLabels = _;
- return chart;
- }
+ if (JSON.stringify(settings) === JSON.stringify(state)) {
+ return false;
+ }
- chart.staggerLabels = function(_) {
- if (!arguments.length) return staggerLabels;
- staggerLabels = _;
- return chart;
- };
+ for (var key in settings) {
+ if (state[key] === undefined) {
+ state[key] = {};
+ }
+ state[key] = settings[key];
+ changed = true;
+ }
+ return true;
+ };
- chart.axisLabelDistance = function(_) {
- if (!arguments.length) return axisLabelDistance;
- axisLabelDistance = _;
- return chart;
- };
+ this.update = function(){
+ if (init) {
+ _setState(init, false);
+ init = null;
+ }
+ if (_set.call(this)) {
+ this.dispatch.change(state);
+ }
+ };
- //============================================================
+};
- return chart;
-}
-//TODO: consider deprecating and using multibar with single series for this
-nv.models.historicalBar = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
- , x = d3.scale.linear()
- , y = d3.scale.linear()
- , getX = function(d) { return d.x }
- , getY = function(d) { return d.y }
- , forceX = []
- , forceY = [0]
- , padData = false
- , clipEdge = true
- , color = nv.utils.defaultColor()
- , xDomain
- , yDomain
- , xRange
- , yRange
- , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
- , interactive = true
- ;
+/*
+Snippet of code you can insert into each nv.models.* to give you the ability to
+do things like:
+chart.options({
+ showXAxis: true,
+ tooltips: true
+});
- //============================================================
+To enable in the chart:
+chart.options = nv.utils.optionsFunc.bind(chart);
+*/
+nv.utils.optionsFunc = function(args) {
+ if (args) {
+ d3.map(args).forEach((function(key,value) {
+ if (typeof this[key] === "function") {
+ this[key](value);
+ }
+ }).bind(this));
+ }
+ return this;
+};
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
+/*
+numTicks: requested number of ticks
+data: the chart data
+returns the number of ticks to actually use on X axis, based on chart data
+to avoid duplicate ticks with the same value
+*/
+nv.utils.calcTicksX = function(numTicks, data) {
+ // find max number of values from all data streams
+ var numValues = 1;
+ var i = 0;
+ for (i; i < data.length; i += 1) {
+ var stream_len = data[i] && data[i].values ? data[i].values.length : 0;
+ numValues = stream_len > numValues ? stream_len : numValues;
+ }
+ nv.log("Requested number of ticks: ", numTicks);
+ nv.log("Calculated max values to be: ", numValues);
+ // make sure we don't have more ticks than values to avoid duplicates
+ numTicks = numTicks > numValues ? numTicks = numValues - 1 : numTicks;
+ // make sure we have at least one tick
+ numTicks = numTicks < 1 ? 1 : numTicks;
+ // make sure it's an integer
+ numTicks = Math.floor(numTicks);
+ nv.log("Calculating tick count as: ", numTicks);
+ return numTicks;
+};
- //------------------------------------------------------------
- // Setup Scales
- x .domain(xDomain || d3.extent(data[0].values.map(getX).concat(forceX) ))
+/*
+returns number of ticks to actually use on Y axis, based on chart data
+*/
+nv.utils.calcTicksY = function(numTicks, data) {
+ // currently uses the same logic but we can adjust here if needed later
+ return nv.utils.calcTicksX(numTicks, data);
+};
- if (padData)
- x.range(xRange || [availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
- else
- x.range(xRange || [0, availableWidth]);
- y .domain(yDomain || d3.extent(data[0].values.map(getY).concat(forceY) ))
- .range(yRange || [availableHeight, 0]);
+/*
+Add a particular option from an options object onto chart
+Options exposed on a chart are a getter/setter function that returns chart
+on set to mimic typical d3 option chaining, e.g. svg.option1('a').option2('b');
- // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
+option objects should be generated via Object.create() to provide
+the option of manipulating data via get/set functions.
+*/
+nv.utils.initOption = function(chart, name) {
+ // if it's a call option, just call it directly, otherwise do get/set
+ if (chart._calls && chart._calls[name]) {
+ chart[name] = chart._calls[name];
+ } else {
+ chart[name] = function (_) {
+ if (!arguments.length) return chart._options[name];
+ chart._overrides[name] = true;
+ chart._options[name] = _;
+ return chart;
+ };
+ // calling the option as _option will ignore if set by option already
+ // so nvd3 can set options internally but the stop if set manually
+ chart['_' + name] = function(_) {
+ if (!arguments.length) return chart._options[name];
+ if (!chart._overrides[name]) {
+ chart._options[name] = _;
+ }
+ return chart;
+ }
+ }
+};
- if (x.domain()[0] === x.domain()[1])
- x.domain()[0] ?
- x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
- : x.domain([-1,1]);
- 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])
- : y.domain([-1,1]);
+/*
+Add all options in an options object to the chart
+*/
+nv.utils.initOptions = function(chart) {
+ chart._overrides = chart._overrides || {};
+ var ops = Object.getOwnPropertyNames(chart._options || {});
+ var calls = Object.getOwnPropertyNames(chart._calls || {});
+ ops = ops.concat(calls);
+ for (var i in ops) {
+ nv.utils.initOption(chart, ops[i]);
+ }
+};
- //------------------------------------------------------------
+/*
+Inherit options from a D3 object
+d3.rebind makes calling the function on target actually call it on source
+Also use _d3options so we can track what we inherit for documentation and chained inheritance
+*/
+nv.utils.inheritOptionsD3 = function(target, d3_source, oplist) {
+ target._d3options = oplist.concat(target._d3options || []);
+ oplist.unshift(d3_source);
+ oplist.unshift(target);
+ d3.rebind.apply(this, oplist);
+};
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
- var wrap = container.selectAll('g.nv-wrap.nv-historicalBar-' + id).data([data[0].values]);
- var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-historicalBar-' + id);
- var defsEnter = wrapEnter.append('defs');
- var gEnter = wrapEnter.append('g');
- var g = wrap.select('g');
+/*
+Remove duplicates from an array
+*/
+nv.utils.arrayUnique = function(a) {
+ return a.sort().filter(function(item, pos) {
+ return !pos || item != a[pos - 1];
+ });
+};
- gEnter.append('g').attr('class', 'nv-bars');
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+/*
+Keeps a list of custom symbols to draw from in addition to d3.svg.symbol
+Necessary since d3 doesn't let you extend its list -_-
+Add new symbols by doing nv.utils.symbols.set('name', function(size){...});
+*/
+nv.utils.symbolMap = d3.map();
- //------------------------------------------------------------
+/*
+Replaces d3.svg.symbol so that we can look both there and our own map
+ */
+nv.utils.symbol = function() {
+ var type,
+ size = 64;
+ function symbol(d,i) {
+ var t = type.call(this,d,i);
+ var s = size.call(this,d,i);
+ if (d3.svg.symbolTypes.indexOf(t) !== -1) {
+ return d3.svg.symbol().type(t).size(s)();
+ } else {
+ return nv.utils.symbolMap.get(t)(s);
+ }
+ }
+ symbol.type = function(_) {
+ if (!arguments.length) return type;
+ type = d3.functor(_);
+ return symbol;
+ };
+ symbol.size = function(_) {
+ if (!arguments.length) return size;
+ size = d3.functor(_);
+ return symbol;
+ };
+ return symbol;
+};
- container
- .on('click', function(d,i) {
- dispatch.chartClick({
- data: d,
- index: i,
- pos: d3.event,
- id: id
- });
- });
+/*
+Inherit option getter/setter functions from source to target
+d3.rebind makes calling the function on target actually call it on source
+Also track via _inherited and _d3options so we can track what we inherit
+for documentation generation purposes and chained inheritance
+*/
+nv.utils.inheritOptions = function(target, source) {
+ // inherit all the things
+ var ops = Object.getOwnPropertyNames(source._options || {});
+ var calls = Object.getOwnPropertyNames(source._calls || {});
+ var inherited = source._inherited || [];
+ var d3ops = source._d3options || [];
+ var args = ops.concat(calls).concat(inherited).concat(d3ops);
+ args.unshift(source);
+ args.unshift(target);
+ d3.rebind.apply(this, args);
+ // pass along the lists to keep track of them, don't allow duplicates
+ target._inherited = nv.utils.arrayUnique(ops.concat(calls).concat(inherited).concat(ops).concat(target._inherited || []));
+ target._d3options = nv.utils.arrayUnique(d3ops.concat(target._d3options || []));
+};
- defsEnter.append('clipPath')
- .attr('id', 'nv-chart-clip-path-' + id)
- .append('rect');
- wrap.select('#nv-chart-clip-path-' + id + ' rect')
- .attr('width', availableWidth)
- .attr('height', availableHeight);
+/*
+Runs common initialize code on the svg before the chart builds
+*/
+nv.utils.initSVG = function(svg) {
+ svg.classed({'nvd3-svg':true});
+};
- g .attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
+/*
+Sanitize and provide default for the container height.
+*/
+nv.utils.sanitizeHeight = function(height, container) {
+ return (height || parseInt(container.style('height'), 10) || 400);
+};
- var bars = wrap.select('.nv-bars').selectAll('.nv-bar')
- .data(function(d) { return d }, function(d,i) {return getX(d,i)});
+/*
+Sanitize and provide default for the container width.
+*/
+nv.utils.sanitizeWidth = function(width, container) {
+ return (width || parseInt(container.style('width'), 10) || 960);
+};
- bars.exit().remove();
+/*
+Calculate the available height for a chart.
+*/
+nv.utils.availableHeight = function(height, container, margin) {
+ return nv.utils.sanitizeHeight(height, container) - margin.top - margin.bottom;
+};
- 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('x', 0 )
- .attr('y', function(d,i) { return nv.utils.NaNtoZero(y(Math.max(0, getY(d,i)))) })
- .attr('height', function(d,i) { return nv.utils.NaNtoZero(Math.abs(y(getY(d,i)) - y(0))) })
- .attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - availableWidth / data[0].values.length * .45) + ',0)'; })
- .on('mouseover', function(d,i) {
- if (!interactive) return;
- d3.select(this).classed('hover', true);
- dispatch.elementMouseover({
- point: d,
- series: data[0],
- pos: [x(getX(d,i)), y(getY(d,i))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: 0,
- e: d3.event
- });
+/*
+Calculate the available width for a chart.
+*/
+nv.utils.availableWidth = function(width, container, margin) {
+ return nv.utils.sanitizeWidth(width, container) - margin.left - margin.right;
+};
- })
- .on('mouseout', function(d,i) {
- if (!interactive) return;
- d3.select(this).classed('hover', false);
- dispatch.elementMouseout({
- point: d,
- series: data[0],
- pointIndex: i,
- seriesIndex: 0,
- e: d3.event
- });
- })
- .on('click', function(d,i) {
- if (!interactive) return;
- dispatch.elementClick({
- //label: d[label],
- value: getY(d,i),
- data: d,
- index: i,
- pos: [x(getX(d,i)), y(getY(d,i))],
- e: d3.event,
- id: id
- });
- d3.event.stopPropagation();
- })
- .on('dblclick', function(d,i) {
- if (!interactive) return;
- dispatch.elementDblClick({
- //label: d[label],
- value: getY(d,i),
- data: d,
- index: i,
- pos: [x(getX(d,i)), y(getY(d,i))],
- e: d3.event,
- id: id
- });
- d3.event.stopPropagation();
- });
-
- bars
- .attr('fill', function(d,i) { return color(d, i); })
- .attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive') + ' nv-bar-' + j + '-' + i })
- .transition()
- .attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - availableWidth / data[0].values.length * .45) + ',0)'; })
- //TODO: better width calculations that don't assume always uniform data spacing;w
- .attr('width', (availableWidth / data[0].values.length) * .9 );
-
-
- bars.transition()
- .attr('y', function(d,i) {
- var rval = getY(d,i) < 0 ?
- y(0) :
- y(0) - y(getY(d,i)) < 1 ?
- y(0) - 1 :
- y(getY(d,i));
- return nv.utils.NaNtoZero(rval);
- })
- .attr('height', function(d,i) { return nv.utils.NaNtoZero(Math.max(Math.abs(y(getY(d,i)) - y(0)),1)) });
+/*
+Clear any rendered chart components and display a chart's 'noData' message
+*/
+nv.utils.noData = function(chart, container) {
+ var opt = chart.options(),
+ margin = opt.margin(),
+ noData = opt.noData(),
+ data = (noData == null) ? ["No Data Available."] : [noData],
+ height = nv.utils.availableHeight(null, container, margin),
+ width = nv.utils.availableWidth(null, container, margin),
+ x = margin.left + width/2,
+ y = margin.top + height/2;
+
+ //Remove any previously created chart components
+ container.selectAll('g').remove();
+
+ var noDataText = container.selectAll('.nv-noData').data(data);
+
+ noDataText.enter().append('text')
+ .attr('class', 'nvd3 nv-noData')
+ .attr('dy', '-.7em')
+ .style('text-anchor', 'middle');
+
+ noDataText
+ .attr('x', x)
+ .attr('y', y)
+ .text(function(t){ return t; });
+};
+/*
+ Wrap long labels.
+ */
+nv.utils.wrapTicks = function (text, width) {
+ text.each(function() {
+ var text = d3.select(this),
+ words = text.text().split(/\s+/).reverse(),
+ word,
+ line = [],
+ lineNumber = 0,
+ lineHeight = 1.1,
+ y = text.attr("y"),
+ dy = parseFloat(text.attr("dy")),
+ tspan = text.text(null).append("tspan").attr("x", 0).attr("y", y).attr("dy", dy + "em");
+ while (word = words.pop()) {
+ line.push(word);
+ tspan.text(line.join(" "));
+ if (tspan.node().getComputedTextLength() > width) {
+ line.pop();
+ tspan.text(line.join(" "));
+ line = [word];
+ tspan = text.append("tspan").attr("x", 0).attr("y", y).attr("dy", ++lineNumber * lineHeight + dy + "em").text(word);
+ }
+ }
});
+};nv.models.axis = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var axis = d3.svg.axis();
+ var scale = d3.scale.linear();
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 75 //only used for tickLabel currently
+ , height = 60 //only used for tickLabel currently
+ , axisLabelText = null
+ , showMaxMin = true //TODO: showMaxMin should be disabled on all ordinal scaled axes
+ , rotateLabels = 0
+ , rotateYLabel = true
+ , staggerLabels = false
+ , isOrdinal = false
+ , ticks = null
+ , axisLabelDistance = 0
+ , duration = 250
+ , dispatch = d3.dispatch('renderEnd')
+ ;
+ axis
+ .scale(scale)
+ .orient('bottom')
+ .tickFormat(function(d) { return d })
+ ;
- return chart;
- }
-
- //Create methods to allow outside functions to highlight a specific bar.
- chart.highlightPoint = function(pointIndex, isHoverOver) {
- d3.select(".nv-historicalBar-" + id)
- .select(".nv-bars .nv-bar-0-" + pointIndex)
- .classed("hover", isHoverOver)
- ;
- };
-
- chart.clearHighlights = function() {
- d3.select(".nv-historicalBar-" + id)
- .select(".nv-bars .nv-bar.hover")
- .classed("hover", false)
- ;
- };
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- return chart;
- };
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ var scale0;
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var container = d3.select(this);
+ nv.utils.initSVG(container);
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ // Setup containers and skeleton of chart
+ 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');
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
+ if (ticks !== null)
+ axis.ticks(ticks);
+ else if (axis.orient() == 'top' || axis.orient() == 'bottom')
+ axis.ticks(Math.abs(scale.range()[1] - scale.range()[0]) / 100);
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
+ //TODO: consider calculating width/height based on whether or not label is added, for reference in charts using this component
+ g.watchTransition(renderWatch, 'axis').call(axis);
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
+ scale0 = scale0 || axis.scale();
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
+ var fmt = axis.tickFormat();
+ if (fmt == null) {
+ fmt = scale0.tickFormat();
+ }
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
+ var axisLabel = g.selectAll('text.nv-axislabel')
+ .data([axisLabelText || null]);
+ axisLabel.exit().remove();
+
+ var xLabelMargin;
+ var axisMaxMin;
+ var w;
+ switch (axis.orient()) {
+ case 'top':
+ axisLabel.enter().append('text').attr('class', 'nv-axislabel');
+ w = 0;
+ if (scale.range().length === 1) {
+ w = isOrdinal ? scale.range()[0] * 2 + scale.rangeBand() : 0;
+ } else if (scale.range().length === 2) {
+ w = isOrdinal ? scale.range()[0] + scale.range()[1] + scale.rangeBand() : scale.range()[1];
+ } else if ( scale.range().length > 2){
+ w = scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]);
+ };
+ axisLabel
+ .attr('text-anchor', 'middle')
+ .attr('y', 0)
+ .attr('x', w/2);
+ if (showMaxMin) {
+ axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
+ .data(scale.domain());
+ axisMaxMin.enter().append('g').attr('class',function(d,i){
+ return ['nv-axisMaxMin','nv-axisMaxMin-x',(i == 0 ? 'nv-axisMin-x':'nv-axisMax-x')].join(' ')
+ }).append('text');
+ axisMaxMin.exit().remove();
+ axisMaxMin
+ .attr('transform', function(d,i) {
+ return 'translate(' + nv.utils.NaNtoZero(scale(d)) + ',0)'
+ })
+ .select('text')
+ .attr('dy', '-0.5em')
+ .attr('y', -axis.tickPadding())
+ .attr('text-anchor', 'middle')
+ .text(function(d,i) {
+ var v = fmt(d);
+ return ('' + v).match('NaN') ? '' : v;
+ });
+ axisMaxMin.watchTransition(renderWatch, 'min-max top')
+ .attr('transform', function(d,i) {
+ return 'translate(' + nv.utils.NaNtoZero(scale.range()[i]) + ',0)'
+ });
+ }
+ break;
+ case 'bottom':
+ xLabelMargin = axisLabelDistance + 36;
+ var maxTextWidth = 30;
+ var textHeight = 0;
+ var xTicks = g.selectAll('g').select("text");
+ var rotateLabelsRule = '';
+ if (rotateLabels%360) {
+ //Calculate the longest xTick width
+ xTicks.each(function(d,i){
+ var box = this.getBoundingClientRect();
+ var width = box.width;
+ textHeight = box.height;
+ if(width > maxTextWidth) maxTextWidth = width;
+ });
+ rotateLabelsRule = 'rotate(' + rotateLabels + ' 0,' + (textHeight/2 + axis.tickPadding()) + ')';
+ //Convert to radians before calculating sin. Add 30 to margin for healthy padding.
+ var sin = Math.abs(Math.sin(rotateLabels*Math.PI/180));
+ xLabelMargin = (sin ? sin*maxTextWidth : maxTextWidth)+30;
+ //Rotate all xTicks
+ xTicks
+ .attr('transform', rotateLabelsRule)
+ .style('text-anchor', rotateLabels%360 > 0 ? 'start' : 'end');
+ }
+ axisLabel.enter().append('text').attr('class', 'nv-axislabel');
+ w = 0;
+ if (scale.range().length === 1) {
+ w = isOrdinal ? scale.range()[0] * 2 + scale.rangeBand() : 0;
+ } else if (scale.range().length === 2) {
+ w = isOrdinal ? scale.range()[0] + scale.range()[1] + scale.rangeBand() : scale.range()[1];
+ } else if ( scale.range().length > 2){
+ w = scale.range()[scale.range().length-1]+(scale.range()[1]-scale.range()[0]);
+ };
+ axisLabel
+ .attr('text-anchor', 'middle')
+ .attr('y', xLabelMargin)
+ .attr('x', w/2);
+ if (showMaxMin) {
+ //if (showMaxMin && !isOrdinal) {
+ axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
+ //.data(scale.domain())
+ .data([scale.domain()[0], scale.domain()[scale.domain().length - 1]]);
+ axisMaxMin.enter().append('g').attr('class',function(d,i){
+ return ['nv-axisMaxMin','nv-axisMaxMin-x',(i == 0 ? 'nv-axisMin-x':'nv-axisMax-x')].join(' ')
+ }).append('text');
+ axisMaxMin.exit().remove();
+ axisMaxMin
+ .attr('transform', function(d,i) {
+ return 'translate(' + nv.utils.NaNtoZero((scale(d) + (isOrdinal ? scale.rangeBand() / 2 : 0))) + ',0)'
+ })
+ .select('text')
+ .attr('dy', '.71em')
+ .attr('y', axis.tickPadding())
+ .attr('transform', rotateLabelsRule)
+ .style('text-anchor', rotateLabels ? (rotateLabels%360 > 0 ? 'start' : 'end') : 'middle')
+ .text(function(d,i) {
+ var v = fmt(d);
+ return ('' + v).match('NaN') ? '' : v;
+ });
+ axisMaxMin.watchTransition(renderWatch, 'min-max bottom')
+ .attr('transform', function(d,i) {
+ return 'translate(' + nv.utils.NaNtoZero((scale(d) + (isOrdinal ? scale.rangeBand() / 2 : 0))) + ',0)'
+ });
+ }
+ if (staggerLabels)
+ xTicks
+ .attr('transform', function(d,i) {
+ return 'translate(0,' + (i % 2 == 0 ? '0' : '12') + ')'
+ });
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
+ break;
+ case 'right':
+ axisLabel.enter().append('text').attr('class', 'nv-axislabel');
+ axisLabel
+ .style('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
+ .attr('x', rotateYLabel ? (d3.max(scale.range()) / 2) : axis.tickPadding());
+ if (showMaxMin) {
+ axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
+ .data(scale.domain());
+ axisMaxMin.enter().append('g').attr('class',function(d,i){
+ return ['nv-axisMaxMin','nv-axisMaxMin-y',(i == 0 ? 'nv-axisMin-y':'nv-axisMax-y')].join(' ')
+ }).append('text')
+ .style('opacity', 0);
+ axisMaxMin.exit().remove();
+ axisMaxMin
+ .attr('transform', function(d,i) {
+ return 'translate(0,' + nv.utils.NaNtoZero(scale(d)) + ')'
+ })
+ .select('text')
+ .attr('dy', '.32em')
+ .attr('y', 0)
+ .attr('x', axis.tickPadding())
+ .style('text-anchor', 'start')
+ .text(function(d, i) {
+ var v = fmt(d);
+ return ('' + v).match('NaN') ? '' : v;
+ });
+ axisMaxMin.watchTransition(renderWatch, 'min-max right')
+ .attr('transform', function(d,i) {
+ return 'translate(0,' + nv.utils.NaNtoZero(scale.range()[i]) + ')'
+ })
+ .select('text')
+ .style('opacity', 1);
+ }
+ break;
+ case 'left':
+ /*
+ //For dynamically placing the label. Can be used with dynamically-sized chart axis margins
+ var yTicks = g.selectAll('g').select("text");
+ yTicks.each(function(d,i){
+ var labelPadding = this.getBoundingClientRect().width + axis.tickPadding() + 16;
+ if(labelPadding > width) width = labelPadding;
+ });
+ */
+ axisLabel.enter().append('text').attr('class', 'nv-axislabel');
+ axisLabel
+ .style('text-anchor', rotateYLabel ? 'middle' : 'end')
+ .attr('transform', rotateYLabel ? 'rotate(-90)' : '')
+ .attr('y', rotateYLabel ? (-Math.max(margin.left, width) + 25 - (axisLabelDistance || 0)) : -10)
+ .attr('x', rotateYLabel ? (-d3.max(scale.range()) / 2) : -axis.tickPadding());
+ if (showMaxMin) {
+ axisMaxMin = wrap.selectAll('g.nv-axisMaxMin')
+ .data(scale.domain());
+ axisMaxMin.enter().append('g').attr('class',function(d,i){
+ return ['nv-axisMaxMin','nv-axisMaxMin-y',(i == 0 ? 'nv-axisMin-y':'nv-axisMax-y')].join(' ')
+ }).append('text')
+ .style('opacity', 0);
+ axisMaxMin.exit().remove();
+ axisMaxMin
+ .attr('transform', function(d,i) {
+ return 'translate(0,' + nv.utils.NaNtoZero(scale0(d)) + ')'
+ })
+ .select('text')
+ .attr('dy', '.32em')
+ .attr('y', 0)
+ .attr('x', -axis.tickPadding())
+ .attr('text-anchor', 'end')
+ .text(function(d,i) {
+ var v = fmt(d);
+ return ('' + v).match('NaN') ? '' : v;
+ });
+ axisMaxMin.watchTransition(renderWatch, 'min-max right')
+ .attr('transform', function(d,i) {
+ return 'translate(0,' + nv.utils.NaNtoZero(scale.range()[i]) + ')'
+ })
+ .select('text')
+ .style('opacity', 1);
+ }
+ break;
+ }
+ axisLabel.text(function(d) { return d });
+
+ if (showMaxMin && (axis.orient() === 'left' || axis.orient() === 'right')) {
+ //check if max and min overlap other values, if so, hide the values that overlap
+ g.selectAll('g') // the g's wrapping each tick
+ .each(function(d,i) {
+ d3.select(this).select('text').attr('opacity', 1);
+ if (scale(d) < scale.range()[1] + 10 || scale(d) > scale.range()[0] - 10) { // 10 is assuming text height is 16... if d is 0, leave it!
+ if (d > 1e-10 || d < -1e-10) // accounts for minor floating point errors... though could be problematic if the scale is EXTREMELY SMALL
+ d3.select(this).attr('opacity', 0);
+
+ d3.select(this).select('text').attr('opacity', 0); // Don't remove the ZERO line!!
+ }
+ });
+
+ //if Max and Min = 0 only show min, Issue #281
+ if (scale.domain()[0] == scale.domain()[1] && scale.domain()[0] == 0) {
+ wrap.selectAll('g.nv-axisMaxMin').style('opacity', function (d, i) {
+ return !i ? 1 : 0
+ });
+ }
+ }
- chart.forceX = function(_) {
- if (!arguments.length) return forceX;
- forceX = _;
- return chart;
- };
+ if (showMaxMin && (axis.orient() === 'top' || axis.orient() === 'bottom')) {
+ var maxMinRange = [];
+ wrap.selectAll('g.nv-axisMaxMin')
+ .each(function(d,i) {
+ try {
+ if (i) // i== 1, max position
+ maxMinRange.push(scale(d) - this.getBoundingClientRect().width - 4); //assuming the max and min labels are as wide as the next tick (with an extra 4 pixels just in case)
+ else // i==0, min position
+ maxMinRange.push(scale(d) + this.getBoundingClientRect().width + 4)
+ }catch (err) {
+ if (i) // i== 1, max position
+ maxMinRange.push(scale(d) - 4); //assuming the max and min labels are as wide as the next tick (with an extra 4 pixels just in case)
+ else // i==0, min position
+ maxMinRange.push(scale(d) + 4);
+ }
+ });
+ // the g's wrapping each tick
+ g.selectAll('g').each(function(d, i) {
+ if (scale(d) < maxMinRange[0] || scale(d) > maxMinRange[1]) {
+ if (d > 1e-10 || d < -1e-10) // accounts for minor floating point errors... though could be problematic if the scale is EXTREMELY SMALL
+ d3.select(this).remove();
+ else
+ d3.select(this).select('text').remove(); // Don't remove the ZERO line!!
+ }
+ });
+ }
- chart.forceY = function(_) {
- if (!arguments.length) return forceY;
- forceY = _;
- return chart;
- };
+ //Highlight zero tick line
+ g.selectAll('.tick')
+ .filter(function (d) {
+ /*
+ The filter needs to return only ticks at or near zero.
+ Numbers like 0.00001 need to count as zero as well,
+ and the arithmetic trick below solves that.
+ */
+ return !parseFloat(Math.round(d * 100000) / 1000000) && (d !== undefined)
+ })
+ .classed('zero', true);
+
+ //store old scales for use in transitions on update
+ scale0 = scale.copy();
- chart.padData = function(_) {
- if (!arguments.length) return padData;
- padData = _;
- return chart;
- };
+ });
- chart.clipEdge = function(_) {
- if (!arguments.length) return clipEdge;
- clipEdge = _;
- return chart;
- };
+ renderWatch.renderEnd('axis immediate');
+ return chart;
+ }
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.axis = axis;
+ chart.dispatch = dispatch;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ axisLabelDistance: {get: function(){return axisLabelDistance;}, set: function(_){axisLabelDistance=_;}},
+ staggerLabels: {get: function(){return staggerLabels;}, set: function(_){staggerLabels=_;}},
+ rotateLabels: {get: function(){return rotateLabels;}, set: function(_){rotateLabels=_;}},
+ rotateYLabel: {get: function(){return rotateYLabel;}, set: function(_){rotateYLabel=_;}},
+ showMaxMin: {get: function(){return showMaxMin;}, set: function(_){showMaxMin=_;}},
+ axisLabel: {get: function(){return axisLabelText;}, set: function(_){axisLabelText=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ ticks: {get: function(){return ticks;}, set: function(_){ticks=_;}},
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration=_;
+ renderWatch.reset(duration);
+ }},
+ scale: {get: function(){return scale;}, set: function(_){
+ scale = _;
+ axis.scale(scale);
+ isOrdinal = typeof scale.rangeBands === 'function';
+ nv.utils.inheritOptionsD3(chart, scale, ['domain', 'range', 'rangeBand', 'rangeBands']);
+ }}
+ });
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
+ nv.utils.initOptions(chart);
+ nv.utils.inheritOptionsD3(chart, axis, ['orient', 'tickValues', 'tickSubdivide', 'tickSize', 'tickPadding', 'tickFormat']);
+ nv.utils.inheritOptionsD3(chart, scale, ['domain', 'range', 'rangeBand', 'rangeBands']);
- chart.interactive = function(_) {
- if(!arguments.length) return interactive;
- interactive = false;
return chart;
- };
+};
+nv.models.boxPlot = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 960
+ , height = 500
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , x = d3.scale.ordinal()
+ , y = d3.scale.linear()
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , color = nv.utils.defaultColor()
+ , container = null
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , dispatch = d3.dispatch('elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
+ , duration = 250
+ , maxBoxWidth = null
+ ;
- //============================================================
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ var x0, y0;
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
- return chart;
-}
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
-// Chart design based on the recommendations of Stephen Few. Implementation
-// based on the work of Clint Ivy, Jamie Love, and Jason Davies.
-// http://projects.instantcognition.com/protovis/bulletchart/
+ container = d3.select(this);
+ nv.utils.initSVG(container);
-nv.models.bullet = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , orient = 'left' // TODO top & bottom
- , reverse = false
- , ranges = function(d) { return d.ranges }
- , markers = function(d) { return d.markers }
- , measures = function(d) { return d.measures }
- , rangeLabels = function(d) { return d.rangeLabels ? d.rangeLabels : [] }
- , markerLabels = function(d) { return d.markerLabels ? d.markerLabels : [] }
- , measureLabels = function(d) { return d.measureLabels ? d.measureLabels : [] }
- , forceX = [0] // List of numbers to Force into the X scale (ie. 0, or a max / min, etc.)
- , width = 380
- , height = 30
- , tickFormat = null
- , color = nv.utils.getColor(['#1f77b4'])
- , dispatch = d3.dispatch('elementMouseover', 'elementMouseout')
- ;
+ // Setup Scales
+ x .domain(xDomain || data.map(function(d,i) { return getX(d,i); }))
+ .rangeBands(xRange || [0, availableWidth], .1);
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(d, i) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
-
- var rangez = ranges.call(this, d, i).slice().sort(d3.descending),
- markerz = markers.call(this, d, i).slice().sort(d3.descending),
- measurez = measures.call(this, d, i).slice().sort(d3.descending),
- rangeLabelz = rangeLabels.call(this, d, i).slice(),
- markerLabelz = markerLabels.call(this, d, i).slice(),
- measureLabelz = measureLabels.call(this, d, i).slice();
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- // Compute the new x-scale.
- var x1 = d3.scale.linear()
- .domain( d3.extent(d3.merge([forceX, rangez])) )
- .range(reverse ? [availableWidth, 0] : [0, availableWidth]);
-
- // Retrieve the old x-scale, if this is an update.
- var x0 = this.__chart__ || d3.scale.linear()
- .domain([0, Infinity])
- .range(x1.range());
-
- // Stash the new scale.
- this.__chart__ = x1;
-
-
- var rangeMin = d3.min(rangez), //rangez[2]
- rangeMax = d3.max(rangez), //rangez[0]
- rangeAvg = rangez[1];
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.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');
-
- gEnter.append('rect').attr('class', 'nv-range nv-rangeMax');
- gEnter.append('rect').attr('class', 'nv-range nv-rangeAvg');
- gEnter.append('rect').attr('class', 'nv-range nv-rangeMin');
- gEnter.append('rect').attr('class', 'nv-measure');
- gEnter.append('path').attr('class', 'nv-markerTriangle');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- //------------------------------------------------------------
-
-
-
- var w0 = function(d) { return Math.abs(x0(d) - x0(0)) }, // TODO: could optimize by precalculating x0(0) and x1(0)
- w1 = function(d) { return Math.abs(x1(d) - x1(0)) };
- var xp0 = function(d) { return d < 0 ? x0(d) : x0(0) },
- xp1 = function(d) { return d < 0 ? x1(d) : x1(0) };
-
-
- g.select('rect.nv-rangeMax')
- .attr('height', availableHeight)
- .attr('width', w1(rangeMax > 0 ? rangeMax : rangeMin))
- .attr('x', xp1(rangeMax > 0 ? rangeMax : rangeMin))
- .datum(rangeMax > 0 ? rangeMax : rangeMin)
- /*
- .attr('x', rangeMin < 0 ?
- rangeMax > 0 ?
- x1(rangeMin)
- : x1(rangeMax)
- : x1(0))
- */
-
- g.select('rect.nv-rangeAvg')
- .attr('height', availableHeight)
- .attr('width', w1(rangeAvg))
- .attr('x', xp1(rangeAvg))
- .datum(rangeAvg)
- /*
- .attr('width', rangeMax <= 0 ?
- x1(rangeMax) - x1(rangeAvg)
- : x1(rangeAvg) - x1(rangeMin))
- .attr('x', rangeMax <= 0 ?
- x1(rangeAvg)
- : x1(rangeMin))
- */
-
- g.select('rect.nv-rangeMin')
- .attr('height', availableHeight)
- .attr('width', w1(rangeMax))
- .attr('x', xp1(rangeMax))
- .attr('width', w1(rangeMax > 0 ? rangeMin : rangeMax))
- .attr('x', xp1(rangeMax > 0 ? rangeMin : rangeMax))
- .datum(rangeMax > 0 ? rangeMin : rangeMax)
- /*
- .attr('width', rangeMax <= 0 ?
- x1(rangeAvg) - x1(rangeMin)
- : x1(rangeMax) - x1(rangeAvg))
- .attr('x', rangeMax <= 0 ?
- x1(rangeMin)
- : x1(rangeAvg))
- */
-
- g.select('rect.nv-measure')
- .style('fill', color)
- .attr('height', availableHeight / 3)
- .attr('y', availableHeight / 3)
- .attr('width', measurez < 0 ?
- x1(0) - x1(measurez[0])
- : x1(measurez[0]) - x1(0))
- .attr('x', xp1(measurez))
- .on('mouseover', function() {
- dispatch.elementMouseover({
- value: measurez[0],
- label: measureLabelz[0] || 'Current',
- pos: [x1(measurez[0]), availableHeight/2]
- })
- })
- .on('mouseout', function() {
- dispatch.elementMouseout({
- value: measurez[0],
- label: measureLabelz[0] || 'Current'
- })
- })
-
- var h3 = availableHeight / 6;
- if (markerz[0]) {
- g.selectAll('path.nv-markerTriangle')
- .attr('transform', function(d) { return 'translate(' + x1(markerz[0]) + ',' + (availableHeight / 2) + ')' })
- .attr('d', 'M0,' + h3 + 'L' + h3 + ',' + (-h3) + ' ' + (-h3) + ',' + (-h3) + 'Z')
- .on('mouseover', function() {
- dispatch.elementMouseover({
- value: markerz[0],
- label: markerLabelz[0] || 'Previous',
- pos: [x1(markerz[0]), availableHeight/2]
- })
- })
- .on('mouseout', function() {
- dispatch.elementMouseout({
- value: markerz[0],
- label: markerLabelz[0] || 'Previous'
- })
- });
- } else {
- g.selectAll('path.nv-markerTriangle').remove();
- }
+ // if we know yDomain, no need to calculate
+ var yData = []
+ if (!yDomain) {
+ // (y-range is based on quartiles, whiskers and outliers)
+ // lower values
+ var yMin = d3.min(data.map(function(d) {
+ var min_arr = [];
- wrap.selectAll('.nv-range')
- .on('mouseover', function(d,i) {
- var label = rangeLabelz[i] || (!i ? "Maximum" : i == 1 ? "Mean" : "Minimum");
+ min_arr.push(d.values.Q1);
+ if (d.values.hasOwnProperty('whisker_low') && d.values.whisker_low !== null) { min_arr.push(d.values.whisker_low); }
+ if (d.values.hasOwnProperty('outliers') && d.values.outliers !== null) { min_arr = min_arr.concat(d.values.outliers); }
- dispatch.elementMouseover({
- value: d,
- label: label,
- pos: [x1(d), availableHeight/2]
- })
- })
- .on('mouseout', function(d,i) {
- var label = rangeLabelz[i] || (!i ? "Maximum" : i == 1 ? "Mean" : "Minimum");
+ return d3.min(min_arr);
+ }));
- dispatch.elementMouseout({
- value: d,
- label: label
- })
- })
-
-/* // THIS IS THE PREVIOUS BULLET IMPLEMENTATION, WILL REMOVE SHORTLY
- // Update the range rects.
- var range = g.selectAll('rect.nv-range')
- .data(rangez);
-
- range.enter().append('rect')
- .attr('class', function(d, i) { return 'nv-range nv-s' + i; })
- .attr('width', w0)
- .attr('height', availableHeight)
- .attr('x', reverse ? x0 : 0)
- .on('mouseover', function(d,i) {
- dispatch.elementMouseover({
- value: d,
- label: (i <= 0) ? 'Maximum' : (i > 1) ? 'Minimum' : 'Mean', //TODO: make these labels a variable
- pos: [x1(d), availableHeight/2]
- })
- })
- .on('mouseout', function(d,i) {
- dispatch.elementMouseout({
- value: d,
- label: (i <= 0) ? 'Minimum' : (i >=1) ? 'Maximum' : 'Mean' //TODO: make these labels a variable
- })
- })
-
- d3.transition(range)
- .attr('x', reverse ? x1 : 0)
- .attr('width', w1)
- .attr('height', availableHeight);
-
-
- // Update the measure rects.
- var measure = g.selectAll('rect.nv-measure')
- .data(measurez);
-
- measure.enter().append('rect')
- .attr('class', function(d, i) { return 'nv-measure nv-s' + i; })
- .style('fill', function(d,i) { return color(d,i ) })
- .attr('width', w0)
- .attr('height', availableHeight / 3)
- .attr('x', reverse ? x0 : 0)
- .attr('y', availableHeight / 3)
- .on('mouseover', function(d) {
- dispatch.elementMouseover({
- value: d,
- label: 'Current', //TODO: make these labels a variable
- pos: [x1(d), availableHeight/2]
- })
- })
- .on('mouseout', function(d) {
- dispatch.elementMouseout({
- value: d,
- label: 'Current' //TODO: make these labels a variable
- })
- })
-
- d3.transition(measure)
- .attr('width', w1)
- .attr('height', availableHeight / 3)
- .attr('x', reverse ? x1 : 0)
- .attr('y', availableHeight / 3);
-
-
-
- // Update the marker lines.
- var marker = g.selectAll('path.nv-markerTriangle')
- .data(markerz);
-
- var h3 = availableHeight / 6;
- marker.enter().append('path')
- .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) {
- dispatch.elementMouseover({
- value: d,
- label: 'Previous',
- pos: [x1(d), availableHeight/2]
- })
- })
- .on('mouseout', function(d,i) {
- dispatch.elementMouseout({
- value: d,
- label: 'Previous'
- })
- });
+ // upper values
+ var yMax = d3.max(data.map(function(d) {
+ var max_arr = [];
- d3.transition(marker)
- .attr('transform', function(d) { return 'translate(' + (x1(d) - x1(0)) + ',' + (availableHeight / 2) + ')' });
+ max_arr.push(d.values.Q3);
+ if (d.values.hasOwnProperty('whisker_high') && d.values.whisker_high !== null) { max_arr.push(d.values.whisker_high); }
+ if (d.values.hasOwnProperty('outliers') && d.values.outliers !== null) { max_arr = max_arr.concat(d.values.outliers); }
- marker.exit().remove();
-*/
+ return d3.max(max_arr);
+ }));
- });
+ yData = [ yMin, yMax ] ;
+ }
- // d3.timer.flush(); // Not needed?
+ y.domain(yDomain || yData);
+ y.range(yRange || [availableHeight, 0]);
+
+ //store old scales if they exist
+ x0 = x0 || x;
+ y0 = y0 || y.copy().range([y(0),y(0)]);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap').data([data]);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ var boxplots = wrap.selectAll('.nv-boxplot').data(function(d) { return d });
+ var boxEnter = boxplots.enter().append('g').style('stroke-opacity', 1e-6).style('fill-opacity', 1e-6);
+ boxplots
+ .attr('class', 'nv-boxplot')
+ .attr('transform', function(d,i,j) { return 'translate(' + (x(getX(d,i)) + x.rangeBand() * .05) + ', 0)'; })
+ .classed('hover', function(d) { return d.hover });
+ boxplots
+ .watchTransition(renderWatch, 'nv-boxplot: boxplots')
+ .style('stroke-opacity', 1)
+ .style('fill-opacity', .75)
+ .delay(function(d,i) { return i * duration / data.length })
+ .attr('transform', function(d,i) {
+ return 'translate(' + (x(getX(d,i)) + x.rangeBand() * .05) + ', 0)';
+ });
+ boxplots.exit().remove();
- return chart;
- }
+ // ----- add the SVG elements for each boxPlot -----
+ // conditionally append whisker lines
+ boxEnter.each(function(d,i) {
+ var box = d3.select(this);
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
+ ['low', 'high'].forEach(function(key) {
+ if (d.values.hasOwnProperty('whisker_' + key) && d.values['whisker_' + key] !== null) {
+ box.append('line')
+ .style('stroke', (d.color) ? d.color : color(d,i))
+ .attr('class', 'nv-boxplot-whisker nv-boxplot-' + key);
- chart.dispatch = dispatch;
+ box.append('line')
+ .style('stroke', (d.color) ? d.color : color(d,i))
+ .attr('class', 'nv-boxplot-tick nv-boxplot-' + key);
+ }
+ });
+ });
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- // left, right, top, bottom
- chart.orient = function(_) {
- if (!arguments.length) return orient;
- orient = _;
- reverse = orient == 'right' || orient == 'bottom';
- return chart;
- };
+ // outliers
+ // TODO: support custom colors here
+ var outliers = boxplots.selectAll('.nv-boxplot-outlier').data(function(d) {
+ if (d.values.hasOwnProperty('outliers') && d.values.outliers !== null) { return d.values.outliers; }
+ else { return []; }
+ });
+ outliers.enter().append('circle')
+ .style('fill', function(d,i,j) { return color(d,j) }).style('stroke', function(d,i,j) { return color(d,j) })
+ .on('mouseover', function(d,i,j) {
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ series: { key: d, color: color(d,j) },
+ e: d3.event
+ });
+ })
+ .on('mouseout', function(d,i,j) {
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ series: { key: d, color: color(d,j) },
+ e: d3.event
+ });
+ })
+ .on('mousemove', function(d,i) {
+ dispatch.elementMousemove({e: d3.event});
+ });
- // ranges (bad, satisfactory, good)
- chart.ranges = function(_) {
- if (!arguments.length) return ranges;
- ranges = _;
- return chart;
- };
+ outliers.attr('class', 'nv-boxplot-outlier');
+ outliers
+ .watchTransition(renderWatch, 'nv-boxplot: nv-boxplot-outlier')
+ .attr('cx', x.rangeBand() * .45)
+ .attr('cy', function(d,i,j) { return y(d); })
+ .attr('r', '3');
+ outliers.exit().remove();
+
+ var box_width = function() { return (maxBoxWidth === null ? x.rangeBand() * .9 : Math.min(75, x.rangeBand() * .9)); };
+ var box_left = function() { return x.rangeBand() * .45 - box_width()/2; };
+ var box_right = function() { return x.rangeBand() * .45 + box_width()/2; };
+
+ // update whisker lines and ticks
+ ['low', 'high'].forEach(function(key) {
+ var endpoint = (key === 'low') ? 'Q1' : 'Q3';
+
+ boxplots.select('line.nv-boxplot-whisker.nv-boxplot-' + key)
+ .watchTransition(renderWatch, 'nv-boxplot: boxplots')
+ .attr('x1', x.rangeBand() * .45 )
+ .attr('y1', function(d,i) { return y(d.values['whisker_' + key]); })
+ .attr('x2', x.rangeBand() * .45 )
+ .attr('y2', function(d,i) { return y(d.values[endpoint]); });
+
+ boxplots.select('line.nv-boxplot-tick.nv-boxplot-' + key)
+ .watchTransition(renderWatch, 'nv-boxplot: boxplots')
+ .attr('x1', box_left )
+ .attr('y1', function(d,i) { return y(d.values['whisker_' + key]); })
+ .attr('x2', box_right )
+ .attr('y2', function(d,i) { return y(d.values['whisker_' + key]); });
+ });
- // markers (previous, goal)
- chart.markers = function(_) {
- if (!arguments.length) return markers;
- markers = _;
- return chart;
- };
+ ['low', 'high'].forEach(function(key) {
+ boxEnter.selectAll('.nv-boxplot-' + key)
+ .on('mouseover', function(d,i,j) {
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ series: { key: d.values['whisker_' + key], color: color(d,j) },
+ e: d3.event
+ });
+ })
+ .on('mouseout', function(d,i,j) {
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ series: { key: d.values['whisker_' + key], color: color(d,j) },
+ e: d3.event
+ });
+ })
+ .on('mousemove', function(d,i) {
+ dispatch.elementMousemove({e: d3.event});
+ });
+ });
- // measures (actual, forecast)
- chart.measures = function(_) {
- if (!arguments.length) return measures;
- measures = _;
- return chart;
- };
+ // boxes
+ boxEnter.append('rect')
+ .attr('class', 'nv-boxplot-box')
+ // tooltip events
+ .on('mouseover', function(d,i) {
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ key: d.label,
+ value: d.label,
+ series: [
+ { key: 'Q3', value: d.values.Q3, color: d.color || color(d,i) },
+ { key: 'Q2', value: d.values.Q2, color: d.color || color(d,i) },
+ { key: 'Q1', value: d.values.Q1, color: d.color || color(d,i) }
+ ],
+ data: d,
+ index: i,
+ e: d3.event
+ });
+ })
+ .on('mouseout', function(d,i) {
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ key: d.label,
+ value: d.label,
+ series: [
+ { key: 'Q3', value: d.values.Q3, color: d.color || color(d,i) },
+ { key: 'Q2', value: d.values.Q2, color: d.color || color(d,i) },
+ { key: 'Q1', value: d.values.Q1, color: d.color || color(d,i) }
+ ],
+ data: d,
+ index: i,
+ e: d3.event
+ });
+ })
+ .on('mousemove', function(d,i) {
+ dispatch.elementMousemove({e: d3.event});
+ });
- chart.forceX = function(_) {
- if (!arguments.length) return forceX;
- forceX = _;
- return chart;
- };
+ // box transitions
+ boxplots.select('rect.nv-boxplot-box')
+ .watchTransition(renderWatch, 'nv-boxplot: boxes')
+ .attr('y', function(d,i) { return y(d.values.Q3); })
+ .attr('width', box_width)
+ .attr('x', box_left )
+
+ .attr('height', function(d,i) { return Math.abs(y(d.values.Q3) - y(d.values.Q1)) || 1 })
+ .style('fill', function(d,i) { return d.color || color(d,i) })
+ .style('stroke', function(d,i) { return d.color || color(d,i) });
+
+ // median line
+ boxEnter.append('line').attr('class', 'nv-boxplot-median');
+
+ boxplots.select('line.nv-boxplot-median')
+ .watchTransition(renderWatch, 'nv-boxplot: boxplots line')
+ .attr('x1', box_left)
+ .attr('y1', function(d,i) { return y(d.values.Q2); })
+ .attr('x2', box_right)
+ .attr('y2', function(d,i) { return y(d.values.Q2); });
+
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
+ });
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ renderWatch.renderEnd('nv-boxplot immediate');
+ return chart;
+ }
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ maxBoxWidth: {get: function(){return maxBoxWidth;}, set: function(_){maxBoxWidth=_;}},
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ // rectClass: {get: function(){return rectClass;}, set: function(_){rectClass=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ }}
+ });
- chart.tickFormat = function(_) {
- if (!arguments.length) return tickFormat;
- tickFormat = _;
- return chart;
- };
+ nv.utils.initOptions(chart);
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
return chart;
- };
-
- //============================================================
-
-
- return chart;
};
+nv.models.boxPlotChart = function() {
+ "use strict";
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+ var boxplot = nv.models.boxPlot()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ ;
-// Chart design based on the recommendations of Stephen Few. Implementation
-// based on the work of Clint Ivy, Jamie Love, and Jason Davies.
-// http://projects.instantcognition.com/protovis/bulletchart/
-nv.models.bulletChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
+ var margin = {top: 15, right: 10, bottom: 50, left: 60}
+ , width = null
+ , height = null
+ , color = nv.utils.getColor()
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , staggerLabels = false
+ , tooltip = nv.models.tooltip()
+ , x
+ , y
+ , noData = "No Data Available."
+ , dispatch = d3.dispatch('beforeUpdate', 'renderEnd')
+ , duration = 250
+ ;
- var bullet = nv.models.bullet()
+ xAxis
+ .orient('bottom')
+ .showMaxMin(false)
+ .tickFormat(function(d) { return d })
;
-
- var orient = 'left' // TODO top & bottom
- , reverse = false
- , margin = {top: 5, right: 40, bottom: 20, left: 120}
- , ranges = function(d) { return d.ranges }
- , markers = function(d) { return d.markers }
- , measures = function(d) { return d.measures }
- , width = null
- , height = 55
- , tickFormat = null
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + x + '</h3>' +
- '<p>' + y + '</p>'
- }
- , noData = 'No Data Available.'
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide')
+ yAxis
+ .orient((rightAlignYAxis) ? 'right' : 'left')
+ .tickFormat(d3.format(',.1f'))
;
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ) + margin.left,
- top = e.pos[1] + ( offsetElement.offsetTop || 0) + margin.top,
- content = tooltip(e.key, e.label, e.value, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'e' : 'w', null, offsetElement);
- };
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(d, i) {
- var container = d3.select(this);
+ tooltip.duration(0);
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- that = this;
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
- chart.update = function() { chart(selection) };
- chart.container = this;
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(boxplot);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!d || !ranges.call(this, d, i)) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', 18 + margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
-
- var rangez = ranges.call(this, d, i).slice().sort(d3.descending),
- markerz = markers.call(this, d, i).slice().sort(d3.descending),
- measurez = measures.call(this, d, i).slice().sort(d3.descending);
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = (width || parseInt(container.style('width')) || 960)
+ - margin.left - margin.right,
+ availableHeight = (height || parseInt(container.style('height')) || 400)
+ - margin.top - margin.bottom;
+ chart.update = function() {
+ dispatch.beforeUpdate();
+ container.transition().duration(duration).call(chart);
+ };
+ chart.container = this;
+
+ // Display No Data message if there's nothing to show. (quartiles required at minimum)
+ if (!data || !data.length ||
+ !data.filter(function(d) { return d.values.hasOwnProperty("Q1") && d.values.hasOwnProperty("Q2") && d.values.hasOwnProperty("Q3"); }).length) {
+ var noDataText = container.selectAll('.nv-noData').data([noData]);
+
+ noDataText.enter().append('text')
+ .attr('class', 'nvd3 nv-noData')
+ .attr('dy', '-.7em')
+ .style('text-anchor', 'middle');
+
+ noDataText
+ .attr('x', margin.left + availableWidth / 2)
+ .attr('y', margin.top + availableHeight / 2)
+ .text(function(d) { return d });
+
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ // Setup Scales
+ x = boxplot.xScale();
+ y = boxplot.yScale().clamp(true);
- 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');
- var g = wrap.select('g');
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-boxPlotWithAxes').data([data]);
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-boxPlotWithAxes').append('g');
+ var defsEnter = gEnter.append('defs');
+ var g = wrap.select('g');
- gEnter.append('g').attr('class', 'nv-bulletWrap');
- gEnter.append('g').attr('class', 'nv-titles');
+ gEnter.append('g').attr('class', 'nv-x nv-axis');
+ gEnter.append('g').attr('class', 'nv-y nv-axis')
+ .append('g').attr('class', 'nv-zeroLine')
+ .append('line');
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ gEnter.append('g').attr('class', 'nv-barsWrap');
- //------------------------------------------------------------
+ g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
- // Compute the new x-scale.
- var x1 = d3.scale.linear()
- .domain([0, Math.max(rangez[0], markerz[0], measurez[0])]) // TODO: need to allow forceX and forceY, and xDomain, yDomain
- .range(reverse ? [availableWidth, 0] : [0, availableWidth]);
+ // Main Chart Component(s)
+ boxplot
+ .width(availableWidth)
+ .height(availableHeight);
- // Retrieve the old x-scale, if this is an update.
- var x0 = this.__chart__ || d3.scale.linear()
- .domain([0, Infinity])
- .range(x1.range());
+ var barsWrap = g.select('.nv-barsWrap')
+ .datum(data.filter(function(d) { return !d.disabled }))
- // Stash the new scale.
- this.__chart__ = x1;
+ barsWrap.transition().call(boxplot);
- /*
- // Derive width-scales from the x-scales.
- var w0 = bulletWidth(x0),
- w1 = bulletWidth(x1);
- function bulletWidth(x) {
- var x0 = x(0);
- return function(d) {
- return Math.abs(x(d) - x(0));
- };
- }
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-x-label-clip-' + boxplot.id())
+ .append('rect');
- function bulletTranslate(x) {
- return function(d) {
- return 'translate(' + x(d) + ',0)';
- };
- }
- */
+ g.select('#nv-x-label-clip-' + boxplot.id() + ' rect')
+ .attr('width', x.rangeBand() * (staggerLabels ? 2 : 1))
+ .attr('height', 16)
+ .attr('x', -x.rangeBand() / (staggerLabels ? 1 : 2 ));
- var w0 = function(d) { return Math.abs(x0(d) - x0(0)) }, // TODO: could optimize by precalculating x0(0) and x1(0)
- w1 = function(d) { return Math.abs(x1(d) - x1(0)) };
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ .ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight, 0);
+ g.select('.nv-x.nv-axis').attr('transform', 'translate(0,' + y.range()[0] + ')');
+ g.select('.nv-x.nv-axis').call(xAxis);
- var title = gEnter.select('.nv-titles').append('g')
- .attr('text-anchor', 'end')
- .attr('transform', 'translate(-6,' + (height - margin.top - margin.bottom) / 2 + ')');
- title.append('text')
- .attr('class', 'nv-title')
- .text(function(d) { return d.title; });
-
- title.append('text')
- .attr('class', 'nv-subtitle')
- .attr('dy', '1em')
- .text(function(d) { return d.subtitle; });
-
+ var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
+ if (staggerLabels) {
+ xTicks
+ .selectAll('text')
+ .attr('transform', function(d,i,j) { return 'translate(0,' + (j % 2 == 0 ? '5' : '17') + ')' })
+ }
+ }
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ .ticks( Math.floor(availableHeight/36) ) // can't use nv.utils.calcTicksY with Object data
+ .tickSize( -availableWidth, 0);
- bullet
- .width(availableWidth)
- .height(availableHeight)
+ g.select('.nv-y.nv-axis').call(yAxis);
+ }
- var bulletWrap = g.select('.nv-bulletWrap');
+ // Zero line
+ g.select(".nv-zeroLine line")
+ .attr("x1",0)
+ .attr("x2",availableWidth)
+ .attr("y1", y(0))
+ .attr("y2", y(0))
+ ;
- d3.transition(bulletWrap).call(bullet);
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
+ });
+ renderWatch.renderEnd('nv-boxplot chart immediate');
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
- // Compute the tick format.
- var format = tickFormat || x1.tickFormat( availableWidth / 100 );
+ boxplot.dispatch.on('elementMouseover.tooltip', function(evt) {
+ tooltip.data(evt).hidden(false);
+ });
- // Update the tick groups.
- var tick = g.selectAll('g.nv-tick')
- .data(x1.ticks( availableWidth / 50 ), function(d) {
- return this.textContent || format(d);
- });
+ boxplot.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.data(evt).hidden(true);
+ });
- // Initialize the ticks with the old scale, x0.
- var tickEnter = tick.enter().append('g')
- .attr('class', 'nv-tick')
- .attr('transform', function(d) { return 'translate(' + x0(d) + ',0)' })
- .style('opacity', 1e-6);
+ boxplot.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- tickEnter.append('line')
- .attr('y1', availableHeight)
- .attr('y2', availableHeight * 7 / 6);
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.boxplot = boxplot;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ staggerLabels: {get: function(){return staggerLabels;}, set: function(_){staggerLabels=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ tooltipContent: {get: function(){return tooltip;}, set: function(_){tooltip=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ boxplot.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ boxplot.color(color);
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( (_) ? 'right' : 'left');
+ }}
+ });
- tickEnter.append('text')
- .attr('text-anchor', 'middle')
- .attr('dy', '1em')
- .attr('y', availableHeight * 7 / 6)
- .text(format);
+ nv.utils.inheritOptions(chart, boxplot);
+ nv.utils.initOptions(chart);
+ return chart;
+}
- // Transition the updating ticks to the new scale, x1.
- var tickUpdate = d3.transition(tick)
- .attr('transform', function(d) { return 'translate(' + x1(d) + ',0)' })
- .style('opacity', 1);
+// Chart design based on the recommendations of Stephen Few. Implementation
+// based on the work of Clint Ivy, Jamie Love, and Jason Davies.
+// http://projects.instantcognition.com/protovis/bulletchart/
- tickUpdate.select('line')
- .attr('y1', availableHeight)
- .attr('y2', availableHeight * 7 / 6);
+nv.models.bullet = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , orient = 'left' // TODO top & bottom
+ , reverse = false
+ , ranges = function(d) { return d.ranges }
+ , markers = function(d) { return d.markers ? d.markers : [0] }
+ , measures = function(d) { return d.measures }
+ , rangeLabels = function(d) { return d.rangeLabels ? d.rangeLabels : [] }
+ , markerLabels = function(d) { return d.markerLabels ? d.markerLabels : [] }
+ , measureLabels = function(d) { return d.measureLabels ? d.measureLabels : [] }
+ , forceX = [0] // List of numbers to Force into the X scale (ie. 0, or a max / min, etc.)
+ , width = 380
+ , height = 30
+ , container = null
+ , tickFormat = null
+ , color = nv.utils.getColor(['#1f77b4'])
+ , dispatch = d3.dispatch('elementMouseover', 'elementMouseout', 'elementMousemove')
+ ;
- tickUpdate.select('text')
- .attr('y', availableHeight * 7 / 6);
+ function chart(selection) {
+ selection.each(function(d, i) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
+
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+
+ var rangez = ranges.call(this, d, i).slice().sort(d3.descending),
+ markerz = markers.call(this, d, i).slice().sort(d3.descending),
+ measurez = measures.call(this, d, i).slice().sort(d3.descending),
+ rangeLabelz = rangeLabels.call(this, d, i).slice(),
+ markerLabelz = markerLabels.call(this, d, i).slice(),
+ measureLabelz = measureLabels.call(this, d, i).slice();
+
+ // Setup Scales
+ // Compute the new x-scale.
+ var x1 = d3.scale.linear()
+ .domain( d3.extent(d3.merge([forceX, rangez])) )
+ .range(reverse ? [availableWidth, 0] : [0, availableWidth]);
+
+ // Retrieve the old x-scale, if this is an update.
+ var x0 = this.__chart__ || d3.scale.linear()
+ .domain([0, Infinity])
+ .range(x1.range());
+
+ // Stash the new scale.
+ this.__chart__ = x1;
+
+ var rangeMin = d3.min(rangez), //rangez[2]
+ rangeMax = d3.max(rangez), //rangez[0]
+ rangeAvg = rangez[1];
+
+ // Setup containers and skeleton of chart
+ var wrap = container.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');
+
+ gEnter.append('rect').attr('class', 'nv-range nv-rangeMax');
+ gEnter.append('rect').attr('class', 'nv-range nv-rangeAvg');
+ gEnter.append('rect').attr('class', 'nv-range nv-rangeMin');
+ gEnter.append('rect').attr('class', 'nv-measure');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ var w0 = function(d) { return Math.abs(x0(d) - x0(0)) }, // TODO: could optimize by precalculating x0(0) and x1(0)
+ w1 = function(d) { return Math.abs(x1(d) - x1(0)) };
+ var xp0 = function(d) { return d < 0 ? x0(d) : x0(0) },
+ xp1 = function(d) { return d < 0 ? x1(d) : x1(0) };
+
+ g.select('rect.nv-rangeMax')
+ .attr('height', availableHeight)
+ .attr('width', w1(rangeMax > 0 ? rangeMax : rangeMin))
+ .attr('x', xp1(rangeMax > 0 ? rangeMax : rangeMin))
+ .datum(rangeMax > 0 ? rangeMax : rangeMin)
+
+ g.select('rect.nv-rangeAvg')
+ .attr('height', availableHeight)
+ .attr('width', w1(rangeAvg))
+ .attr('x', xp1(rangeAvg))
+ .datum(rangeAvg)
+
+ g.select('rect.nv-rangeMin')
+ .attr('height', availableHeight)
+ .attr('width', w1(rangeMax))
+ .attr('x', xp1(rangeMax))
+ .attr('width', w1(rangeMax > 0 ? rangeMin : rangeMax))
+ .attr('x', xp1(rangeMax > 0 ? rangeMin : rangeMax))
+ .datum(rangeMax > 0 ? rangeMin : rangeMax)
+
+ g.select('rect.nv-measure')
+ .style('fill', color)
+ .attr('height', availableHeight / 3)
+ .attr('y', availableHeight / 3)
+ .attr('width', measurez < 0 ?
+ x1(0) - x1(measurez[0])
+ : x1(measurez[0]) - x1(0))
+ .attr('x', xp1(measurez))
+ .on('mouseover', function() {
+ dispatch.elementMouseover({
+ value: measurez[0],
+ label: measureLabelz[0] || 'Current',
+ color: d3.select(this).style("fill")
+ })
+ })
+ .on('mousemove', function() {
+ dispatch.elementMousemove({
+ value: measurez[0],
+ label: measureLabelz[0] || 'Current',
+ color: d3.select(this).style("fill")
+ })
+ })
+ .on('mouseout', function() {
+ dispatch.elementMouseout({
+ value: measurez[0],
+ label: measureLabelz[0] || 'Current',
+ color: d3.select(this).style("fill")
+ })
+ });
- // Transition the exiting ticks to the new scale, x1.
- d3.transition(tick.exit())
- .attr('transform', function(d) { return 'translate(' + x1(d) + ',0)' })
- .style('opacity', 1e-6)
- .remove();
+ var h3 = availableHeight / 6;
+ var markerData = markerz.map( function(marker, index) {
+ return {value: marker, label: markerLabelz[index]}
+ });
+ gEnter
+ .selectAll("path.nv-markerTriangle")
+ .data(markerData)
+ .enter()
+ .append('path')
+ .attr('class', 'nv-markerTriangle')
+ .attr('transform', function(d) { return 'translate(' + x1(d.value) + ',' + (availableHeight / 2) + ')' })
+ .attr('d', 'M0,' + h3 + 'L' + h3 + ',' + (-h3) + ' ' + (-h3) + ',' + (-h3) + 'Z')
+ .on('mouseover', function(d) {
+ dispatch.elementMouseover({
+ value: d.value,
+ label: d.label || 'Previous',
+ color: d3.select(this).style("fill"),
+ pos: [x1(d.value), availableHeight/2]
+ })
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ })
+ .on('mousemove', function(d) {
+ dispatch.elementMousemove({
+ value: d.value,
+ label: d.label || 'Previous',
+ color: d3.select(this).style("fill")
+ })
+ })
+ .on('mouseout', function(d, i) {
+ dispatch.elementMouseout({
+ value: d.value,
+ label: d.label || 'Previous',
+ color: d3.select(this).style("fill")
+ })
+ });
- dispatch.on('tooltipShow', function(e) {
- e.key = d.title;
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ wrap.selectAll('.nv-range')
+ .on('mouseover', function(d,i) {
+ var label = rangeLabelz[i] || (!i ? "Maximum" : i == 1 ? "Mean" : "Minimum");
+ dispatch.elementMouseover({
+ value: d,
+ label: label,
+ color: d3.select(this).style("fill")
+ })
+ })
+ .on('mousemove', function() {
+ dispatch.elementMousemove({
+ value: measurez[0],
+ label: measureLabelz[0] || 'Previous',
+ color: d3.select(this).style("fill")
+ })
+ })
+ .on('mouseout', function(d,i) {
+ var label = rangeLabelz[i] || (!i ? "Maximum" : i == 1 ? "Mean" : "Minimum");
+ dispatch.elementMouseout({
+ value: d,
+ label: label,
+ color: d3.select(this).style("fill")
+ })
+ });
+ });
- //============================================================
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ ranges: {get: function(){return ranges;}, set: function(_){ranges=_;}}, // ranges (bad, satisfactory, good)
+ markers: {get: function(){return markers;}, set: function(_){markers=_;}}, // markers (previous, goal)
+ measures: {get: function(){return measures;}, set: function(_){measures=_;}}, // measures (actual, forecast)
+ forceX: {get: function(){return forceX;}, set: function(_){forceX=_;}},
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ tickFormat: {get: function(){return tickFormat;}, set: function(_){tickFormat=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ orient: {get: function(){return orient;}, set: function(_){ // left, right, top, bottom
+ orient = _;
+ reverse = orient == 'right' || orient == 'bottom';
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
});
- d3.timer.flush();
-
+ nv.utils.initOptions(chart);
return chart;
- }
+};
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
- bullet.dispatch.on('elementMouseover.tooltip', function(e) {
- dispatch.tooltipShow(e);
- });
+// Chart design based on the recommendations of Stephen Few. Implementation
+// based on the work of Clint Ivy, Jamie Love, and Jason Davies.
+// http://projects.instantcognition.com/protovis/bulletchart/
+nv.models.bulletChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var bullet = nv.models.bullet();
+ var tooltip = nv.models.tooltip();
+
+ var orient = 'left' // TODO top & bottom
+ , reverse = false
+ , margin = {top: 5, right: 40, bottom: 20, left: 120}
+ , ranges = function(d) { return d.ranges }
+ , markers = function(d) { return d.markers ? d.markers : [0] }
+ , measures = function(d) { return d.measures }
+ , width = null
+ , height = 55
+ , tickFormat = null
+ , ticks = null
+ , noData = null
+ , dispatch = d3.dispatch()
+ ;
- bullet.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
+ tooltip
+ .duration(0)
+ .headerEnabled(false);
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
+ function chart(selection) {
+ selection.each(function(d, i) {
+ var container = d3.select(this);
+ nv.utils.initSVG(container);
- //============================================================
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = height - margin.top - margin.bottom,
+ that = this;
+ chart.update = function() { chart(selection) };
+ chart.container = this;
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
+ // Display No Data message if there's nothing to show.
+ if (!d || !ranges.call(this, d, i)) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- chart.dispatch = dispatch;
- chart.bullet = bullet;
+ var rangez = ranges.call(this, d, i).slice().sort(d3.descending),
+ markerz = markers.call(this, d, i).slice().sort(d3.descending),
+ measurez = measures.call(this, d, i).slice().sort(d3.descending);
- d3.rebind(chart, bullet, 'color');
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- // left, right, top, bottom
- chart.orient = function(x) {
- if (!arguments.length) return orient;
- orient = x;
- reverse = orient == 'right' || orient == 'bottom';
- return chart;
- };
+ gEnter.append('g').attr('class', 'nv-bulletWrap');
+ gEnter.append('g').attr('class', 'nv-titles');
- // ranges (bad, satisfactory, good)
- chart.ranges = function(x) {
- if (!arguments.length) return ranges;
- ranges = x;
- return chart;
- };
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- // markers (previous, goal)
- chart.markers = function(x) {
- if (!arguments.length) return markers;
- markers = x;
- return chart;
- };
+ // Compute the new x-scale.
+ var x1 = d3.scale.linear()
+ .domain([0, Math.max(rangez[0], markerz[0], measurez[0])]) // TODO: need to allow forceX and forceY, and xDomain, yDomain
+ .range(reverse ? [availableWidth, 0] : [0, availableWidth]);
- // measures (actual, forecast)
- chart.measures = function(x) {
- if (!arguments.length) return measures;
- measures = x;
- return chart;
- };
+ // Retrieve the old x-scale, if this is an update.
+ var x0 = this.__chart__ || d3.scale.linear()
+ .domain([0, Infinity])
+ .range(x1.range());
- chart.width = function(x) {
- if (!arguments.length) return width;
- width = x;
- return chart;
- };
+ // Stash the new scale.
+ this.__chart__ = x1;
- chart.height = function(x) {
- if (!arguments.length) return height;
- height = x;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ var w0 = function(d) { return Math.abs(x0(d) - x0(0)) }, // TODO: could optimize by precalculating x0(0) and x1(0)
+ w1 = function(d) { return Math.abs(x1(d) - x1(0)) };
- chart.tickFormat = function(x) {
- if (!arguments.length) return tickFormat;
- tickFormat = x;
- return chart;
- };
+ var title = gEnter.select('.nv-titles').append('g')
+ .attr('text-anchor', 'end')
+ .attr('transform', 'translate(-6,' + (height - margin.top - margin.bottom) / 2 + ')');
+ title.append('text')
+ .attr('class', 'nv-title')
+ .text(function(d) { return d.title; });
+
+ title.append('text')
+ .attr('class', 'nv-subtitle')
+ .attr('dy', '1em')
+ .text(function(d) { return d.subtitle; });
+
+ bullet
+ .width(availableWidth)
+ .height(availableHeight)
+
+ var bulletWrap = g.select('.nv-bulletWrap');
+ d3.transition(bulletWrap).call(bullet);
+
+ // Compute the tick format.
+ var format = tickFormat || x1.tickFormat( availableWidth / 100 );
+
+ // Update the tick groups.
+ var tick = g.selectAll('g.nv-tick')
+ .data(x1.ticks( ticks ? ticks : (availableWidth / 50) ), function(d) {
+ return this.textContent || format(d);
+ });
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ // Initialize the ticks with the old scale, x0.
+ var tickEnter = tick.enter().append('g')
+ .attr('class', 'nv-tick')
+ .attr('transform', function(d) { return 'translate(' + x0(d) + ',0)' })
+ .style('opacity', 1e-6);
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ tickEnter.append('line')
+ .attr('y1', availableHeight)
+ .attr('y2', availableHeight * 7 / 6);
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ tickEnter.append('text')
+ .attr('text-anchor', 'middle')
+ .attr('dy', '1em')
+ .attr('y', availableHeight * 7 / 6)
+ .text(format);
- //============================================================
+ // Transition the updating ticks to the new scale, x1.
+ var tickUpdate = d3.transition(tick)
+ .attr('transform', function(d) { return 'translate(' + x1(d) + ',0)' })
+ .style('opacity', 1);
+ tickUpdate.select('line')
+ .attr('y1', availableHeight)
+ .attr('y2', availableHeight * 7 / 6);
- return chart;
-};
+ tickUpdate.select('text')
+ .attr('y', availableHeight * 7 / 6);
+ // Transition the exiting ticks to the new scale, x1.
+ d3.transition(tick.exit())
+ .attr('transform', function(d) { return 'translate(' + x1(d) + ',0)' })
+ .style('opacity', 1e-6)
+ .remove();
+ });
+ d3.timer.flush();
+ return chart;
+ }
-nv.models.cumulativeLineChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var lines = nv.models.line()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- , controls = nv.models.legend()
- , interactiveLayer = nv.interactiveGuideline()
- ;
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
- var margin = {top: 30, right: 30, bottom: 50, left: 60}
- , color = nv.utils.defaultColor()
- , width = null
- , height = null
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , tooltips = true
- , showControls = true
- , useInteractiveGuideline = false
- , rescaleY = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>'
- }
- , x //can be accessed via chart.xScale()
- , y //can be accessed via chart.yScale()
- , id = lines.id()
- , state = { index: 0, rescaleY: rescaleY }
- , defaultState = null
- , noData = 'No Data Available.'
- , average = function(d) { return d.average }
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , transitionDuration = 250
- , noErrorCheck = false //if set to TRUE, will bypass an error check in the indexify function.
- ;
+ bullet.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt['series'] = {
+ key: evt.label,
+ value: evt.value,
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
+ });
- xAxis
- .orient('bottom')
- .tickPadding(7)
- ;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- ;
+ bullet.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- //============================================================
- controls.updateState(false);
+ bullet.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- //============================================================
- // Private Variables
- //------------------------------------------------------------
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.bullet = bullet;
+ chart.dispatch = dispatch;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ ranges: {get: function(){return ranges;}, set: function(_){ranges=_;}}, // ranges (bad, satisfactory, good)
+ markers: {get: function(){return markers;}, set: function(_){markers=_;}}, // markers (previous, goal)
+ measures: {get: function(){return measures;}, set: function(_){measures=_;}}, // measures (actual, forecast)
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ tickFormat: {get: function(){return tickFormat;}, set: function(_){tickFormat=_;}},
+ ticks: {get: function(){return ticks;}, set: function(_){ticks=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ orient: {get: function(){return orient;}, set: function(_){ // left, right, top, bottom
+ orient = _;
+ reverse = orient == 'right' || orient == 'bottom';
+ }}
+ });
- var dx = d3.scale.linear()
- , index = {i: 0, x: 0}
- ;
+ nv.utils.inheritOptions(chart, bullet);
+ nv.utils.initOptions(chart);
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(lines.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(lines.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
+ return chart;
+};
- nv.tooltip.show([left, top], content, null, null, offsetElement);
- };
- //============================================================
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this).classed('nv-chart-' + id, true),
- that = this;
+nv.models.candlestickBar = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = null
+ , height = null
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container
+ , x = d3.scale.linear()
+ , y = d3.scale.linear()
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , getOpen = function(d) { return d.open }
+ , getClose = function(d) { return d.close }
+ , getHigh = function(d) { return d.high }
+ , getLow = function(d) { return d.low }
+ , forceX = []
+ , forceY = []
+ , padData = false // If true, adds half a data points width to front and back, for lining up a line chart with a bar chart
+ , clipEdge = true
+ , color = nv.utils.defaultColor()
+ , interactive = false
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , dispatch = d3.dispatch('stateChange', 'changeState', 'renderEnd', 'chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove')
+ ;
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ function chart(selection) {
+ selection.each(function(data) {
+ container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
- chart.container = this;
+ nv.utils.initSVG(container);
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ // Width of the candlestick bars.
+ var barWidth = (availableWidth / data[0].values.length) * .45;
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
+ // Setup Scales
+ x.domain(xDomain || d3.extent(data[0].values.map(getX).concat(forceX) ));
- var indexDrag = d3.behavior.drag()
- .on('dragstart', dragStart)
- .on('drag', dragMove)
- .on('dragend', dragEnd);
+ if (padData)
+ x.range(xRange || [availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
+ else
+ x.range(xRange || [5 + barWidth / 2, availableWidth - barWidth / 2 - 5]);
+
+ y.domain(yDomain || [
+ d3.min(data[0].values.map(getLow).concat(forceY)),
+ d3.max(data[0].values.map(getHigh).concat(forceY))
+ ]
+ ).range(yRange || [availableHeight, 0]);
+
+ // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
+ if (x.domain()[0] === x.domain()[1])
+ x.domain()[0] ?
+ x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
+ : x.domain([-1,1]);
+
+ 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])
+ : y.domain([-1,1]);
+
+ // Setup containers and skeleton of chart
+ var wrap = d3.select(this).selectAll('g.nv-wrap.nv-candlestickBar').data([data[0].values]);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-candlestickBar');
+ var defsEnter = wrapEnter.append('defs');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-ticks');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ container
+ .on('click', function(d,i) {
+ dispatch.chartClick({
+ data: d,
+ index: i,
+ pos: d3.event,
+ id: id
+ });
+ });
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-chart-clip-path-' + id)
+ .append('rect');
- function dragStart(d,i) {
- d3.select(chart.container)
- .style('cursor', 'ew-resize');
- }
+ wrap.select('#nv-chart-clip-path-' + id + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', availableHeight);
- function dragMove(d,i) {
- index.x = d3.event.x;
- index.i = Math.round(dx.invert(index.x));
- updateZero();
- }
+ g .attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
- function dragEnd(d,i) {
- d3.select(chart.container)
- .style('cursor', 'auto');
+ var ticks = wrap.select('.nv-ticks').selectAll('.nv-tick')
+ .data(function(d) { return d });
+ ticks.exit().remove();
- // update state and send stateChange with new index
- state.index = index.i;
- dispatch.stateChange(state);
- }
+ var tickGroups = ticks.enter().append('g');
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
+ // The colors are currently controlled by CSS.
+ ticks
+ .attr('class', function(d, i, j) { return (getOpen(d, i) > getClose(d, i) ? 'nv-tick negative' : 'nv-tick positive') + ' nv-tick-' + j + '-' + i});
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
+ var lines = tickGroups.append('line')
+ .attr('class', 'nv-candlestick-lines')
+ .attr('transform', function(d, i) { return 'translate(' + x(getX(d, i)) + ',0)'; })
+ .attr('x1', 0)
+ .attr('y1', function(d, i) { return y(getHigh(d, i)); })
+ .attr('x2', 0)
+ .attr('y2', function(d, i) { return y(getLow(d, i)); });
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
+ var rects = tickGroups.append('rect')
+ .attr('class', 'nv-candlestick-rects nv-bars')
+ .attr('transform', function(d, i) {
+ return 'translate(' + (x(getX(d, i)) - barWidth/2) + ','
+ + (y(getY(d, i)) - (getOpen(d, i) > getClose(d, i) ? (y(getClose(d, i)) - y(getOpen(d, i))) : 0))
+ + ')';
+ })
+ .attr('x', 0)
+ .attr('y', 0)
+ .attr('width', barWidth)
+ .attr('height', function(d, i) {
+ var open = getOpen(d, i);
+ var close = getClose(d, i);
+ return open > close ? y(close) - y(open) : y(open) - y(close);
+ });
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
+ ticks.select('.nv-candlestick-lines').transition()
+ .attr('transform', function(d, i) { return 'translate(' + x(getX(d, i)) + ',0)'; })
+ .attr('x1', 0)
+ .attr('y1', function(d, i) { return y(getHigh(d, i)); })
+ .attr('x2', 0)
+ .attr('y2', function(d, i) { return y(getLow(d, i)); });
+
+ ticks.select('.nv-candlestick-rects').transition()
+ .attr('transform', function(d, i) {
+ return 'translate(' + (x(getX(d, i)) - barWidth/2) + ','
+ + (y(getY(d, i)) - (getOpen(d, i) > getClose(d, i) ? (y(getClose(d, i)) - y(getOpen(d, i))) : 0))
+ + ')';
+ })
+ .attr('x', 0)
+ .attr('y', 0)
+ .attr('width', barWidth)
+ .attr('height', function(d, i) {
+ var open = getOpen(d, i);
+ var close = getClose(d, i);
+ return open > close ? y(close) - y(open) : y(open) - y(close);
+ });
+ });
return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = lines.xScale();
- y = lines.yScale();
-
-
- if (!rescaleY) {
- var seriesDomains = data
- .filter(function(series) { return !series.disabled })
- .map(function(series,i) {
- var initialDomain = d3.extent(series.values, lines.y());
-
- //account for series being disabled when losing 95% or more
- if (initialDomain[0] < -.95) initialDomain[0] = -.95;
-
- return [
- (initialDomain[0] - initialDomain[1]) / (1 + initialDomain[1]),
- (initialDomain[1] - initialDomain[0]) / (1 + initialDomain[0])
- ];
- });
-
- var completeDomain = [
- d3.min(seriesDomains, function(d) { return d[0] }),
- d3.max(seriesDomains, function(d) { return d[1] })
- ]
+ }
- lines.yDomain(completeDomain);
- } else {
- lines.yDomain(null);
- }
+ //Create methods to allow outside functions to highlight a specific bar.
+ chart.highlightPoint = function(pointIndex, isHoverOver) {
+ chart.clearHighlights();
+ container.select(".nv-candlestickBar .nv-tick-0-" + pointIndex)
+ .classed("hover", isHoverOver)
+ ;
+ };
- dx .domain([0, data[0].values.length - 1]) //Assumes all series have same length
- .range([0, availableWidth])
- .clamp(true);
+ chart.clearHighlights = function() {
+ container.select(".nv-candlestickBar .nv-tick.hover")
+ .classed("hover", false)
+ ;
+ };
- //------------------------------------------------------------
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ forceX: {get: function(){return forceX;}, set: function(_){forceX=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ padData: {get: function(){return padData;}, set: function(_){padData=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ interactive: {get: function(){return interactive;}, set: function(_){interactive=_;}},
+
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ open: {get: function(){return getOpen();}, set: function(_){getOpen=_;}},
+ close: {get: function(){return getClose();}, set: function(_){getClose=_;}},
+ high: {get: function(){return getHigh;}, set: function(_){getHigh=_;}},
+ low: {get: function(){return getLow;}, set: function(_){getLow=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top != undefined ? _.top : margin.top;
+ margin.right = _.right != undefined ? _.right : margin.right;
+ margin.bottom = _.bottom != undefined ? _.bottom : margin.bottom;
+ margin.left = _.left != undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
+ });
+ nv.utils.initOptions(chart);
+ return chart;
+};
- var data = indexify(index.i, data);
+nv.models.cumulativeLineChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var lines = nv.models.line()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend()
+ , controls = nv.models.legend()
+ , interactiveLayer = nv.interactiveGuideline()
+ , tooltip = nv.models.tooltip()
+ ;
+ var margin = {top: 30, right: 30, bottom: 50, left: 60}
+ , color = nv.utils.defaultColor()
+ , width = null
+ , height = null
+ , showLegend = true
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , showControls = true
+ , useInteractiveGuideline = false
+ , rescaleY = true
+ , x //can be accessed via chart.xScale()
+ , y //can be accessed via chart.yScale()
+ , id = lines.id()
+ , state = nv.utils.state()
+ , defaultState = null
+ , noData = null
+ , average = function(d) { return d.average }
+ , dispatch = d3.dispatch('stateChange', 'changeState', 'renderEnd')
+ , transitionDuration = 250
+ , duration = 250
+ , noErrorCheck = false //if set to TRUE, will bypass an error check in the indexify function.
+ ;
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
- var interactivePointerEvents = (useInteractiveGuideline) ? "none" : "all";
- 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');
- var g = wrap.select('g');
+ state.index = 0;
+ state.rescaleY = rescaleY;
- gEnter.append('g').attr('class', 'nv-interactive');
- gEnter.append('g').attr('class', 'nv-x nv-axis').style("pointer-events","none");
- gEnter.append('g').attr('class', 'nv-y nv-axis');
- gEnter.append('g').attr('class', 'nv-background');
- gEnter.append('g').attr('class', 'nv-linesWrap').style("pointer-events",interactivePointerEvents);
- gEnter.append('g').attr('class', 'nv-avgLinesWrap').style("pointer-events","none");
- gEnter.append('g').attr('class', 'nv-legendWrap');
- gEnter.append('g').attr('class', 'nv-controlsWrap');
+ xAxis.orient('bottom').tickPadding(7);
+ yAxis.orient((rightAlignYAxis) ? 'right' : 'left');
+ tooltip.valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ }).headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ });
- //------------------------------------------------------------
- // Legend
+ controls.updateState(false);
- if (showLegend) {
- legend.width(availableWidth);
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- g.select('.nv-legendWrap')
- .datum(data)
- .call(legend);
+ var dx = d3.scale.linear()
+ , index = {i: 0, x: 0}
+ , renderWatch = nv.utils.renderWatch(dispatch, duration)
+ ;
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled }),
+ index: index.i,
+ rescaleY: rescaleY
+ };
}
+ };
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Controls
-
- if (showControls) {
- var controlsData = [
- { key: 'Re-scale y-axis', disabled: !rescaleY }
- ];
-
- controls
- .width(140)
- .color(['#444', '#444', '#444'])
- .rightAlign(false)
- .margin({top: 5, right: 0, bottom: 5, left: 20})
- ;
-
- g.select('.nv-controlsWrap')
- .datum(controlsData)
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- .call(controls);
- }
-
- //------------------------------------------------------------
-
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.index !== undefined)
+ index.i = state.index;
+ if (state.rescaleY !== undefined)
+ rescaleY = state.rescaleY;
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
+ }
+ };
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(lines);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+ selection.each(function(data) {
+ var container = d3.select(this);
+ nv.utils.initSVG(container);
+ container.classed('nv-chart-' + id, true);
+ var that = this;
+
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ chart.update = function() {
+ if (duration === 0)
+ container.call(chart);
+ else
+ container.transition().duration(duration).call(chart)
+ };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
+ var indexDrag = d3.behavior.drag()
+ .on('dragstart', dragStart)
+ .on('drag', dragMove)
+ .on('dragend', dragEnd);
- // Show error if series goes below 100%
- var tempDisabled = data.filter(function(d) { return d.tempDisabled });
- wrap.select('.tempDisabled').remove(); //clean-up and prevent duplicates
- if (tempDisabled.length) {
- wrap.append('text').attr('class', 'tempDisabled')
- .attr('x', availableWidth / 2)
- .attr('y', '-.71em')
- .style('text-anchor', 'end')
- .text(tempDisabled.map(function(d) { return d.key }).join(', ') + ' values cannot be calculated for this time period.');
- }
+ function dragStart(d,i) {
+ d3.select(chart.container)
+ .style('cursor', 'ew-resize');
+ }
- //------------------------------------------------------------
- // Main Chart Component(s)
+ function dragMove(d,i) {
+ index.x = d3.event.x;
+ index.i = Math.round(dx.invert(index.x));
+ updateZero();
+ }
- //------------------------------------------------------------
- //Set up interactive layer
- if (useInteractiveGuideline) {
- interactiveLayer
- .width(availableWidth)
- .height(availableHeight)
- .margin({left:margin.left,top:margin.top})
- .svgContainer(container)
- .xScale(x);
- wrap.select(".nv-interactive").call(interactiveLayer);
- }
+ function dragEnd(d,i) {
+ d3.select(chart.container)
+ .style('cursor', 'auto');
- gEnter.select('.nv-background')
- .append('rect');
+ // update state and send stateChange with new index
+ state.index = index.i;
+ dispatch.stateChange(state);
+ }
- g.select('.nv-background rect')
- .attr('width', availableWidth)
- .attr('height', availableHeight);
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- lines
- //.x(function(d) { return d.x })
- .y(function(d) { return d.display.y })
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled && !data[i].tempDisabled; }));
+ // Setup Scales
+ x = lines.xScale();
+ y = lines.yScale();
+
+ if (!rescaleY) {
+ var seriesDomains = data
+ .filter(function(series) { return !series.disabled })
+ .map(function(series,i) {
+ var initialDomain = d3.extent(series.values, lines.y());
+
+ //account for series being disabled when losing 95% or more
+ if (initialDomain[0] < -.95) initialDomain[0] = -.95;
+
+ return [
+ (initialDomain[0] - initialDomain[1]) / (1 + initialDomain[1]),
+ (initialDomain[1] - initialDomain[0]) / (1 + initialDomain[0])
+ ];
+ });
+
+ var completeDomain = [
+ d3.min(seriesDomains, function(d) { return d[0] }),
+ d3.max(seriesDomains, function(d) { return d[1] })
+ ];
+
+ lines.yDomain(completeDomain);
+ } else {
+ lines.yDomain(null);
+ }
+ dx.domain([0, data[0].values.length - 1]) //Assumes all series have same length
+ .range([0, availableWidth])
+ .clamp(true);
+
+ var data = indexify(index.i, data);
+
+ // Setup containers and skeleton of chart
+ var interactivePointerEvents = (useInteractiveGuideline) ? "none" : "all";
+ 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');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-interactive');
+ gEnter.append('g').attr('class', 'nv-x nv-axis').style("pointer-events","none");
+ gEnter.append('g').attr('class', 'nv-y nv-axis');
+ gEnter.append('g').attr('class', 'nv-background');
+ gEnter.append('g').attr('class', 'nv-linesWrap').style("pointer-events",interactivePointerEvents);
+ gEnter.append('g').attr('class', 'nv-avgLinesWrap').style("pointer-events","none");
+ gEnter.append('g').attr('class', 'nv-legendWrap');
+ gEnter.append('g').attr('class', 'nv-controlsWrap');
+
+ // Legend
+ if (showLegend) {
+ legend.width(availableWidth);
+
+ g.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
+
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
+ g.select('.nv-legendWrap')
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ }
- var linesWrap = g.select('.nv-linesWrap')
- .datum(data.filter(function(d) { return !d.disabled && !d.tempDisabled }));
+ // Controls
+ if (showControls) {
+ var controlsData = [
+ { key: 'Re-scale y-axis', disabled: !rescaleY }
+ ];
+
+ controls
+ .width(140)
+ .color(['#444', '#444', '#444'])
+ .rightAlign(false)
+ .margin({top: 5, right: 0, bottom: 5, left: 20})
+ ;
- //d3.transition(linesWrap).call(lines);
- linesWrap.call(lines);
+ g.select('.nv-controlsWrap')
+ .datum(controlsData)
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ .call(controls);
+ }
- /*Handle average lines [AN-612] ----------------------------*/
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- //Store a series index number in the data array.
- data.forEach(function(d,i) {
- d.seriesIndex = i;
- });
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
- var avgLineData = data.filter(function(d) {
- return !d.disabled && !!average(d);
- });
+ // Show error if series goes below 100%
+ var tempDisabled = data.filter(function(d) { return d.tempDisabled });
- var avgLines = g.select(".nv-avgLinesWrap").selectAll("line")
- .data(avgLineData, function(d) { return d.key; });
-
- var getAvgLineY = function(d) {
- //If average lines go off the svg element, clamp them to the svg bounds.
- var yVal = y(average(d));
- if (yVal < 0) return 0;
- if (yVal > availableHeight) return availableHeight;
- return yVal;
- };
-
- avgLines.enter()
- .append('line')
- .style('stroke-width',2)
- .style('stroke-dasharray','10,10')
- .style('stroke',function (d,i) {
- return lines.color()(d,d.seriesIndex);
- })
- .attr('x1',0)
- .attr('x2',availableWidth)
- .attr('y1', getAvgLineY)
- .attr('y2', getAvgLineY);
-
- avgLines
- .style('stroke-opacity',function(d){
- //If average lines go offscreen, make them transparent
- var yVal = y(average(d));
- if (yVal < 0 || yVal > availableHeight) return 0;
- return 1;
- })
- .attr('x1',0)
- .attr('x2',availableWidth)
- .attr('y1', getAvgLineY)
- .attr('y2', getAvgLineY);
+ wrap.select('.tempDisabled').remove(); //clean-up and prevent duplicates
+ if (tempDisabled.length) {
+ wrap.append('text').attr('class', 'tempDisabled')
+ .attr('x', availableWidth / 2)
+ .attr('y', '-.71em')
+ .style('text-anchor', 'end')
+ .text(tempDisabled.map(function(d) { return d.key }).join(', ') + ' values cannot be calculated for this time period.');
+ }
- avgLines.exit().remove();
+ //Set up interactive layer
+ if (useInteractiveGuideline) {
+ interactiveLayer
+ .width(availableWidth)
+ .height(availableHeight)
+ .margin({left:margin.left,top:margin.top})
+ .svgContainer(container)
+ .xScale(x);
+ wrap.select(".nv-interactive").call(interactiveLayer);
+ }
- //Create index line -----------------------------------------
+ gEnter.select('.nv-background')
+ .append('rect');
- var indexLine = linesWrap.selectAll('.nv-indexLine')
- .data([index]);
- indexLine.enter().append('rect').attr('class', 'nv-indexLine')
- .attr('width', 3)
- .attr('x', -2)
- .attr('fill', 'red')
- .attr('fill-opacity', .5)
- .style("pointer-events","all")
- .call(indexDrag)
+ g.select('.nv-background rect')
+ .attr('width', availableWidth)
+ .attr('height', availableHeight);
- indexLine
- .attr('transform', function(d) { return 'translate(' + dx(d.i) + ',0)' })
- .attr('height', availableHeight)
+ lines
+ //.x(function(d) { return d.x })
+ .y(function(d) { return d.display.y })
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled && !data[i].tempDisabled; }));
- //------------------------------------------------------------
+ var linesWrap = g.select('.nv-linesWrap')
+ .datum(data.filter(function(d) { return !d.disabled && !d.tempDisabled }));
+ linesWrap.call(lines);
- //------------------------------------------------------------
- // Setup Axes
+ //Store a series index number in the data array.
+ data.forEach(function(d,i) {
+ d.seriesIndex = i;
+ });
- if (showXAxis) {
- xAxis
- .scale(x)
- //Suggest how many ticks based on the chart width and D3 should listen (70 is the optimal number for MM/DD/YY dates)
- .ticks( Math.min(data[0].values.length,availableWidth/70) )
- .tickSize(-availableHeight, 0);
+ var avgLineData = data.filter(function(d) {
+ return !d.disabled && !!average(d);
+ });
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y.range()[0] + ')');
- d3.transition(g.select('.nv-x.nv-axis'))
- .call(xAxis);
- }
+ var avgLines = g.select(".nv-avgLinesWrap").selectAll("line")
+ .data(avgLineData, function(d) { return d.key; });
+ var getAvgLineY = function(d) {
+ //If average lines go off the svg element, clamp them to the svg bounds.
+ var yVal = y(average(d));
+ if (yVal < 0) return 0;
+ if (yVal > availableHeight) return availableHeight;
+ return yVal;
+ };
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
+ avgLines.enter()
+ .append('line')
+ .style('stroke-width',2)
+ .style('stroke-dasharray','10,10')
+ .style('stroke',function (d,i) {
+ return lines.color()(d,d.seriesIndex);
+ })
+ .attr('x1',0)
+ .attr('x2',availableWidth)
+ .attr('y1', getAvgLineY)
+ .attr('y2', getAvgLineY);
+
+ avgLines
+ .style('stroke-opacity',function(d){
+ //If average lines go offscreen, make them transparent
+ var yVal = y(average(d));
+ if (yVal < 0 || yVal > availableHeight) return 0;
+ return 1;
+ })
+ .attr('x1',0)
+ .attr('x2',availableWidth)
+ .attr('y1', getAvgLineY)
+ .attr('y2', getAvgLineY);
+
+ avgLines.exit().remove();
+
+ //Create index line
+ var indexLine = linesWrap.selectAll('.nv-indexLine')
+ .data([index]);
+ indexLine.enter().append('rect').attr('class', 'nv-indexLine')
+ .attr('width', 3)
+ .attr('x', -2)
+ .attr('fill', 'red')
+ .attr('fill-opacity', .5)
+ .style("pointer-events","all")
+ .call(indexDrag);
+
+ indexLine
+ .attr('transform', function(d) { return 'translate(' + dx(d.i) + ',0)' })
+ .attr('height', availableHeight);
+
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/70, data) )
+ .tickSize(-availableHeight, 0);
+
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y.range()[0] + ')');
+ g.select('.nv-x.nv-axis')
+ .call(xAxis);
+ }
- d3.transition(g.select('.nv-y.nv-axis'))
- .call(yAxis);
- }
- //------------------------------------------------------------
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
+ g.select('.nv-y.nv-axis')
+ .call(yAxis);
+ }
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
+ function updateZero() {
+ indexLine
+ .data([index]);
- function updateZero() {
- indexLine
- .data([index]);
+ //When dragging the index line, turn off line transitions.
+ // Then turn them back on when done dragging.
+ var oldDuration = chart.duration();
+ chart.duration(0);
+ chart.update();
+ chart.duration(oldDuration);
+ }
- //When dragging the index line, turn off line transitions.
- // Then turn them back on when done dragging.
- var oldDuration = chart.transitionDuration();
- chart.transitionDuration(0);
- chart.update();
- chart.transitionDuration(oldDuration);
- }
+ g.select('.nv-background rect')
+ .on('click', function() {
+ index.x = d3.mouse(this)[0];
+ index.i = Math.round(dx.invert(index.x));
- g.select('.nv-background rect')
- .on('click', function() {
- index.x = d3.mouse(this)[0];
- index.i = Math.round(dx.invert(index.x));
+ // update state and send stateChange with new index
+ state.index = index.i;
+ dispatch.stateChange(state);
- // update state and send stateChange with new index
- state.index = index.i;
- dispatch.stateChange(state);
+ updateZero();
+ });
- updateZero();
- });
+ lines.dispatch.on('elementClick', function(e) {
+ index.i = e.pointIndex;
+ index.x = dx(index.i);
- lines.dispatch.on('elementClick', function(e) {
- index.i = e.pointIndex;
- index.x = dx(index.i);
+ // update state and send stateChange with new index
+ state.index = index.i;
+ dispatch.stateChange(state);
- // update state and send stateChange with new index
- state.index = index.i;
- dispatch.stateChange(state);
+ updateZero();
+ });
- updateZero();
- });
+ controls.dispatch.on('legendClick', function(d,i) {
+ d.disabled = !d.disabled;
+ rescaleY = !d.disabled;
- controls.dispatch.on('legendClick', function(d,i) {
- d.disabled = !d.disabled;
- rescaleY = !d.disabled;
+ state.rescaleY = rescaleY;
+ dispatch.stateChange(state);
+ chart.update();
+ });
- state.rescaleY = rescaleY;
- dispatch.stateChange(state);
- chart.update();
- });
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
+ interactiveLayer.dispatch.on('elementMousemove', function(e) {
+ lines.clearHighlights();
+ var singlePoint, pointIndex, pointXLocation, allData = [];
- legend.dispatch.on('stateChange', function(newState) {
- state.disabled = newState.disabled;
- dispatch.stateChange(state);
- chart.update();
- });
+ data
+ .filter(function(series, i) {
+ series.seriesIndex = i;
+ return !series.disabled;
+ })
+ .forEach(function(series,i) {
+ pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
+ lines.highlightPoint(i, pointIndex, true);
+ var point = series.values[pointIndex];
+ if (typeof point === 'undefined') return;
+ if (typeof singlePoint === 'undefined') singlePoint = point;
+ if (typeof pointXLocation === 'undefined') pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
+ allData.push({
+ key: series.key,
+ value: chart.y()(point, pointIndex),
+ color: color(series,series.seriesIndex)
+ });
+ });
+
+ //Highlight the tooltip entry based on which point the mouse is closest to.
+ if (allData.length > 2) {
+ var yValue = chart.yScale().invert(e.mouseY);
+ var domainExtent = Math.abs(chart.yScale().domain()[0] - chart.yScale().domain()[1]);
+ var threshold = 0.03 * domainExtent;
+ var indexToHighlight = nv.nearestValueIndex(allData.map(function(d){return d.value}),yValue,threshold);
+ if (indexToHighlight !== null)
+ allData[indexToHighlight].highlight = true;
+ }
- interactiveLayer.dispatch.on('elementMousemove', function(e) {
- lines.clearHighlights();
- var singlePoint, pointIndex, pointXLocation, allData = [];
-
-
- data
- .filter(function(series, i) {
- series.seriesIndex = i;
- return !series.disabled;
- })
- .forEach(function(series,i) {
- pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
- lines.highlightPoint(i, pointIndex, true);
- var point = series.values[pointIndex];
- if (typeof point === 'undefined') return;
- if (typeof singlePoint === 'undefined') singlePoint = point;
- if (typeof pointXLocation === 'undefined') pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
- allData.push({
- key: series.key,
- value: chart.y()(point, pointIndex),
- color: color(series,series.seriesIndex)
- });
- });
-
- //Highlight the tooltip entry based on which point the mouse is closest to.
- if (allData.length > 2) {
- var yValue = chart.yScale().invert(e.mouseY);
- var domainExtent = Math.abs(chart.yScale().domain()[0] - chart.yScale().domain()[1]);
- var threshold = 0.03 * domainExtent;
- var indexToHighlight = nv.nearestValueIndex(allData.map(function(d){return d.value}),yValue,threshold);
- if (indexToHighlight !== null)
- allData[indexToHighlight].highlight = true;
- }
-
- var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex), pointIndex);
- interactiveLayer.tooltip
- .position({left: pointXLocation + margin.left, top: e.mouseY + margin.top})
- .chartContainer(that.parentNode)
- .enabled(tooltips)
- .valueFormatter(function(d,i) {
- return yAxis.tickFormat()(d);
- })
- .data(
- {
+ var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex), pointIndex);
+ interactiveLayer.tooltip
+ .chartContainer(that.parentNode)
+ .valueFormatter(function(d,i) {
+ return yAxis.tickFormat()(d);
+ })
+ .data(
+ {
value: xValue,
series: allData
- }
- )();
-
- interactiveLayer.renderGuideLine(pointXLocation);
-
- });
-
- interactiveLayer.dispatch.on("elementMouseout",function(e) {
- dispatch.tooltipHide();
- lines.clearHighlights();
- });
+ }
+ )();
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ interactiveLayer.renderGuideLine(pointXLocation);
+ });
+ interactiveLayer.dispatch.on("elementMouseout",function(e) {
+ lines.clearHighlights();
+ });
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
+ state.disabled = e.disabled;
+ }
- state.disabled = e.disabled;
- }
+ if (typeof e.index !== 'undefined') {
+ index.i = e.index;
+ index.x = dx(index.i);
+ state.index = e.index;
- if (typeof e.index !== 'undefined') {
- index.i = e.index;
- index.x = dx(index.i);
+ indexLine
+ .data([index]);
+ }
- state.index = e.index;
+ if (typeof e.rescaleY !== 'undefined') {
+ rescaleY = e.rescaleY;
+ }
- indexLine
- .data([index]);
- }
+ chart.update();
+ });
+ });
- if (typeof e.rescaleY !== 'undefined') {
- rescaleY = e.rescaleY;
- }
+ renderWatch.renderEnd('cumulativeLineChart immediate');
- chart.update();
- });
+ return chart;
+ }
- //============================================================
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ lines.dispatch.on('elementMouseover.tooltip', function(evt) {
+ var point = {
+ x: chart.x()(evt.point),
+ y: chart.y()(evt.point),
+ color: evt.point.color
+ };
+ evt.point = point;
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- lines.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.lines = lines;
- chart.legend = legend;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
- chart.interactiveLayer = interactiveLayer;
-
- d3.rebind(chart, lines, 'defined', 'isArea', 'x', 'y', 'xScale','yScale', 'size', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi','useVoronoi', 'id');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
+ lines.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ //============================================================
+ // Functions
+ //------------------------------------------------------------
+
+ var indexifyYGetter = null;
+ /* Normalize the data according to an index point. */
+ function indexify(idx, data) {
+ if (!indexifyYGetter) indexifyYGetter = lines.y();
+ return data.map(function(line, i) {
+ if (!line.values) {
+ return line;
+ }
+ var indexValue = line.values[idx];
+ if (indexValue == null) {
+ return line;
+ }
+ var v = indexifyYGetter(indexValue, idx);
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ //TODO: implement check below, and disable series if series loses 100% or more cause divide by 0 issue
+ if (v < -.95 && !noErrorCheck) {
+ //if a series loses more than 100%, calculations fail.. anything close can cause major distortion (but is mathematically correct till it hits 100)
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ line.tempDisabled = true;
+ return line;
+ }
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
+ line.tempDisabled = false;
- chart.rescaleY = function(_) {
- if (!arguments.length) return rescaleY;
- rescaleY = _;
- return chart;
- };
+ line.values = line.values.map(function(point, pointIndex) {
+ point.display = {'y': (indexifyYGetter(point, pointIndex) - v) / (1 + v) };
+ return point;
+ });
- chart.showControls = function(_) {
- if (!arguments.length) return showControls;
- showControls = _;
- return chart;
- };
-
- chart.useInteractiveGuideline = function(_) {
- if(!arguments.length) return useInteractiveGuideline;
- useInteractiveGuideline = _;
- if (_ === true) {
- chart.interactive(false);
- chart.useVoronoi(false);
+ return line;
+ })
}
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
-
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
-
- chart.average = function(_) {
- if(!arguments.length) return average;
- average = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.lines = lines;
+ chart.legend = legend;
+ chart.controls = controls;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.interactiveLayer = interactiveLayer;
+ chart.state = state;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ rescaleY: {get: function(){return rescaleY;}, set: function(_){rescaleY=_;}},
+ showControls: {get: function(){return showControls;}, set: function(_){showControls=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ average: {get: function(){return average;}, set: function(_){average=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ noErrorCheck: {get: function(){return noErrorCheck;}, set: function(_){noErrorCheck=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ }},
+ useInteractiveGuideline: {get: function(){return useInteractiveGuideline;}, set: function(_){
+ useInteractiveGuideline = _;
+ if (_ === true) {
+ chart.interactive(false);
+ chart.useVoronoi(false);
+ }
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( (_) ? 'right' : 'left');
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ lines.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ renderWatch.reset(duration);
+ }}
+ });
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
+ nv.utils.inheritOptions(chart, lines);
+ nv.utils.initOptions(chart);
- chart.noErrorCheck = function(_) {
- if (!arguments.length) return noErrorCheck;
- noErrorCheck = _;
return chart;
- };
-
- //============================================================
-
-
- //============================================================
- // Functions
- //------------------------------------------------------------
-
- /* Normalize the data according to an index point. */
- function indexify(idx, data) {
- return data.map(function(line, i) {
- if (!line.values) {
- return line;
- }
- var indexValue = line.values[idx];
- if (indexValue == null) {
- return line;
- }
- var v = lines.y()(indexValue, idx);
-
- //TODO: implement check below, and disable series if series loses 100% or more cause divide by 0 issue
- if (v < -.95 && !noErrorCheck) {
- //if a series loses more than 100%, calculations fail.. anything close can cause major distortion (but is mathematically correct till it hits 100)
-
- line.tempDisabled = true;
- return line;
- }
-
- line.tempDisabled = false;
-
- line.values = line.values.map(function(point, pointIndex) {
- point.display = {'y': (lines.y()(point, pointIndex) - v) / (1 + v) };
- return point;
- })
-
- return line;
- })
- }
-
- //============================================================
-
-
- return chart;
-}
+};
//TODO: consider deprecating by adding necessary features to multiBar model
nv.models.discreteBar = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
- , x = d3.scale.ordinal()
- , y = d3.scale.linear()
- , 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 = nv.utils.defaultColor()
- , showValues = false
- , valueFormat = d3.format(',.2f')
- , xDomain
- , yDomain
- , xRange
- , yRange
- , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
- , rectClass = 'discreteBar'
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var x0, y0;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 960
+ , height = 500
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container
+ , x = d3.scale.ordinal()
+ , y = d3.scale.linear()
+ , 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 = nv.utils.defaultColor()
+ , showValues = false
+ , valueFormat = d3.format(',.2f')
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
+ , rectClass = 'discreteBar'
+ , duration = 250
+ ;
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- //add series index to each data point for reference
- data.forEach(function(series, i) {
- series.values.forEach(function(point) {
- point.series = i;
- });
- });
+ var x0, y0;
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
- //------------------------------------------------------------
- // Setup Scales
+ container = d3.select(this);
+ nv.utils.initSVG(container);
- // remap and flatten the data for use in calculating the scales' domains
- var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
- data.map(function(d) {
- return d.values.map(function(d,i) {
- return { x: getX(d,i), y: getY(d,i), y0: d.y0 }
- })
+ //add series index to each data point for reference
+ data.forEach(function(series, i) {
+ series.values.forEach(function(point) {
+ point.series = i;
+ });
});
- x .domain(xDomain || d3.merge(seriesData).map(function(d) { return d.x }))
- .rangeBands(xRange || [0, availableWidth], .1);
-
- y .domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return d.y }).concat(forceY)));
-
-
- // If showValues, pad the Y axis range to account for label height
- if (showValues) y.range(yRange || [availableHeight - (y.domain()[0] < 0 ? 12 : 0), y.domain()[1] > 0 ? 12 : 0]);
- else y.range(yRange || [availableHeight, 0]);
-
- //store old scales if they exist
- x0 = x0 || x;
- y0 = y0 || y.copy().range([y(0),y(0)]);
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.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');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-groups');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- //------------------------------------------------------------
-
+ // Setup Scales
+ // remap and flatten the data for use in calculating the scales' domains
+ var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
+ data.map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d,i), y: getY(d,i), y0: d.y0 }
+ })
+ });
+ x .domain(xDomain || d3.merge(seriesData).map(function(d) { return d.x }))
+ .rangeBands(xRange || [0, availableWidth], .1);
+ y .domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return d.y }).concat(forceY)));
+
+ // If showValues, pad the Y axis range to account for label height
+ if (showValues) y.range(yRange || [availableHeight - (y.domain()[0] < 0 ? 12 : 0), y.domain()[1] > 0 ? 12 : 0]);
+ else y.range(yRange || [availableHeight, 0]);
+
+ //store old scales if they exist
+ x0 = x0 || x;
+ y0 = y0 || y.copy().range([y(0),y(0)]);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.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');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-groups');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ //TODO: by definition, the discrete bar should not have multiple groups, will modify/remove later
+ 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)
+ .style('fill-opacity', 1e-6);
+ groups.exit()
+ .watchTransition(renderWatch, 'discreteBar: exit groups')
+ .style('stroke-opacity', 1e-6)
+ .style('fill-opacity', 1e-6)
+ .remove();
+ groups
+ .attr('class', function(d,i) { return 'nv-group nv-series-' + i })
+ .classed('hover', function(d) { return d.hover });
+ groups
+ .watchTransition(renderWatch, 'discreteBar: groups')
+ .style('stroke-opacity', 1)
+ .style('fill-opacity', .75);
+
+ var bars = groups.selectAll('g.nv-bar')
+ .data(function(d) { return d.values });
+ bars.exit().remove();
+
+ var barsEnter = bars.enter().append('g')
+ .attr('transform', function(d,i,j) {
+ return 'translate(' + (x(getX(d,i)) + x.rangeBand() * .05 ) + ', ' + y(0) + ')'
+ })
+ .on('mouseover', function(d,i) { //TODO: figure out why j works above, but not here
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mouseout', function(d,i) {
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mousemove', function(d,i) {
+ dispatch.elementMousemove({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('click', function(d,i) {
+ dispatch.elementClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ })
+ .on('dblclick', function(d,i) {
+ dispatch.elementDblClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ });
- //TODO: by definition, the discrete bar should not have multiple groups, will modify/remove later
- 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)
- .style('fill-opacity', 1e-6);
- groups.exit()
- .transition()
- .style('stroke-opacity', 1e-6)
- .style('fill-opacity', 1e-6)
- .remove();
- groups
- .attr('class', function(d,i) { return 'nv-group nv-series-' + i })
- .classed('hover', function(d) { return d.hover });
- groups
- .transition()
- .style('stroke-opacity', 1)
- .style('fill-opacity', .75);
+ barsEnter.append('rect')
+ .attr('height', 0)
+ .attr('width', x.rangeBand() * .9 / data.length )
+ if (showValues) {
+ barsEnter.append('text')
+ .attr('text-anchor', 'middle')
+ ;
- var bars = groups.selectAll('g.nv-bar')
- .data(function(d) { return d.values });
+ bars.select('text')
+ .text(function(d,i) { return valueFormat(getY(d,i)) })
+ .watchTransition(renderWatch, 'discreteBar: bars text')
+ .attr('x', x.rangeBand() * .9 / 2)
+ .attr('y', function(d,i) { return getY(d,i) < 0 ? y(getY(d,i)) - y(0) + 12 : -4 })
- bars.exit().remove();
+ ;
+ } else {
+ bars.selectAll('text').remove();
+ }
+ bars
+ .attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive' })
+ .style('fill', function(d,i) { return d.color || color(d,i) })
+ .style('stroke', function(d,i) { return d.color || color(d,i) })
+ .select('rect')
+ .attr('class', rectClass)
+ .watchTransition(renderWatch, 'discreteBar: bars rect')
+ .attr('width', x.rangeBand() * .9 / data.length);
+ bars.watchTransition(renderWatch, 'discreteBar: bars')
+ //.delay(function(d,i) { return i * 1200 / data[0].values.length })
+ .attr('transform', function(d,i) {
+ var left = x(getX(d,i)) + x.rangeBand() * .05,
+ top = getY(d,i) < 0 ?
+ y(0) :
+ y(0) - y(getY(d,i)) < 1 ?
+ y(0) - 1 : //make 1 px positive bars show up above y=0
+ y(getY(d,i));
+
+ return 'translate(' + left + ', ' + top + ')'
+ })
+ .select('rect')
+ .attr('height', function(d,i) {
+ return Math.max(Math.abs(y(getY(d,i)) - y((yDomain && yDomain[0]) || 0)) || 1)
+ });
- var barsEnter = bars.enter().append('g')
- .attr('transform', function(d,i,j) {
- return 'translate(' + (x(getX(d,i)) + x.rangeBand() * .05 ) + ', ' + y(0) + ')'
- })
- .on('mouseover', function(d,i) { //TODO: figure out why j works above, but not here
- d3.select(this).classed('hover', true);
- dispatch.elementMouseover({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (d.series + .5) / data.length), y(getY(d,i))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- })
- .on('mouseout', function(d,i) {
- d3.select(this).classed('hover', false);
- dispatch.elementMouseout({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- })
- .on('click', function(d,i) {
- dispatch.elementClick({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (d.series + .5) / data.length), y(getY(d,i))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- d3.event.stopPropagation();
- })
- .on('dblclick', function(d,i) {
- dispatch.elementDblClick({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (d.series + .5) / data.length), y(getY(d,i))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- d3.event.stopPropagation();
- });
-
- barsEnter.append('rect')
- .attr('height', 0)
- .attr('width', x.rangeBand() * .9 / data.length )
-
- if (showValues) {
- barsEnter.append('text')
- .attr('text-anchor', 'middle')
- ;
-
- bars.select('text')
- .text(function(d,i) { return valueFormat(getY(d,i)) })
- .transition()
- .attr('x', x.rangeBand() * .9 / 2)
- .attr('y', function(d,i) { return getY(d,i) < 0 ? y(getY(d,i)) - y(0) + 12 : -4 })
-
- ;
- } else {
- bars.selectAll('text').remove();
- }
-
- bars
- .attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive' })
- .style('fill', function(d,i) { return d.color || color(d,i) })
- .style('stroke', function(d,i) { return d.color || color(d,i) })
- .select('rect')
- .attr('class', rectClass)
- .transition()
- .attr('width', x.rangeBand() * .9 / data.length);
- bars.transition()
- //.delay(function(d,i) { return i * 1200 / data[0].values.length })
- .attr('transform', function(d,i) {
- var left = x(getX(d,i)) + x.rangeBand() * .05,
- top = getY(d,i) < 0 ?
- y(0) :
- y(0) - y(getY(d,i)) < 1 ?
- y(0) - 1 : //make 1 px positive bars show up above y=0
- y(getY(d,i));
- return 'translate(' + left + ', ' + top + ')'
- })
- .select('rect')
- .attr('height', function(d,i) {
- return Math.max(Math.abs(y(getY(d,i)) - y((yDomain && yDomain[0]) || 0)) || 1)
- });
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
+ });
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
+ renderWatch.renderEnd('discreteBar immediate');
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ showValues: {get: function(){return showValues;}, set: function(_){showValues=_;}},
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ valueFormat: {get: function(){return valueFormat;}, set: function(_){valueFormat=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ rectClass: {get: function(){return rectClass;}, set: function(_){rectClass=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ }}
});
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
-
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
-
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
-
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
-
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
-
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
-
- chart.forceY = function(_) {
- if (!arguments.length) return forceY;
- forceY = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
-
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
-
- chart.showValues = function(_) {
- if (!arguments.length) return showValues;
- showValues = _;
- return chart;
- };
-
- chart.valueFormat= function(_) {
- if (!arguments.length) return valueFormat;
- valueFormat = _;
- return chart;
- };
+ nv.utils.initOptions(chart);
- chart.rectClass= function(_) {
- if (!arguments.length) return rectClass;
- rectClass = _;
return chart;
- };
- //============================================================
+};
+nv.models.discreteBarChart = function() {
+ "use strict";
- return chart;
-}
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
-nv.models.discreteBarChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var discretebar = nv.models.discreteBar()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- ;
+ var discretebar = nv.models.discreteBar()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , tooltip = nv.models.tooltip()
+ ;
- var margin = {top: 15, right: 10, bottom: 50, left: 60}
- , width = null
- , height = null
- , color = nv.utils.getColor()
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , staggerLabels = false
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + x + '</h3>' +
- '<p>' + y + '</p>'
- }
- , x
- , y
- , noData = "No Data Available."
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'beforeUpdate')
- , transitionDuration = 250
- ;
+ var margin = {top: 15, right: 10, bottom: 50, left: 60}
+ , width = null
+ , height = null
+ , color = nv.utils.getColor()
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , staggerLabels = false
+ , wrapLabels = false
+ , rotateLabels = 0
+ , x
+ , y
+ , noData = null
+ , dispatch = d3.dispatch('beforeUpdate','renderEnd')
+ , duration = 250
+ ;
- xAxis
- .orient('bottom')
- .highlightZero(false)
- .showMaxMin(false)
- .tickFormat(function(d) { return d })
+ xAxis
+ .orient('bottom')
+ .showMaxMin(false)
+ .tickFormat(function(d) { return d })
;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- .tickFormat(d3.format(',.1f'))
+ yAxis
+ .orient((rightAlignYAxis) ? 'right' : 'left')
+ .tickFormat(d3.format(',.1f'))
;
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(discretebar.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(discretebar.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
- };
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
-
-
- chart.update = function() {
- dispatch.beforeUpdate();
- container.transition().duration(transitionDuration).call(chart);
- };
- chart.container = this;
-
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = discretebar.xScale();
- y = discretebar.yScale().clamp(true);
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-x nv-axis');
- gEnter.append('g').attr('class', 'nv-y nv-axis')
- .append('g').attr('class', 'nv-zeroLine')
- .append('line');
-
- gEnter.append('g').attr('class', 'nv-barsWrap');
-
- g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
-
- //------------------------------------------------------------
+ tooltip
+ .duration(0)
+ .headerEnabled(false)
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ })
+ .keyFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ });
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- //------------------------------------------------------------
- // Main Chart Component(s)
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
- discretebar
- .width(availableWidth)
- .height(availableHeight);
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(discretebar);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- var barsWrap = g.select('.nv-barsWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
+ chart.update = function() {
+ dispatch.beforeUpdate();
+ container.transition().duration(duration).call(chart);
+ };
+ chart.container = this;
+
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container);
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- barsWrap.transition().call(discretebar);
+ // Setup Scales
+ x = discretebar.xScale();
+ y = discretebar.yScale().clamp(true);
- //------------------------------------------------------------
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
+ gEnter.append('g').attr('class', 'nv-x nv-axis');
+ gEnter.append('g').attr('class', 'nv-y nv-axis')
+ .append('g').attr('class', 'nv-zeroLine')
+ .append('line');
+ gEnter.append('g').attr('class', 'nv-barsWrap');
- defsEnter.append('clipPath')
- .attr('id', 'nv-x-label-clip-' + discretebar.id())
- .append('rect');
+ g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- 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 ));
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
+ // Main Chart Component(s)
+ discretebar
+ .width(availableWidth)
+ .height(availableHeight);
- //------------------------------------------------------------
- // Setup Axes
+ var barsWrap = g.select('.nv-barsWrap')
+ .datum(data.filter(function(d) { return !d.disabled }));
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight, 0);
+ barsWrap.transition().call(discretebar);
- 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('.nv-x.nv-axis'))
- g.select('.nv-x.nv-axis').transition()
- .call(xAxis);
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-x-label-clip-' + discretebar.id())
+ .append('rect');
- var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
+ 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 ));
- if (staggerLabels) {
- xTicks
- .selectAll('text')
- .attr('transform', function(d,i,j) { return 'translate(0,' + (j % 2 == 0 ? '5' : '17') + ')' })
- }
- }
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight, 0);
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + (y.range()[0] + ((discretebar.showValues() && y.domain()[0] < 0) ? 16 : 0)) + ')');
+ g.select('.nv-x.nv-axis').call(xAxis);
- g.select('.nv-y.nv-axis').transition()
- .call(yAxis);
- }
+ var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
+ if (staggerLabels) {
+ xTicks
+ .selectAll('text')
+ .attr('transform', function(d,i,j) { return 'translate(0,' + (j % 2 == 0 ? '5' : '17') + ')' })
+ }
- // Zero line
- g.select(".nv-zeroLine line")
- .attr("x1",0)
- .attr("x2",availableWidth)
- .attr("y1", y(0))
- .attr("y2", y(0))
- ;
+ if (rotateLabels) {
+ xTicks
+ .selectAll('.tick text')
+ .attr('transform', 'rotate(' + rotateLabels + ' 0,0)')
+ .style('text-anchor', rotateLabels > 0 ? 'start' : 'end');
+ }
- //------------------------------------------------------------
+ if (wrapLabels) {
+ g.selectAll('.tick text')
+ .call(nv.utils.wrapTicks, chart.xAxis.rangeBand())
+ }
+ }
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ g.select('.nv-y.nv-axis').call(yAxis);
+ }
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ // Zero line
+ g.select(".nv-zeroLine line")
+ .attr("x1",0)
+ .attr("x2",availableWidth)
+ .attr("y1", y(0))
+ .attr("y2", y(0))
+ ;
+ });
- //============================================================
+ renderWatch.renderEnd('discreteBar chart immediate');
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ discretebar.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt['series'] = {
+ key: chart.x()(evt.data),
+ value: chart.y()(evt.data),
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- discretebar.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- discretebar.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.discretebar = discretebar;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
-
- d3.rebind(chart, discretebar, 'x', 'y', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'id', 'showValues', 'valueFormat');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- discretebar.color(color);
- return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
-
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.staggerLabels = function(_) {
- if (!arguments.length) return staggerLabels;
- staggerLabels = _;
- return chart;
- };
+ discretebar.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ discretebar.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.discretebar = discretebar;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ staggerLabels: {get: function(){return staggerLabels;}, set: function(_){staggerLabels=_;}},
+ rotateLabels: {get: function(){return rotateLabels;}, set: function(_){rotateLabels=_;}},
+ wrapLabels: {get: function(){return wrapLabels;}, set: function(_){wrapLabels=!!_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ discretebar.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ discretebar.color(color);
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( (_) ? 'right' : 'left');
+ }}
+ });
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ nv.utils.inheritOptions(chart, discretebar);
+ nv.utils.initOptions(chart);
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
return chart;
- };
-
- //============================================================
-
-
- return chart;
}
nv.models.distribution = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 400 //technically width or height depending on x or y....
- , size = 8
- , axis = 'x' // 'x' or 'y'... horizontal or vertical
- , getData = function(d) { return d[axis] } // defaults d.x or d.y
- , color = nv.utils.defaultColor()
- , scale = d3.scale.linear()
- , domain
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var scale0;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableLength = width - (axis === 'x' ? margin.left + margin.right : margin.top + margin.bottom),
- naxis = axis == 'x' ? 'y' : 'x',
- container = d3.select(this);
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- scale0 = scale0 || scale;
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ "use strict";
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 400 //technically width or height depending on x or y....
+ , size = 8
+ , axis = 'x' // 'x' or 'y'... horizontal or vertical
+ , getData = function(d) { return d[axis] } // defaults d.x or d.y
+ , color = nv.utils.defaultColor()
+ , scale = d3.scale.linear()
+ , domain
+ , duration = 250
+ , dispatch = d3.dispatch('renderEnd')
+ ;
- var wrap = container.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 + ')')
- //------------------------------------------------------------
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ var scale0;
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
- 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 'nv-dist nv-series-' + i })
- .style('stroke', function(d,i) { return color(d, i) });
- 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)) })
- distWrap.exit().selectAll('line.nv-dist' + axis)
- .transition()
- .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
- .attr('class', function(d,i) { return 'nv-dist' + axis + ' nv-dist' + axis + '-' + i })
- .attr(naxis + '1', 0)
- .attr(naxis + '2', size);
- dist
- .transition()
- .attr(axis + '1', function(d,i) { return scale(getData(d,i)) })
- .attr(axis + '2', function(d,i) { return scale(getData(d,i)) })
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var availableLength = width - (axis === 'x' ? margin.left + margin.right : margin.top + margin.bottom),
+ naxis = axis == 'x' ? 'y' : 'x',
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+ //------------------------------------------------------------
+ // Setup Scales
- scale0 = scale.copy();
+ scale0 = scale0 || scale;
- });
+ //------------------------------------------------------------
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
- chart.axis = function(_) {
- if (!arguments.length) return axis;
- axis = _;
- return chart;
- };
+ //------------------------------------------------------------
+ // Setup containers and skeleton of chart
- chart.size = function(_) {
- if (!arguments.length) return size;
- size = _;
- return chart;
- };
+ var wrap = container.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');
- chart.getData = function(_) {
- if (!arguments.length) return getData;
- getData = d3.functor(_);
- return chart;
- };
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
- chart.scale = function(_) {
- if (!arguments.length) return scale;
- scale = _;
- return chart;
- };
+ //------------------------------------------------------------
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
- //============================================================
+ var distWrap = g.selectAll('g.nv-dist')
+ .data(function(d) { return d }, function(d) { return d.key });
- return chart;
-}
+ distWrap.enter().append('g');
+ distWrap
+ .attr('class', function(d,i) { return 'nv-dist nv-series-' + i })
+ .style('stroke', function(d,i) { return color(d, i) });
-nv.models.historicalBarChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
+ 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)) })
+ renderWatch.transition(distWrap.exit().selectAll('line.nv-dist' + axis), 'dist exit')
+ // .transition()
+ .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
+ .attr('class', function(d,i) { return 'nv-dist' + axis + ' nv-dist' + axis + '-' + i })
+ .attr(naxis + '1', 0)
+ .attr(naxis + '2', size);
+ renderWatch.transition(dist, 'dist')
+ // .transition()
+ .attr(axis + '1', function(d,i) { return scale(getData(d,i)) })
+ .attr(axis + '2', function(d,i) { return scale(getData(d,i)) })
- var bars = nv.models.historicalBar()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- ;
+ scale0 = scale.copy();
- var margin = {top: 30, right: 90, bottom: 50, left: 90}
- , color = nv.utils.defaultColor()
- , width = null
- , height = null
- , showLegend = false
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>'
- }
- , x
- , y
- , state = {}
- , defaultState = null
- , noData = 'No Data Available.'
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , transitionDuration = 250
- ;
-
- xAxis
- .orient('bottom')
- .tickPadding(7)
- ;
- yAxis
- .orient( (rightAlignYAxis) ? 'right' : 'left')
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
-
- // New addition to calculate position if SVG is scaled with viewBox, may move TODO: consider implementing everywhere else
- if (offsetElement) {
- var svg = d3.select(offsetElement).select('svg');
- var viewBox = (svg.node()) ? svg.attr('viewBox') : null;
- if (viewBox) {
- viewBox = viewBox.split(' ');
- var ratio = parseInt(svg.style('width')) / viewBox[2];
- e.pos[0] = e.pos[0] * ratio;
- e.pos[1] = e.pos[1] * ratio;
- }
+ });
+ renderWatch.renderEnd('distribution immediate');
+ return chart;
}
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(bars.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(bars.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, null, null, offsetElement);
- };
-
- //============================================================
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+ chart.options = nv.utils.optionsFunc.bind(chart);
+ chart.dispatch = dispatch;
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
-
-
- chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
- chart.container = this;
-
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ chart.margin = function(_) {
+ if (!arguments.length) return margin;
+ margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
+ margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
+ margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
+ margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
+ return chart;
+ };
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
+ chart.width = function(_) {
+ if (!arguments.length) return width;
+ width = _;
+ return chart;
+ };
- //------------------------------------------------------------
- // Display noData message if there's nothing to show.
+ chart.axis = function(_) {
+ if (!arguments.length) return axis;
+ axis = _;
+ return chart;
+ };
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
+ chart.size = function(_) {
+ if (!arguments.length) return size;
+ size = _;
+ return chart;
+ };
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
+ chart.getData = function(_) {
+ if (!arguments.length) return getData;
+ getData = d3.functor(_);
+ return chart;
+ };
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
+ chart.scale = function(_) {
+ if (!arguments.length) return scale;
+ scale = _;
+ return chart;
+ };
+ chart.color = function(_) {
+ if (!arguments.length) return color;
+ color = nv.utils.getColor(_);
return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
+ };
- //------------------------------------------------------------
+ chart.duration = function(_) {
+ if (!arguments.length) return duration;
+ duration = _;
+ renderWatch.reset(duration);
+ return chart;
+ };
+ //============================================================
- //------------------------------------------------------------
- // Setup Scales
+ return chart;
+}
+nv.models.furiousLegend = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 5, right: 0, bottom: 5, left: 0}
+ , width = 400
+ , height = 20
+ , getKey = function(d) { return d.key }
+ , color = nv.utils.getColor()
+ , maxKeyLength = 20 //default value for key lengths
+ , align = true
+ , padding = 28 //define how much space between legend items. - recommend 32 for furious version
+ , rightAlign = true
+ , updateState = true //If true, legend will update data.disabled and trigger a 'stateChange' dispatch.
+ , radioButtonMode = false //If true, clicking legend items will cause it to behave like a radio button. (only one can be selected at a time)
+ , expanded = false
+ , dispatch = d3.dispatch('legendClick', 'legendDblclick', 'legendMouseover', 'legendMouseout', 'stateChange')
+ , vers = 'classic' //Options are "classic" and "furious"
+ ;
- x = bars.xScale();
- y = bars.yScale();
+ function chart(selection) {
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ container = d3.select(this);
+ nv.utils.initSVG(container);
- //------------------------------------------------------------
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-legend').data([data]);
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-legend').append('g');
+ var g = wrap.select('g');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ var series = g.selectAll('.nv-series')
+ .data(function(d) {
+ if(vers != 'furious') return d;
- var wrap = container.selectAll('g.nv-wrap.nv-historicalBarChart').data([data]);
- var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-historicalBarChart').append('g');
- var g = wrap.select('g');
+ return d.filter(function(n) {
+ return expanded ? true : !n.disengaged;
+ });
+ });
+ var seriesEnter = series.enter().append('g').attr('class', 'nv-series')
- 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');
+ var seriesShape;
- //------------------------------------------------------------
+ if(vers == 'classic') {
+ seriesEnter.append('circle')
+ .style('stroke-width', 2)
+ .attr('class','nv-legend-symbol')
+ .attr('r', 5);
+ seriesShape = series.select('circle');
+ } else if (vers == 'furious') {
+ seriesEnter.append('rect')
+ .style('stroke-width', 2)
+ .attr('class','nv-legend-symbol')
+ .attr('rx', 3)
+ .attr('ry', 3);
- //------------------------------------------------------------
- // Legend
+ seriesShape = series.select('rect');
- if (showLegend) {
- legend.width(availableWidth);
+ seriesEnter.append('g')
+ .attr('class', 'nv-check-box')
+ .property('innerHTML','<path d="M0.5,5 L22.5,5 L22.5,26.5 L0.5,26.5 L0.5,5 Z" class="nv-box"></path><path d="M5.5,12.8618467 L11.9185089,19.2803556 L31,0.198864511" class="nv-check"></path>')
+ .attr('transform', 'translate(-10,-8)scale(0.5)');
- g.select('.nv-legendWrap')
- .datum(data)
- .call(legend);
+ var seriesCheckbox = series.select('.nv-check-box');
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
- }
+ seriesCheckbox.each(function(d,i) {
+ d3.select(this).selectAll('path')
+ .attr('stroke', setTextColor(d,i));
+ });
+ }
- wrap.select('.nv-legendWrap')
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- }
+ seriesEnter.append('text')
+ .attr('text-anchor', 'start')
+ .attr('class','nv-legend-text')
+ .attr('dy', '.32em')
+ .attr('dx', '8');
- //------------------------------------------------------------
+ var seriesText = series.select('text.nv-legend-text');
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ series
+ .on('mouseover', function(d,i) {
+ dispatch.legendMouseover(d,i); //TODO: Make consistent with other event objects
+ })
+ .on('mouseout', function(d,i) {
+ dispatch.legendMouseout(d,i);
+ })
+ .on('click', function(d,i) {
+ dispatch.legendClick(d,i);
+ // make sure we re-get data in case it was modified
+ var data = series.data();
+ if (updateState) {
+ if(vers =='classic') {
+ if (radioButtonMode) {
+ //Radio button mode: set every series to disabled,
+ // and enable the clicked series.
+ data.forEach(function(series) { series.disabled = true});
+ d.disabled = false;
+ }
+ else {
+ d.disabled = !d.disabled;
+ if (data.every(function(series) { return series.disabled})) {
+ //the default behavior of NVD3 legends is, if every single series
+ // is disabled, turn all series' back on.
+ data.forEach(function(series) { series.disabled = false});
+ }
+ }
+ } else if(vers == 'furious') {
+ if(expanded) {
+ d.disengaged = !d.disengaged;
+ d.userDisabled = d.userDisabled == undefined ? !!d.disabled : d.userDisabled;
+ d.disabled = d.disengaged || d.userDisabled;
+ } else if (!expanded) {
+ d.disabled = !d.disabled;
+ d.userDisabled = d.disabled;
+ var engaged = data.filter(function(d) { return !d.disengaged; });
+ if (engaged.every(function(series) { return series.userDisabled })) {
+ //the default behavior of NVD3 legends is, if every single series
+ // is disabled, turn all series' back on.
+ data.forEach(function(series) {
+ series.disabled = series.userDisabled = false;
+ });
+ }
+ }
+ }
+ dispatch.stateChange({
+ disabled: data.map(function(d) { return !!d.disabled }),
+ disengaged: data.map(function(d) { return !!d.disengaged })
+ });
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
+ }
+ })
+ .on('dblclick', function(d,i) {
+ if(vers == 'furious' && expanded) return;
+ dispatch.legendDblclick(d,i);
+ if (updateState) {
+ // make sure we re-get data in case it was modified
+ var data = series.data();
+ //the default behavior of NVD3 legends, when double clicking one,
+ // is to set all other series' to false, and make the double clicked series enabled.
+ data.forEach(function(series) {
+ series.disabled = true;
+ if(vers == 'furious') series.userDisabled = series.disabled;
+ });
+ d.disabled = false;
+ if(vers == 'furious') d.userDisabled = d.disabled;
+ dispatch.stateChange({
+ disabled: data.map(function(d) { return !!d.disabled })
+ });
+ }
+ });
+ series.classed('nv-disabled', function(d) { return d.userDisabled });
+ series.exit().remove();
- //------------------------------------------------------------
- // Main Chart Component(s)
+ seriesText
+ .attr('fill', setTextColor)
+ .text(getKey);
- bars
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
+ //TODO: implement fixed-width and max-width options (max-width is especially useful with the align option)
+ // NEW ALIGNING CODE, TODO: clean up
+ var versPadding;
+ switch(vers) {
+ case 'furious' :
+ versPadding = 23;
+ break;
+ case 'classic' :
+ versPadding = 20;
+ }
- var barsWrap = g.select('.nv-barsWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
+ if (align) {
- barsWrap.transition().call(bars);
+ var seriesWidths = [];
+ series.each(function(d,i) {
+ var legendText;
+ if (getKey(d).length > maxKeyLength) {
+ var trimmedKey = getKey(d).substring(0, maxKeyLength);
+ legendText = d3.select(this).select('text').text(trimmedKey + "...");
+ d3.select(this).append("svg:title").text(getKey(d));
+ } else {
+ legendText = d3.select(this).select('text');
+ }
+ var nodeTextLength;
+ try {
+ nodeTextLength = legendText.node().getComputedTextLength();
+ // If the legendText is display:none'd (nodeTextLength == 0), simulate an error so we approximate, instead
+ if(nodeTextLength <= 0) throw Error();
+ }
+ catch(e) {
+ nodeTextLength = nv.utils.calcApproxTextWidth(legendText);
+ }
- //------------------------------------------------------------
+ seriesWidths.push(nodeTextLength + padding);
+ });
+ var seriesPerRow = 0;
+ var legendWidth = 0;
+ var columnWidths = [];
- //------------------------------------------------------------
- // Setup Axes
+ while ( legendWidth < availableWidth && seriesPerRow < seriesWidths.length) {
+ columnWidths[seriesPerRow] = seriesWidths[seriesPerRow];
+ legendWidth += seriesWidths[seriesPerRow++];
+ }
+ if (seriesPerRow === 0) seriesPerRow = 1; //minimum of one series per row
- if (showXAxis) {
- xAxis
- .scale(x)
- .tickSize(-availableHeight, 0);
+ while ( legendWidth > availableWidth && seriesPerRow > 1 ) {
+ columnWidths = [];
+ seriesPerRow--;
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y.range()[0] + ')');
- g.select('.nv-x.nv-axis')
- .transition()
- .call(xAxis);
- }
+ for (var k = 0; k < seriesWidths.length; k++) {
+ if (seriesWidths[k] > (columnWidths[k % seriesPerRow] || 0) )
+ columnWidths[k % seriesPerRow] = seriesWidths[k];
+ }
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
+ legendWidth = columnWidths.reduce(function(prev, cur, index, array) {
+ return prev + cur;
+ });
+ }
- g.select('.nv-y.nv-axis')
- .transition()
- .call(yAxis);
- }
- //------------------------------------------------------------
+ var xPositions = [];
+ for (var i = 0, curX = 0; i < seriesPerRow; i++) {
+ xPositions[i] = curX;
+ curX += columnWidths[i];
+ }
+ series
+ .attr('transform', function(d, i) {
+ return 'translate(' + xPositions[i % seriesPerRow] + ',' + (5 + Math.floor(i / seriesPerRow) * versPadding) + ')';
+ });
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ //position legend as far right as possible within the total width
+ if (rightAlign) {
+ g.attr('transform', 'translate(' + (width - margin.right - legendWidth) + ',' + margin.top + ')');
+ }
+ else {
+ g.attr('transform', 'translate(0' + ',' + margin.top + ')');
+ }
- legend.dispatch.on('legendClick', function(d,i) {
- d.disabled = !d.disabled;
+ height = margin.top + margin.bottom + (Math.ceil(seriesWidths.length / seriesPerRow) * versPadding);
- if (!data.filter(function(d) { return !d.disabled }).length) {
- data.map(function(d) {
- d.disabled = false;
- wrap.selectAll('.nv-series').classed('disabled', false);
- return d;
- });
- }
+ } else {
- state.disabled = data.map(function(d) { return !!d.disabled });
- dispatch.stateChange(state);
+ var ypos = 5,
+ newxpos = 5,
+ maxwidth = 0,
+ xpos;
+ series
+ .attr('transform', function(d, i) {
+ var length = d3.select(this).select('text').node().getComputedTextLength() + padding;
+ xpos = newxpos;
- selection.transition().call(chart);
- });
+ if (width < margin.left + margin.right + xpos + length) {
+ newxpos = xpos = 5;
+ ypos += versPadding;
+ }
- legend.dispatch.on('legendDblclick', function(d) {
- //Double clicking should always enable current series, and disabled all others.
- data.forEach(function(d) {
- d.disabled = true;
- });
- d.disabled = false;
+ newxpos += length;
+ if (newxpos > maxwidth) maxwidth = newxpos;
- state.disabled = data.map(function(d) { return !!d.disabled });
- dispatch.stateChange(state);
- chart.update();
- });
+ return 'translate(' + xpos + ',' + ypos + ')';
+ });
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ //position legend as far right as possible within the total width
+ g.attr('transform', 'translate(' + (width - margin.right - maxwidth) + ',' + margin.top + ')');
+ height = margin.top + margin.bottom + ypos + 15;
+ }
- dispatch.on('changeState', function(e) {
+ if(vers == 'furious') {
+ // Size rectangles after text is placed
+ seriesShape
+ .attr('width', function(d,i) {
+ return seriesText[0][i].getComputedTextLength() + 27;
+ })
+ .attr('height', 18)
+ .attr('y', -9)
+ .attr('x', -15)
+ }
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
+ seriesShape
+ .style('fill', setBGColor)
+ .style('stroke', function(d,i) { return d.color || color(d, i) });
+ });
- state.disabled = e.disabled;
+ function setTextColor(d,i) {
+ if(vers != 'furious') return '#000';
+ if(expanded) {
+ return d.disengaged ? color(d,i) : '#fff';
+ } else if (!expanded) {
+ return !!d.disabled ? color(d,i) : '#fff';
+ }
}
- chart.update();
- });
+ function setBGColor(d,i) {
+ if(expanded && vers == 'furious') {
+ return d.disengaged ? '#fff' : color(d,i);
+ } else {
+ return !!d.disabled ? '#fff' : color(d,i);
+ }
+ }
- //============================================================
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ key: {get: function(){return getKey;}, set: function(_){getKey=_;}},
+ align: {get: function(){return align;}, set: function(_){align=_;}},
+ rightAlign: {get: function(){return rightAlign;}, set: function(_){rightAlign=_;}},
+ maxKeyLength: {get: function(){return maxKeyLength;}, set: function(_){maxKeyLength=_;}},
+ padding: {get: function(){return padding;}, set: function(_){padding=_;}},
+ updateState: {get: function(){return updateState;}, set: function(_){updateState=_;}},
+ radioButtonMode: {get: function(){return radioButtonMode;}, set: function(_){radioButtonMode=_;}},
+ expanded: {get: function(){return expanded;}, set: function(_){expanded=_;}},
+ vers: {get: function(){return vers;}, set: function(_){vers=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
});
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- bars.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- bars.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.bars = bars;
- chart.legend = legend;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
-
- d3.rebind(chart, bars, 'defined', 'isArea', 'x', 'y', 'size', 'xScale', 'yScale',
- 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi', 'id', 'interpolate','highlightPoint','clearHighlights', 'interactive');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
+ nv.utils.initOptions(chart);
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
-
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
-
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
-
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
-nv.models.indentedTree = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0} //TODO: implement, maybe as margin on the containing div
- , width = 960
- , height = 500
- , color = nv.utils.defaultColor()
- , id = Math.floor(Math.random() * 10000)
- , header = true
- , filterZero = false
- , noData = "No Data Available."
- , childIndent = 20
- , columns = [{key:'key', label: 'Name', type:'text'}] //TODO: consider functions like chart.addColumn, chart.removeColumn, instead of a block like this
- , tableClass = null
- , iconOpen = 'images/grey-plus.png' //TODO: consider removing this and replacing with a '+' or '-' unless user defines images
- , iconClose = 'images/grey-minus.png'
- , dispatch = d3.dispatch('elementClick', 'elementDblclick', 'elementMouseover', 'elementMouseout')
- , getUrl = function(d) { return d.url }
- ;
-
- //============================================================
-
- var idx = 0;
-
- function chart(selection) {
- selection.each(function(data) {
- var depth = 1,
- container = d3.select(this);
-
- var tree = d3.layout.tree()
- .children(function(d) { return d.values })
- .size([height, childIndent]); //Not sure if this is needed now that the result is HTML
-
- chart.update = function() { container.transition().duration(600).call(chart) };
-
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
- if (!data[0]) data[0] = {key: noData};
-
- //------------------------------------------------------------
+};
+//TODO: consider deprecating and using multibar with single series for this
+nv.models.historicalBar = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = null
+ , height = null
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container = null
+ , x = d3.scale.linear()
+ , y = d3.scale.linear()
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , forceX = []
+ , forceY = [0]
+ , padData = false
+ , clipEdge = true
+ , color = nv.utils.defaultColor()
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
+ , interactive = true
+ ;
+ var renderWatch = nv.utils.renderWatch(dispatch, 0);
- var nodes = tree.nodes(data[0]);
+ function chart(selection) {
+ selection.each(function(data) {
+ renderWatch.reset();
- // nodes.map(function(d) {
- // d.id = i++;
- // })
+ container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ nv.utils.initSVG(container);
- var wrap = d3.select(this).selectAll('div').data([[nodes]]);
- 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);
+ // Setup Scales
+ x.domain(xDomain || d3.extent(data[0].values.map(getX).concat(forceX) ));
- //------------------------------------------------------------
+ if (padData)
+ x.range(xRange || [availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
+ else
+ x.range(xRange || [0, availableWidth]);
+
+ y.domain(yDomain || d3.extent(data[0].values.map(getY).concat(forceY) ))
+ .range(yRange || [availableHeight, 0]);
+
+ // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
+ if (x.domain()[0] === x.domain()[1])
+ x.domain()[0] ?
+ x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
+ : x.domain([-1,1]);
+
+ 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])
+ : y.domain([-1,1]);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-historicalBar-' + id).data([data[0].values]);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-historicalBar-' + id);
+ var defsEnter = wrapEnter.append('defs');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-bars');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ container
+ .on('click', function(d,i) {
+ dispatch.chartClick({
+ data: d,
+ index: i,
+ pos: d3.event,
+ id: id
+ });
+ });
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-chart-clip-path-' + id)
+ .append('rect');
+
+ wrap.select('#nv-chart-clip-path-' + id + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', availableHeight);
+
+ g.attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
+
+ var bars = wrap.select('.nv-bars').selectAll('.nv-bar')
+ .data(function(d) { return d }, function(d,i) {return getX(d,i)});
+ bars.exit().remove();
+
+ bars.enter().append('rect')
+ .attr('x', 0 )
+ .attr('y', function(d,i) { return nv.utils.NaNtoZero(y(Math.max(0, getY(d,i)))) })
+ .attr('height', function(d,i) { return nv.utils.NaNtoZero(Math.abs(y(getY(d,i)) - y(0))) })
+ .attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - availableWidth / data[0].values.length * .45) + ',0)'; })
+ .on('mouseover', function(d,i) {
+ if (!interactive) return;
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
- if (header) {
- var thead = tableEnter.append('thead');
+ })
+ .on('mouseout', function(d,i) {
+ if (!interactive) return;
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mousemove', function(d,i) {
+ if (!interactive) return;
+ dispatch.elementMousemove({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('click', function(d,i) {
+ if (!interactive) return;
+ dispatch.elementClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ })
+ .on('dblclick', function(d,i) {
+ if (!interactive) return;
+ dispatch.elementDblClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ });
- var theadRow1 = thead.append('tr');
+ bars
+ .attr('fill', function(d,i) { return color(d, i); })
+ .attr('class', function(d,i,j) { return (getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive') + ' nv-bar-' + j + '-' + i })
+ .watchTransition(renderWatch, 'bars')
+ .attr('transform', function(d,i) { return 'translate(' + (x(getX(d,i)) - availableWidth / data[0].values.length * .45) + ',0)'; })
+ //TODO: better width calculations that don't assume always uniform data spacing;w
+ .attr('width', (availableWidth / data[0].values.length) * .9 );
+
+ bars.watchTransition(renderWatch, 'bars')
+ .attr('y', function(d,i) {
+ var rval = getY(d,i) < 0 ?
+ y(0) :
+ y(0) - y(getY(d,i)) < 1 ?
+ y(0) - 1 :
+ y(getY(d,i));
+ return nv.utils.NaNtoZero(rval);
+ })
+ .attr('height', function(d,i) { return nv.utils.NaNtoZero(Math.max(Math.abs(y(getY(d,i)) - y(0)),1)) });
- columns.forEach(function(column) {
- theadRow1
- .append('th')
- .attr('width', column.width ? column.width : '10%')
- .style('text-align', column.type == 'numeric' ? 'right' : 'left')
- .append('span')
- .text(column.label);
});
- }
-
-
- var tbody = table.selectAll('tbody')
- .data(function(d) { return d });
- tbody.enter().append('tbody');
-
-
- //compute max generations
- depth = d3.max(nodes, function(node) { return node.depth });
- tree.size([height, depth * childIndent]); //TODO: see if this is necessary at all
-
-
- // Update the nodes…
- var node = tbody.selectAll('tr')
- // .data(function(d) { return d; }, function(d) { return d.id || (d.id == ++i)});
- .data(function(d) { return d.filter(function(d) { return (filterZero && !d.children) ? filterZero(d) : true; } )}, function(d,i) { return d.id || (d.id || ++idx)});
- //.style('display', 'table-row'); //TODO: see if this does anything
-
- node.exit().remove();
-
- node.select('img.nv-treeicon')
- .attr('src', icon)
- .classed('folded', folded);
+ renderWatch.renderEnd('historicalBar immediate');
+ return chart;
+ }
- var nodeEnter = node.enter().append('tr');
+ //Create methods to allow outside functions to highlight a specific bar.
+ chart.highlightPoint = function(pointIndex, isHoverOver) {
+ container
+ .select(".nv-bars .nv-bar-0-" + pointIndex)
+ .classed("hover", isHoverOver)
+ ;
+ };
+ chart.clearHighlights = function() {
+ container
+ .select(".nv-bars .nv-bar.hover")
+ .classed("hover", false)
+ ;
+ };
- columns.forEach(function(column, index) {
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ forceX: {get: function(){return forceX;}, set: function(_){forceX=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ padData: {get: function(){return padData;}, set: function(_){padData=_;}},
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ interactive: {get: function(){return interactive;}, set: function(_){interactive=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
+ });
- var nodeName = nodeEnter.append('td')
- .style('padding-left', function(d) { return (index ? 0 : d.depth * childIndent + 12 + (icon(d) ? 0 : 16)) + 'px' }, 'important') //TODO: check why I did the ternary here
- .style('text-align', column.type == 'numeric' ? 'right' : 'left');
+ nv.utils.initOptions(chart);
+ return chart;
+};
- if (index == 0) {
- nodeName.append('img')
- .classed('nv-treeicon', true)
- .classed('nv-folded', folded)
- .attr('src', icon)
- .style('width', '14px')
- .style('height', '14px')
- .style('padding', '0 1px')
- .style('display', function(d) { return icon(d) ? 'inline-block' : 'none'; })
- .on('click', click);
- }
+nv.models.historicalBarChart = function(bar_model) {
+ "use strict";
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
- nodeName.each(function(d) {
- if (!index && getUrl(d))
- d3.select(this)
- .append('a')
- .attr('href',getUrl)
- .attr('class', d3.functor(column.classes))
- .append('span')
- else
- d3.select(this)
- .append('span')
-
- d3.select(this).select('span')
- .attr('class', d3.functor(column.classes) )
- .text(function(d) { return column.format ? (d[column.key] ? column.format(d[column.key]) : '-') : (d[column.key] || '-'); });
- });
-
- if (column.showCount) {
- nodeName.append('span')
- .attr('class', 'nv-childrenCount');
-
- node.selectAll('span.nv-childrenCount').text(function(d) {
- return ((d.values && d.values.length) || (d._values && d._values.length)) ? //If this is a parent
- '(' + ((d.values && (d.values.filter(function(d) { return filterZero ? filterZero(d) : true; }).length)) //If children are in values check its children and filter
- || (d._values && d._values.filter(function(d) { return filterZero ? filterZero(d) : true; }).length) //Otherwise, do the same, but with the other name, _values...
- || 0) + ')' //This is the catch-all in case there are no children after a filter
- : '' //If this is not a parent, just give an empty string
- });
- }
+ var bars = bar_model || nv.models.historicalBar()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend()
+ , interactiveLayer = nv.interactiveGuideline()
+ , tooltip = nv.models.tooltip()
+ ;
- // if (column.click)
- // nodeName.select('span').on('click', column.click);
- });
+ var margin = {top: 30, right: 90, bottom: 50, left: 90}
+ , color = nv.utils.defaultColor()
+ , width = null
+ , height = null
+ , showLegend = false
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , useInteractiveGuideline = false
+ , x
+ , y
+ , state = {}
+ , defaultState = null
+ , noData = null
+ , dispatch = d3.dispatch('tooltipHide', 'stateChange', 'changeState', 'renderEnd')
+ , transitionDuration = 250
+ ;
- node
- .order()
- .on('click', function(d) {
- dispatch.elementClick({
- row: this, //TODO: decide whether or not this should be consistent with scatter/line events or should be an html link (a href)
- data: d,
- pos: [d.x, d.y]
- });
- })
- .on('dblclick', function(d) {
- dispatch.elementDblclick({
- row: this,
- data: d,
- pos: [d.x, d.y]
- });
- })
- .on('mouseover', function(d) {
- dispatch.elementMouseover({
- row: this,
- data: d,
- pos: [d.x, d.y]
- });
+ xAxis.orient('bottom').tickPadding(7);
+ yAxis.orient( (rightAlignYAxis) ? 'right' : 'left');
+ tooltip
+ .duration(0)
+ .headerEnabled(false)
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
})
- .on('mouseout', function(d) {
- dispatch.elementMouseout({
- row: this,
- data: d,
- pos: [d.x, d.y]
- });
+ .headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
});
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ var renderWatch = nv.utils.renderWatch(dispatch, 0);
- // Toggle children on click.
- function click(d, _, unshift) {
- d3.event.stopPropagation();
+ function chart(selection) {
+ selection.each(function(data) {
+ renderWatch.reset();
+ renderWatch.models(bars);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
- if(d3.event.shiftKey && !unshift) {
- //If you shift-click, it'll toggle fold all the children, instead of itself
- d3.event.shiftKey = false;
- d.values && d.values.forEach(function(node){
- if (node.values || node._values) {
- click(node, 0, true);
- }
- });
- return true;
- }
- if(!hasChildren(d)) {
- //download file
- //window.location.href = d.url;
- return true;
- }
- if (d.values) {
- d._values = d.values;
- d.values = null;
- } else {
- d.values = d._values;
- d._values = null;
- }
- chart.update();
- }
-
-
- function icon(d) {
- return (d._values && d._values.length) ? iconOpen : (d.values && d.values.length) ? iconClose : '';
- }
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- function folded(d) {
- return (d._values && d._values.length);
- }
+ chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
+ chart.container = this;
- function hasChildren(d) {
- var values = d.values || d._values;
+ //set state.disabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
- return (values && values.length);
- }
-
-
- });
-
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ // Display noData message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ // Setup Scales
+ x = bars.xScale();
+ y = bars.yScale();
+
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-historicalBarChart').data([data]);
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-historicalBarChart').append('g');
+ var g = wrap.select('g');
+
+ 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-interactive');
+
+ // Legend
+ if (showLegend) {
+ legend.width(availableWidth);
+
+ g.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
+
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- scatter.color(color);
- return chart;
- };
+ wrap.select('.nv-legendWrap')
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ }
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
- chart.header = function(_) {
- if (!arguments.length) return header;
- header = _;
- return chart;
- };
+ //Set up interactive layer
+ if (useInteractiveGuideline) {
+ interactiveLayer
+ .width(availableWidth)
+ .height(availableHeight)
+ .margin({left:margin.left, top:margin.top})
+ .svgContainer(container)
+ .xScale(x);
+ wrap.select(".nv-interactive").call(interactiveLayer);
+ }
+ bars
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled }));
+
+ var barsWrap = g.select('.nv-barsWrap')
+ .datum(data.filter(function(d) { return !d.disabled }));
+ barsWrap.transition().call(bars);
+
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight, 0);
+
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y.range()[0] + ')');
+ g.select('.nv-x.nv-axis')
+ .transition()
+ .call(xAxis);
+ }
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
- chart.filterZero = function(_) {
- if (!arguments.length) return filterZero;
- filterZero = _;
- return chart;
- };
+ g.select('.nv-y.nv-axis')
+ .transition()
+ .call(yAxis);
+ }
- chart.columns = function(_) {
- if (!arguments.length) return columns;
- columns = _;
- return chart;
- };
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- chart.tableClass = function(_) {
- if (!arguments.length) return tableClass;
- tableClass = _;
- return chart;
- };
+ interactiveLayer.dispatch.on('elementMousemove', function(e) {
+ bars.clearHighlights();
- chart.iconOpen = function(_){
- if (!arguments.length) return iconOpen;
- iconOpen = _;
- return chart;
- }
+ var singlePoint, pointIndex, pointXLocation, allData = [];
+ data
+ .filter(function(series, i) {
+ series.seriesIndex = i;
+ return !series.disabled;
+ })
+ .forEach(function(series,i) {
+ pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
+ bars.highlightPoint(pointIndex,true);
+ var point = series.values[pointIndex];
+ if (point === undefined) return;
+ if (singlePoint === undefined) singlePoint = point;
+ if (pointXLocation === undefined) pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
+ allData.push({
+ key: series.key,
+ value: chart.y()(point, pointIndex),
+ color: color(series,series.seriesIndex),
+ data: series.values[pointIndex]
+ });
+ });
- chart.iconClose = function(_){
- if (!arguments.length) return iconClose;
- iconClose = _;
- return chart;
- }
+ var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex));
+ interactiveLayer.tooltip
+ .chartContainer(that.parentNode)
+ .valueFormatter(function(d,i) {
+ return yAxis.tickFormat()(d);
+ })
+ .data({
+ value: xValue,
+ index: pointIndex,
+ series: allData
+ })();
- chart.getUrl = function(_){
- if (!arguments.length) return getUrl;
- getUrl = _;
- return chart;
- }
-
- //============================================================
-
-
- return chart;
-};nv.models.legend = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 5, right: 0, bottom: 5, left: 0}
- , width = 400
- , height = 20
- , getKey = function(d) { return d.key }
- , color = nv.utils.defaultColor()
- , align = true
- , rightAlign = true
- , updateState = true //If true, legend will update data.disabled and trigger a 'stateChange' dispatch.
- , radioButtonMode = false //If true, clicking legend items will cause it to behave like a radio button. (only one can be selected at a time)
- , dispatch = d3.dispatch('legendClick', 'legendDblclick', 'legendMouseover', 'legendMouseout', 'stateChange')
- ;
+ interactiveLayer.renderGuideLine(pointXLocation);
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- container = d3.select(this);
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.selectAll('g.nv-legend').data([data]);
- var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-legend').append('g');
- var g = wrap.select('g');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- //------------------------------------------------------------
-
-
- var series = g.selectAll('.nv-series')
- .data(function(d) { return d });
- 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
- })
- .on('mouseout', function(d,i) {
- dispatch.legendMouseout(d,i);
- })
- .on('click', function(d,i) {
- dispatch.legendClick(d,i);
- if (updateState) {
- if (radioButtonMode) {
- //Radio button mode: set every series to disabled,
- // and enable the clicked series.
- data.forEach(function(series) { series.disabled = true});
- d.disabled = false;
- }
- else {
- d.disabled = !d.disabled;
- if (data.every(function(series) { return series.disabled})) {
- //the default behavior of NVD3 legends is, if every single series
- // is disabled, turn all series' back on.
- data.forEach(function(series) { series.disabled = false});
- }
- }
- dispatch.stateChange({
- disabled: data.map(function(d) { return !!d.disabled })
- });
- }
- })
- .on('dblclick', function(d,i) {
- dispatch.legendDblclick(d,i);
- if (updateState) {
- //the default behavior of NVD3 legends, when double clicking one,
- // is to set all other series' to false, and make the double clicked series enabled.
- data.forEach(function(series) {
- series.disabled = true;
- });
- d.disabled = false;
- dispatch.stateChange({
- disabled: data.map(function(d) { return !!d.disabled })
- });
- }
- });
- seriesEnter.append('circle')
- .style('stroke-width', 2)
- .attr('class','nv-legend-symbol')
- .attr('r', 5);
- seriesEnter.append('text')
- .attr('text-anchor', 'start')
- .attr('class','nv-legend-text')
- .attr('dy', '.32em')
- .attr('dx', '8');
- series.classed('disabled', function(d) { return d.disabled });
- series.exit().remove();
- series.select('circle')
- .style('fill', function(d,i) { return d.color || color(d,i)})
- .style('stroke', function(d,i) { return d.color || color(d, i) });
- series.select('text').text(getKey);
-
-
- //TODO: implement fixed-width and max-width options (max-width is especially useful with the align option)
-
- // NEW ALIGNING CODE, TODO: clean up
- if (align) {
-
- var seriesWidths = [];
- series.each(function(d,i) {
- var legendText = d3.select(this).select('text');
- var nodeTextLength;
- try {
- nodeTextLength = legendText.getComputedTextLength();
- // If the legendText is display:none'd (nodeTextLength == 0), simulate an error so we approximate, instead
- if(nodeTextLength <= 0) throw Error();
- }
- catch(e) {
- nodeTextLength = nv.utils.calcApproxTextWidth(legendText);
- }
-
- seriesWidths.push(nodeTextLength + 28); // 28 is ~ the width of the circle plus some padding
});
- var seriesPerRow = 0;
- var legendWidth = 0;
- var columnWidths = [];
-
- while ( legendWidth < availableWidth && seriesPerRow < seriesWidths.length) {
- columnWidths[seriesPerRow] = seriesWidths[seriesPerRow];
- legendWidth += seriesWidths[seriesPerRow++];
- }
- if (seriesPerRow === 0) seriesPerRow = 1; //minimum of one series per row
-
-
- while ( legendWidth > availableWidth && seriesPerRow > 1 ) {
- columnWidths = [];
- seriesPerRow--;
+ interactiveLayer.dispatch.on("elementMouseout",function(e) {
+ dispatch.tooltipHide();
+ bars.clearHighlights();
+ });
- for (var k = 0; k < seriesWidths.length; k++) {
- if (seriesWidths[k] > (columnWidths[k % seriesPerRow] || 0) )
- columnWidths[k % seriesPerRow] = seriesWidths[k];
- }
+ legend.dispatch.on('legendClick', function(d,i) {
+ d.disabled = !d.disabled;
- legendWidth = columnWidths.reduce(function(prev, cur, index, array) {
- return prev + cur;
- });
- }
+ if (!data.filter(function(d) { return !d.disabled }).length) {
+ data.map(function(d) {
+ d.disabled = false;
+ wrap.selectAll('.nv-series').classed('disabled', false);
+ return d;
+ });
+ }
- var xPositions = [];
- for (var i = 0, curX = 0; i < seriesPerRow; i++) {
- xPositions[i] = curX;
- curX += columnWidths[i];
- }
+ state.disabled = data.map(function(d) { return !!d.disabled });
+ dispatch.stateChange(state);
- series
- .attr('transform', function(d, i) {
- return 'translate(' + xPositions[i % seriesPerRow] + ',' + (5 + Math.floor(i / seriesPerRow) * 20) + ')';
+ selection.transition().call(chart);
});
- //position legend as far right as possible within the total width
- if (rightAlign) {
- g.attr('transform', 'translate(' + (width - margin.right - legendWidth) + ',' + margin.top + ')');
- }
- else {
- g.attr('transform', 'translate(0' + ',' + margin.top + ')');
- }
-
- height = margin.top + margin.bottom + (Math.ceil(seriesWidths.length / seriesPerRow) * 20);
-
- } else {
+ legend.dispatch.on('legendDblclick', function(d) {
+ //Double clicking should always enable current series, and disabled all others.
+ data.forEach(function(d) {
+ d.disabled = true;
+ });
+ d.disabled = false;
- var ypos = 5,
- newxpos = 5,
- maxwidth = 0,
- xpos;
- series
- .attr('transform', function(d, i) {
- var length = d3.select(this).select('text').node().getComputedTextLength() + 28;
- xpos = newxpos;
+ state.disabled = data.map(function(d) { return !!d.disabled });
+ dispatch.stateChange(state);
+ chart.update();
+ });
- if (width < margin.left + margin.right + xpos + length) {
- newxpos = xpos = 5;
- ypos += 20;
- }
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
- newxpos += length;
- if (newxpos > maxwidth) maxwidth = newxpos;
+ state.disabled = e.disabled;
+ }
- return 'translate(' + xpos + ',' + ypos + ')';
+ chart.update();
});
+ });
- //position legend as far right as possible within the total width
- g.attr('transform', 'translate(' + (width - margin.right - maxwidth) + ',' + margin.top + ')');
-
- height = margin.top + margin.bottom + ypos + 15;
+ renderWatch.renderEnd('historicalBarChart immediate');
+ return chart;
+ }
- }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ bars.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt['series'] = {
+ key: chart.x()(evt.data),
+ value: chart.y()(evt.data),
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ bars.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ bars.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.key = function(_) {
- if (!arguments.length) return getKey;
- getKey = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.bars = bars;
+ chart.legend = legend;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.interactiveLayer = interactiveLayer;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ bars.color(color);
+ }},
+ duration: {get: function(){return transitionDuration;}, set: function(_){
+ transitionDuration=_;
+ renderWatch.reset(transitionDuration);
+ yAxis.duration(transitionDuration);
+ xAxis.duration(transitionDuration);
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( (_) ? 'right' : 'left');
+ }},
+ useInteractiveGuideline: {get: function(){return useInteractiveGuideline;}, set: function(_){
+ useInteractiveGuideline = _;
+ if (_ === true) {
+ chart.interactive(false);
+ }
+ }}
+ });
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
+ nv.utils.inheritOptions(chart, bars);
+ nv.utils.initOptions(chart);
- chart.align = function(_) {
- if (!arguments.length) return align;
- align = _;
return chart;
- };
+};
- chart.rightAlign = function(_) {
- if (!arguments.length) return rightAlign;
- rightAlign = _;
- return chart;
- };
- chart.updateState = function(_) {
- if (!arguments.length) return updateState;
- updateState = _;
+// ohlcChart is just a historical chart with ohlc bars and some tweaks
+nv.models.ohlcBarChart = function() {
+ var chart = nv.models.historicalBarChart(nv.models.ohlcBar());
+
+ // special default tooltip since we show multiple values per x
+ chart.useInteractiveGuideline(true);
+ chart.interactiveLayer.tooltip.contentGenerator(function(data) {
+ // we assume only one series exists for this chart
+ var d = data.series[0].data;
+ // match line colors as defined in nv.d3.css
+ var color = d.open < d.close ? "2ca02c" : "d62728";
+ return '' +
+ '<h3 style="color: #' + color + '">' + data.value + '</h3>' +
+ '<table>' +
+ '<tr><td>open:</td><td>' + chart.yAxis.tickFormat()(d.open) + '</td></tr>' +
+ '<tr><td>close:</td><td>' + chart.yAxis.tickFormat()(d.close) + '</td></tr>' +
+ '<tr><td>high</td><td>' + chart.yAxis.tickFormat()(d.high) + '</td></tr>' +
+ '<tr><td>low:</td><td>' + chart.yAxis.tickFormat()(d.low) + '</td></tr>' +
+ '</table>';
+ });
return chart;
- };
+};
- chart.radioButtonMode = function(_) {
- if (!arguments.length) return radioButtonMode;
- radioButtonMode = _;
+// candlestickChart is just a historical chart with candlestick bars and some tweaks
+nv.models.candlestickBarChart = function() {
+ var chart = nv.models.historicalBarChart(nv.models.candlestickBar());
+
+ // special default tooltip since we show multiple values per x
+ chart.useInteractiveGuideline(true);
+ chart.interactiveLayer.tooltip.contentGenerator(function(data) {
+ // we assume only one series exists for this chart
+ var d = data.series[0].data;
+ // match line colors as defined in nv.d3.css
+ var color = d.open < d.close ? "2ca02c" : "d62728";
+ return '' +
+ '<h3 style="color: #' + color + '">' + data.value + '</h3>' +
+ '<table>' +
+ '<tr><td>open:</td><td>' + chart.yAxis.tickFormat()(d.open) + '</td></tr>' +
+ '<tr><td>close:</td><td>' + chart.yAxis.tickFormat()(d.close) + '</td></tr>' +
+ '<tr><td>high</td><td>' + chart.yAxis.tickFormat()(d.high) + '</td></tr>' +
+ '<tr><td>low:</td><td>' + chart.yAxis.tickFormat()(d.low) + '</td></tr>' +
+ '</table>';
+ });
return chart;
- };
-
- //============================================================
-
+};
+nv.models.legend = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 5, right: 0, bottom: 5, left: 0}
+ , width = 400
+ , height = 20
+ , getKey = function(d) { return d.key }
+ , color = nv.utils.getColor()
+ , maxKeyLength = 20 //default value for key lengths
+ , align = true
+ , padding = 32 //define how much space between legend items. - recommend 32 for furious version
+ , rightAlign = true
+ , updateState = true //If true, legend will update data.disabled and trigger a 'stateChange' dispatch.
+ , radioButtonMode = false //If true, clicking legend items will cause it to behave like a radio button. (only one can be selected at a time)
+ , expanded = false
+ , dispatch = d3.dispatch('legendClick', 'legendDblclick', 'legendMouseover', 'legendMouseout', 'stateChange')
+ , vers = 'classic' //Options are "classic" and "furious"
+ ;
- return chart;
-}
+ function chart(selection) {
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ container = d3.select(this);
+ nv.utils.initSVG(container);
-nv.models.line = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-legend').data([data]);
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-legend').append('g');
+ var g = wrap.select('g');
- var scatter = nv.models.scatter()
- ;
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , color = nv.utils.defaultColor() // a function that returns a color
- , 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
- , defined = function(d,i) { return !isNaN(getY(d,i)) && getY(d,i) !== null } // allows a line to be not continuous when it is not defined
- , isArea = function(d) { return d.area } // decides if a line is an area or just a line
- , clipEdge = false // if true, masks lines within x and y scale
- , x //can be accessed via chart.xScale()
- , y //can be accessed via chart.yScale()
- , interpolate = "linear" // controls the line interpolation
- ;
+ var series = g.selectAll('.nv-series')
+ .data(function(d) {
+ if(vers != 'furious') return d;
- scatter
- .size(16) // default size
- .sizeDomain([16,256]) //set to speed up calculation, needs to be unset if there is a custom size accessor
- ;
+ return d.filter(function(n) {
+ return expanded ? true : !n.disengaged;
+ });
+ });
- //============================================================
+ var seriesEnter = series.enter().append('g').attr('class', 'nv-series');
+ var seriesShape;
+ var versPadding;
+ switch(vers) {
+ case 'furious' :
+ versPadding = 23;
+ break;
+ case 'classic' :
+ versPadding = 20;
+ }
- //============================================================
- // Private Variables
- //------------------------------------------------------------
+ if(vers == 'classic') {
+ seriesEnter.append('circle')
+ .style('stroke-width', 2)
+ .attr('class','nv-legend-symbol')
+ .attr('r', 5);
+
+ seriesShape = series.select('circle');
+ } else if (vers == 'furious') {
+ seriesEnter.append('rect')
+ .style('stroke-width', 2)
+ .attr('class','nv-legend-symbol')
+ .attr('rx', 3)
+ .attr('ry', 3);
+ seriesShape = series.select('.nv-legend-symbol');
+
+ seriesEnter.append('g')
+ .attr('class', 'nv-check-box')
+ .property('innerHTML','<path d="M0.5,5 L22.5,5 L22.5,26.5 L0.5,26.5 L0.5,5 Z" class="nv-box"></path><path d="M5.5,12.8618467 L11.9185089,19.2803556 L31,0.198864511" class="nv-check"></path>')
+ .attr('transform', 'translate(-10,-8)scale(0.5)');
+
+ var seriesCheckbox = series.select('.nv-check-box');
+
+ seriesCheckbox.each(function(d,i) {
+ d3.select(this).selectAll('path')
+ .attr('stroke', setTextColor(d,i));
+ });
+ }
- var x0, y0 //used to store previous scales
- ;
+ seriesEnter.append('text')
+ .attr('text-anchor', 'start')
+ .attr('class','nv-legend-text')
+ .attr('dy', '.32em')
+ .attr('dx', '8');
- //============================================================
+ var seriesText = series.select('text.nv-legend-text');
+ series
+ .on('mouseover', function(d,i) {
+ dispatch.legendMouseover(d,i); //TODO: Make consistent with other event objects
+ })
+ .on('mouseout', function(d,i) {
+ dispatch.legendMouseout(d,i);
+ })
+ .on('click', function(d,i) {
+ dispatch.legendClick(d,i);
+ // make sure we re-get data in case it was modified
+ var data = series.data();
+ if (updateState) {
+ if(vers =='classic') {
+ if (radioButtonMode) {
+ //Radio button mode: set every series to disabled,
+ // and enable the clicked series.
+ data.forEach(function(series) { series.disabled = true});
+ d.disabled = false;
+ }
+ else {
+ d.disabled = !d.disabled;
+ if (data.every(function(series) { return series.disabled})) {
+ //the default behavior of NVD3 legends is, if every single series
+ // is disabled, turn all series' back on.
+ data.forEach(function(series) { series.disabled = false});
+ }
+ }
+ } else if(vers == 'furious') {
+ if(expanded) {
+ d.disengaged = !d.disengaged;
+ d.userDisabled = d.userDisabled == undefined ? !!d.disabled : d.userDisabled;
+ d.disabled = d.disengaged || d.userDisabled;
+ } else if (!expanded) {
+ d.disabled = !d.disabled;
+ d.userDisabled = d.disabled;
+ var engaged = data.filter(function(d) { return !d.disengaged; });
+ if (engaged.every(function(series) { return series.userDisabled })) {
+ //the default behavior of NVD3 legends is, if every single series
+ // is disabled, turn all series' back on.
+ data.forEach(function(series) {
+ series.disabled = series.userDisabled = false;
+ });
+ }
+ }
+ }
+ dispatch.stateChange({
+ disabled: data.map(function(d) { return !!d.disabled }),
+ disengaged: data.map(function(d) { return !!d.disengaged })
+ });
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
+ }
+ })
+ .on('dblclick', function(d,i) {
+ if(vers == 'furious' && expanded) return;
+ dispatch.legendDblclick(d,i);
+ if (updateState) {
+ // make sure we re-get data in case it was modified
+ var data = series.data();
+ //the default behavior of NVD3 legends, when double clicking one,
+ // is to set all other series' to false, and make the double clicked series enabled.
+ data.forEach(function(series) {
+ series.disabled = true;
+ if(vers == 'furious') series.userDisabled = series.disabled;
+ });
+ d.disabled = false;
+ if(vers == 'furious') d.userDisabled = d.disabled;
+ dispatch.stateChange({
+ disabled: data.map(function(d) { return !!d.disabled })
+ });
+ }
+ });
- //------------------------------------------------------------
- // Setup Scales
+ series.classed('nv-disabled', function(d) { return d.userDisabled });
+ series.exit().remove();
+
+ seriesText
+ .attr('fill', setTextColor)
+ .text(getKey);
+
+ //TODO: implement fixed-width and max-width options (max-width is especially useful with the align option)
+ // NEW ALIGNING CODE, TODO: clean up
+ var legendWidth = 0;
+ if (align) {
+
+ var seriesWidths = [];
+ series.each(function(d,i) {
+ var legendText;
+ if (getKey(d).length > maxKeyLength) {
+ var trimmedKey = getKey(d).substring(0, maxKeyLength);
+ legendText = d3.select(this).select('text').text(trimmedKey + "...");
+ d3.select(this).append("svg:title").text(getKey(d));
+ } else {
+ legendText = d3.select(this).select('text');
+ }
+ var nodeTextLength;
+ try {
+ nodeTextLength = legendText.node().getComputedTextLength();
+ // If the legendText is display:none'd (nodeTextLength == 0), simulate an error so we approximate, instead
+ if(nodeTextLength <= 0) throw Error();
+ }
+ catch(e) {
+ nodeTextLength = nv.utils.calcApproxTextWidth(legendText);
+ }
- x = scatter.xScale();
- y = scatter.yScale();
+ seriesWidths.push(nodeTextLength + padding);
+ });
- x0 = x0 || x;
- y0 = y0 || y;
+ var seriesPerRow = 0;
+ var columnWidths = [];
+ legendWidth = 0;
- //------------------------------------------------------------
+ while ( legendWidth < availableWidth && seriesPerRow < seriesWidths.length) {
+ columnWidths[seriesPerRow] = seriesWidths[seriesPerRow];
+ legendWidth += seriesWidths[seriesPerRow++];
+ }
+ if (seriesPerRow === 0) seriesPerRow = 1; //minimum of one series per row
+ while ( legendWidth > availableWidth && seriesPerRow > 1 ) {
+ columnWidths = [];
+ seriesPerRow--;
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ for (var k = 0; k < seriesWidths.length; k++) {
+ if (seriesWidths[k] > (columnWidths[k % seriesPerRow] || 0) )
+ columnWidths[k % seriesPerRow] = seriesWidths[k];
+ }
- 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')
+ legendWidth = columnWidths.reduce(function(prev, cur, index, array) {
+ return prev + cur;
+ });
+ }
- gEnter.append('g').attr('class', 'nv-groups');
- gEnter.append('g').attr('class', 'nv-scatterWrap');
+ var xPositions = [];
+ for (var i = 0, curX = 0; i < seriesPerRow; i++) {
+ xPositions[i] = curX;
+ curX += columnWidths[i];
+ }
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ series
+ .attr('transform', function(d, i) {
+ return 'translate(' + xPositions[i % seriesPerRow] + ',' + (5 + Math.floor(i / seriesPerRow) * versPadding) + ')';
+ });
- //------------------------------------------------------------
+ //position legend as far right as possible within the total width
+ if (rightAlign) {
+ g.attr('transform', 'translate(' + (width - margin.right - legendWidth) + ',' + margin.top + ')');
+ }
+ else {
+ g.attr('transform', 'translate(0' + ',' + margin.top + ')');
+ }
+ height = margin.top + margin.bottom + (Math.ceil(seriesWidths.length / seriesPerRow) * versPadding);
+ } else {
+ var ypos = 5,
+ newxpos = 5,
+ maxwidth = 0,
+ xpos;
+ series
+ .attr('transform', function(d, i) {
+ var length = d3.select(this).select('text').node().getComputedTextLength() + padding;
+ xpos = newxpos;
- scatter
- .width(availableWidth)
- .height(availableHeight)
+ if (width < margin.left + margin.right + xpos + length) {
+ newxpos = xpos = 5;
+ ypos += versPadding;
+ }
- var scatterWrap = wrap.select('.nv-scatterWrap');
- //.datum(data); // Data automatically trickles down from the wrap
+ newxpos += length;
+ if (newxpos > maxwidth) maxwidth = newxpos;
- scatterWrap.transition().call(scatter);
+ if(legendWidth < xpos + maxwidth) {
+ legendWidth = xpos + maxwidth;
+ }
+ return 'translate(' + xpos + ',' + ypos + ')';
+ });
+ //position legend as far right as possible within the total width
+ g.attr('transform', 'translate(' + (width - margin.right - maxwidth) + ',' + margin.top + ')');
+ height = margin.top + margin.bottom + ypos + 15;
+ }
- defsEnter.append('clipPath')
- .attr('id', 'nv-edge-clip-' + scatter.id())
- .append('rect');
+ if(vers == 'furious') {
+ // Size rectangles after text is placed
+ seriesShape
+ .attr('width', function(d,i) {
+ return seriesText[0][i].getComputedTextLength() + 27;
+ })
+ .attr('height', 18)
+ .attr('y', -9)
+ .attr('x', -15);
- wrap.select('#nv-edge-clip-' + scatter.id() + ' rect')
- .attr('width', availableWidth)
- .attr('height', (availableHeight > 0) ? availableHeight : 0);
+ // The background for the expanded legend (UI)
+ gEnter.insert('rect',':first-child')
+ .attr('class', 'nv-legend-bg')
+ .attr('fill', '#eee')
+ // .attr('stroke', '#444')
+ .attr('opacity',0);
- g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + scatter.id() + ')' : '');
- scatterWrap
- .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + scatter.id() + ')' : '');
+ var seriesBG = g.select('.nv-legend-bg');
+ seriesBG
+ .transition().duration(300)
+ .attr('x', -versPadding )
+ .attr('width', legendWidth + versPadding - 12)
+ .attr('height', height + 10)
+ .attr('y', -margin.top - 10)
+ .attr('opacity', expanded ? 1 : 0);
+ }
- 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)
- .style('fill-opacity', 1e-6);
+ seriesShape
+ .style('fill', setBGColor)
+ .style('fill-opacity', setBGOpacity)
+ .style('stroke', setBGColor);
+ });
- groups.exit().remove();
+ function setTextColor(d,i) {
+ if(vers != 'furious') return '#000';
+ if(expanded) {
+ return d.disengaged ? '#000' : '#fff';
+ } else if (!expanded) {
+ if(!d.color) d.color = color(d,i);
+ return !!d.disabled ? d.color : '#fff';
+ }
+ }
- groups
- .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(d, i) })
- .style('stroke', function(d,i){ return color(d, i)});
- groups
- .transition()
- .style('stroke-opacity', 1)
- .style('fill-opacity', .5);
+ function setBGColor(d,i) {
+ if(expanded && vers == 'furious') {
+ return d.disengaged ? '#eee' : d.color || color(d,i);
+ } else {
+ return d.color || color(d,i);
+ }
+ }
+ function setBGOpacity(d,i) {
+ if(expanded && vers == 'furious') {
+ return 1;
+ } else {
+ return !!d.disabled ? 0 : 1;
+ }
+ }
- var areaPaths = groups.selectAll('path.nv-area')
- .data(function(d) { return isArea(d) ? [d] : [] }); // this is done differently than lines because I need to check if series is an area
- areaPaths.enter().append('path')
- .attr('class', 'nv-area')
- .attr('d', function(d) {
- return d3.svg.area()
- .interpolate(interpolate)
- .defined(defined)
- .x(function(d,i) { return nv.utils.NaNtoZero(x0(getX(d,i))) })
- .y0(function(d,i) { return nv.utils.NaNtoZero(y0(getY(d,i))) })
- .y1(function(d,i) { return y0( y.domain()[0] <= 0 ? y.domain()[1] >= 0 ? 0 : y.domain()[1] : y.domain()[0] ) })
- //.y1(function(d,i) { return y0(0) }) //assuming 0 is within y domain.. may need to tweak this
- .apply(this, [d.values])
- });
- groups.exit().selectAll('path.nv-area')
- .remove();
-
- areaPaths
- .transition()
- .attr('d', function(d) {
- return d3.svg.area()
- .interpolate(interpolate)
- .defined(defined)
- .x(function(d,i) { return nv.utils.NaNtoZero(x(getX(d,i))) })
- .y0(function(d,i) { return nv.utils.NaNtoZero(y(getY(d,i))) })
- .y1(function(d,i) { return y( y.domain()[0] <= 0 ? y.domain()[1] >= 0 ? 0 : y.domain()[1] : y.domain()[0] ) })
- //.y1(function(d,i) { return y0(0) }) //assuming 0 is within y domain.. may need to tweak this
- .apply(this, [d.values])
- });
-
-
-
- var linePaths = groups.selectAll('path.nv-line')
- .data(function(d) { return [d.values] });
- linePaths.enter().append('path')
- .attr('class', 'nv-line')
- .attr('d',
- d3.svg.line()
- .interpolate(interpolate)
- .defined(defined)
- .x(function(d,i) { return nv.utils.NaNtoZero(x0(getX(d,i))) })
- .y(function(d,i) { return nv.utils.NaNtoZero(y0(getY(d,i))) })
- );
-
- linePaths
- .transition()
- .attr('d',
- d3.svg.line()
- .interpolate(interpolate)
- .defined(defined)
- .x(function(d,i) { return nv.utils.NaNtoZero(x(getX(d,i))) })
- .y(function(d,i) { return nv.utils.NaNtoZero(y(getY(d,i))) })
- );
-
-
-
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ key: {get: function(){return getKey;}, set: function(_){getKey=_;}},
+ align: {get: function(){return align;}, set: function(_){align=_;}},
+ maxKeyLength: {get: function(){return maxKeyLength;}, set: function(_){maxKeyLength=_;}},
+ rightAlign: {get: function(){return rightAlign;}, set: function(_){rightAlign=_;}},
+ padding: {get: function(){return padding;}, set: function(_){padding=_;}},
+ updateState: {get: function(){return updateState;}, set: function(_){updateState=_;}},
+ radioButtonMode: {get: function(){return radioButtonMode;}, set: function(_){radioButtonMode=_;}},
+ expanded: {get: function(){return expanded;}, set: function(_){expanded=_;}},
+ vers: {get: function(){return vers;}, set: function(_){vers=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
});
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = scatter.dispatch;
- chart.scatter = scatter;
-
- d3.rebind(chart, scatter, 'id', 'interactive', 'size', 'xScale', 'yScale', 'zScale', 'xDomain', 'yDomain', 'xRange', 'yRange',
- 'sizeDomain', 'forceX', 'forceY', 'forceSize', 'clipVoronoi', 'useVoronoi', 'clipRadius', 'padData','highlightPoint','clearHighlights');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- scatter.x(_);
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- scatter.y(_);
- return chart;
- };
-
- chart.clipEdge = function(_) {
- if (!arguments.length) return clipEdge;
- clipEdge = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- scatter.color(color);
- return chart;
- };
-
- chart.interpolate = function(_) {
- if (!arguments.length) return interpolate;
- interpolate = _;
- return chart;
- };
-
- chart.defined = function(_) {
- if (!arguments.length) return defined;
- defined = _;
- return chart;
- };
+ nv.utils.initOptions(chart);
- chart.isArea = function(_) {
- if (!arguments.length) return isArea;
- isArea = d3.functor(_);
return chart;
- };
-
- //============================================================
+};
+nv.models.line = function() {
+ "use strict";
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
- return chart;
-}
+ var scatter = nv.models.scatter()
+ ;
-nv.models.lineChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var lines = nv.models.line()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- , interactiveLayer = nv.interactiveGuideline()
- ;
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 960
+ , height = 500
+ , container = null
+ , strokeWidth = 1.5
+ , color = nv.utils.defaultColor() // a function that returns a color
+ , 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
+ , defined = function(d,i) { return !isNaN(getY(d,i)) && getY(d,i) !== null } // allows a line to be not continuous when it is not defined
+ , isArea = function(d) { return d.area } // decides if a line is an area or just a line
+ , clipEdge = false // if true, masks lines within x and y scale
+ , x //can be accessed via chart.xScale()
+ , y //can be accessed via chart.yScale()
+ , interpolate = "linear" // controls the line interpolation
+ , duration = 250
+ , dispatch = d3.dispatch('elementClick', 'elementMouseover', 'elementMouseout', 'renderEnd')
+ ;
- var margin = {top: 30, right: 20, bottom: 50, left: 60}
- , color = nv.utils.defaultColor()
- , width = null
- , height = null
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , useInteractiveGuideline = false
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>'
- }
- , x
- , y
- , state = {}
- , defaultState = null
- , noData = 'No Data Available.'
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , transitionDuration = 250
+ scatter
+ .pointSize(16) // default size
+ .pointDomain([16,256]) //set to speed up calculation, needs to be unset if there is a custom size accessor
;
- xAxis
- .orient('bottom')
- .tickPadding(7)
- ;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- ;
+ //============================================================
- //============================================================
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- //============================================================
- // Private Variables
- //------------------------------------------------------------
+ var x0, y0 //used to store previous scales
+ , renderWatch = nv.utils.renderWatch(dispatch, duration)
+ ;
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(lines.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(lines.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
+ //============================================================
- nv.tooltip.show([left, top], content, null, null, offsetElement);
- };
- //============================================================
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(scatter);
+ selection.each(function(data) {
+ container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ nv.utils.initSVG(container);
+ // Setup Scales
+ x = scatter.xScale();
+ y = scatter.yScale();
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
+ x0 = x0 || x;
+ y0 = y0 || y;
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ // Setup containers and skeleton of chart
+ 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', 'nv-groups');
+ gEnter.append('g').attr('class', 'nv-scatterWrap');
- chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
- chart.container = this;
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ scatter
+ .width(availableWidth)
+ .height(availableHeight);
+ var scatterWrap = wrap.select('.nv-scatterWrap');
+ scatterWrap.call(scatter);
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-edge-clip-' + scatter.id())
+ .append('rect');
- //------------------------------------------------------------
- // Display noData message if there's nothing to show.
+ wrap.select('#nv-edge-clip-' + scatter.id() + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', (availableHeight > 0) ? availableHeight : 0);
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
+ g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + scatter.id() + ')' : '');
+ scatterWrap
+ .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + scatter.id() + ')' : '');
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
+ 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)
+ .style('stroke-width', function(d) { return d.strokeWidth || strokeWidth })
+ .style('fill-opacity', 1e-6);
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
+ groups.exit().remove();
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
+ groups
+ .attr('class', function(d,i) {
+ return (d.classed || '') + ' nv-group nv-series-' + i;
+ })
+ .classed('hover', function(d) { return d.hover })
+ .style('fill', function(d,i){ return color(d, i) })
+ .style('stroke', function(d,i){ return color(d, i)});
+ groups.watchTransition(renderWatch, 'line: groups')
+ .style('stroke-opacity', 1)
+ .style('fill-opacity', function(d) { return d.fillOpacity || .5});
+
+ var areaPaths = groups.selectAll('path.nv-area')
+ .data(function(d) { return isArea(d) ? [d] : [] }); // this is done differently than lines because I need to check if series is an area
+ areaPaths.enter().append('path')
+ .attr('class', 'nv-area')
+ .attr('d', function(d) {
+ return d3.svg.area()
+ .interpolate(interpolate)
+ .defined(defined)
+ .x(function(d,i) { return nv.utils.NaNtoZero(x0(getX(d,i))) })
+ .y0(function(d,i) { return nv.utils.NaNtoZero(y0(getY(d,i))) })
+ .y1(function(d,i) { return y0( y.domain()[0] <= 0 ? y.domain()[1] >= 0 ? 0 : y.domain()[1] : y.domain()[0] ) })
+ //.y1(function(d,i) { return y0(0) }) //assuming 0 is within y domain.. may need to tweak this
+ .apply(this, [d.values])
+ });
+ groups.exit().selectAll('path.nv-area')
+ .remove();
+
+ areaPaths.watchTransition(renderWatch, 'line: areaPaths')
+ .attr('d', function(d) {
+ return d3.svg.area()
+ .interpolate(interpolate)
+ .defined(defined)
+ .x(function(d,i) { return nv.utils.NaNtoZero(x(getX(d,i))) })
+ .y0(function(d,i) { return nv.utils.NaNtoZero(y(getY(d,i))) })
+ .y1(function(d,i) { return y( y.domain()[0] <= 0 ? y.domain()[1] >= 0 ? 0 : y.domain()[1] : y.domain()[0] ) })
+ //.y1(function(d,i) { return y0(0) }) //assuming 0 is within y domain.. may need to tweak this
+ .apply(this, [d.values])
+ });
- //------------------------------------------------------------
+ var linePaths = groups.selectAll('path.nv-line')
+ .data(function(d) { return [d.values] });
+
+ linePaths.enter().append('path')
+ .attr('class', 'nv-line')
+ .attr('d',
+ d3.svg.line()
+ .interpolate(interpolate)
+ .defined(defined)
+ .x(function(d,i) { return nv.utils.NaNtoZero(x0(getX(d,i))) })
+ .y(function(d,i) { return nv.utils.NaNtoZero(y0(getY(d,i))) })
+ );
+ linePaths.watchTransition(renderWatch, 'line: linePaths')
+ .attr('d',
+ d3.svg.line()
+ .interpolate(interpolate)
+ .defined(defined)
+ .x(function(d,i) { return nv.utils.NaNtoZero(x(getX(d,i))) })
+ .y(function(d,i) { return nv.utils.NaNtoZero(y(getY(d,i))) })
+ );
- //------------------------------------------------------------
- // Setup Scales
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
+ });
+ renderWatch.renderEnd('line immediate');
+ return chart;
+ }
- x = lines.xScale();
- y = lines.yScale();
- //------------------------------------------------------------
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.scatter = scatter;
+ // Pass through events
+ scatter.dispatch.on('elementClick', function(){ dispatch.elementClick.apply(this, arguments); });
+ scatter.dispatch.on('elementMouseover', function(){ dispatch.elementMouseover.apply(this, arguments); });
+ scatter.dispatch.on('elementMouseout', function(){ dispatch.elementMouseout.apply(this, arguments); });
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ defined: {get: function(){return defined;}, set: function(_){defined=_;}},
+ interpolate: {get: function(){return interpolate;}, set: function(_){interpolate=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ scatter.duration(duration);
+ }},
+ isArea: {get: function(){return isArea;}, set: function(_){
+ isArea = d3.functor(_);
+ }},
+ x: {get: function(){return getX;}, set: function(_){
+ getX = _;
+ scatter.x(_);
+ }},
+ y: {get: function(){return getY;}, set: function(_){
+ getY = _;
+ scatter.y(_);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ scatter.color(color);
+ }}
+ });
+ nv.utils.inheritOptions(chart, scatter);
+ nv.utils.initOptions(chart);
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ return chart;
+};
+nv.models.lineChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var lines = nv.models.line()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend()
+ , interactiveLayer = nv.interactiveGuideline()
+ , tooltip = nv.models.tooltip()
+ ;
- 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');
- var g = wrap.select('g');
+ var margin = {top: 30, right: 20, bottom: 50, left: 60}
+ , color = nv.utils.defaultColor()
+ , width = null
+ , height = null
+ , showLegend = true
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , useInteractiveGuideline = false
+ , x
+ , y
+ , state = nv.utils.state()
+ , defaultState = null
+ , noData = null
+ , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState', 'renderEnd')
+ , duration = 250
+ ;
- gEnter.append("rect").style("opacity",0);
- 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-interactive');
+ // set options on sub-objects for this chart
+ xAxis.orient('bottom').tickPadding(7);
+ yAxis.orient(rightAlignYAxis ? 'right' : 'left');
+ tooltip.valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ }).headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ });
- g.select("rect")
- .attr("width",availableWidth)
- .attr("height",(availableHeight > 0) ? availableHeight : 0);
- //------------------------------------------------------------
- // Legend
- if (showLegend) {
- legend.width(availableWidth);
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- g.select('.nv-legendWrap')
- .datum(data)
- .call(legend);
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled })
+ };
}
+ };
- wrap.select('.nv-legendWrap')
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- }
-
- //------------------------------------------------------------
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
+ }
+ };
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(lines);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ chart.update = function() {
+ if (duration === 0)
+ container.call(chart);
+ else
+ container.transition().duration(duration).call(chart)
+ };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- //------------------------------------------------------------
- // Main Chart Component(s)
+ // Display noData message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- //------------------------------------------------------------
- //Set up interactive layer
- if (useInteractiveGuideline) {
- interactiveLayer
- .width(availableWidth)
- .height(availableHeight)
- .margin({left:margin.left, top:margin.top})
- .svgContainer(container)
- .xScale(x);
- wrap.select(".nv-interactive").call(interactiveLayer);
- }
+ // Setup Scales
+ x = lines.xScale();
+ y = lines.yScale();
+
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
+
+ gEnter.append("rect").style("opacity",0);
+ 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-interactive');
+
+ g.select("rect")
+ .attr("width",availableWidth)
+ .attr("height",(availableHeight > 0) ? availableHeight : 0);
+
+ // Legend
+ if (showLegend) {
+ legend.width(availableWidth);
+
+ g.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
+
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
+ wrap.select('.nv-legendWrap')
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ }
- lines
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
- var linesWrap = g.select('.nv-linesWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
+ //Set up interactive layer
+ if (useInteractiveGuideline) {
+ interactiveLayer
+ .width(availableWidth)
+ .height(availableHeight)
+ .margin({left:margin.left, top:margin.top})
+ .svgContainer(container)
+ .xScale(x);
+ wrap.select(".nv-interactive").call(interactiveLayer);
+ }
- linesWrap.transition().call(lines);
+ lines
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled }));
- //------------------------------------------------------------
+ var linesWrap = g.select('.nv-linesWrap')
+ .datum(data.filter(function(d) { return !d.disabled }));
- //------------------------------------------------------------
- // Setup Axes
+ linesWrap.call(lines);
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight, 0);
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks(nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight, 0);
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y.range()[0] + ')');
- g.select('.nv-x.nv-axis')
- .transition()
- .call(xAxis);
- }
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y.range()[0] + ')');
+ g.select('.nv-x.nv-axis')
+ .call(xAxis);
+ }
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks(nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
- g.select('.nv-y.nv-axis')
- .transition()
- .call(yAxis);
- }
- //------------------------------------------------------------
+ g.select('.nv-y.nv-axis')
+ .call(yAxis);
+ }
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
- legend.dispatch.on('stateChange', function(newState) {
- state = newState;
- dispatch.stateChange(state);
- chart.update();
- });
+ interactiveLayer.dispatch.on('elementMousemove', function(e) {
+ lines.clearHighlights();
+ var singlePoint, pointIndex, pointXLocation, allData = [];
+ data
+ .filter(function(series, i) {
+ series.seriesIndex = i;
+ return !series.disabled;
+ })
+ .forEach(function(series,i) {
+ pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
+ var point = series.values[pointIndex];
+ var pointYValue = chart.y()(point, pointIndex);
+ if (pointYValue != null) {
+ lines.highlightPoint(i, pointIndex, true);
+ }
+ if (point === undefined) return;
+ if (singlePoint === undefined) singlePoint = point;
+ if (pointXLocation === undefined) pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
+ allData.push({
+ key: series.key,
+ value: pointYValue,
+ color: color(series,series.seriesIndex)
+ });
+ });
+ //Highlight the tooltip entry based on which point the mouse is closest to.
+ if (allData.length > 2) {
+ var yValue = chart.yScale().invert(e.mouseY);
+ var domainExtent = Math.abs(chart.yScale().domain()[0] - chart.yScale().domain()[1]);
+ var threshold = 0.03 * domainExtent;
+ var indexToHighlight = nv.nearestValueIndex(allData.map(function(d){return d.value}),yValue,threshold);
+ if (indexToHighlight !== null)
+ allData[indexToHighlight].highlight = true;
+ }
- interactiveLayer.dispatch.on('elementMousemove', function(e) {
- lines.clearHighlights();
- var singlePoint, pointIndex, pointXLocation, allData = [];
- data
- .filter(function(series, i) {
- series.seriesIndex = i;
- return !series.disabled;
- })
- .forEach(function(series,i) {
- pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
- lines.highlightPoint(i, pointIndex, true);
- var point = series.values[pointIndex];
- if (typeof point === 'undefined') return;
- if (typeof singlePoint === 'undefined') singlePoint = point;
- if (typeof pointXLocation === 'undefined') pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
- allData.push({
- key: series.key,
- value: chart.y()(point, pointIndex),
- color: color(series,series.seriesIndex)
- });
- });
- //Highlight the tooltip entry based on which point the mouse is closest to.
- if (allData.length > 2) {
- var yValue = chart.yScale().invert(e.mouseY);
- var domainExtent = Math.abs(chart.yScale().domain()[0] - chart.yScale().domain()[1]);
- var threshold = 0.03 * domainExtent;
- var indexToHighlight = nv.nearestValueIndex(allData.map(function(d){return d.value}),yValue,threshold);
- if (indexToHighlight !== null)
- allData[indexToHighlight].highlight = true;
- }
-
- var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex));
- interactiveLayer.tooltip
- .position({left: pointXLocation + margin.left, top: e.mouseY + margin.top})
- .chartContainer(that.parentNode)
- .enabled(tooltips)
- .valueFormatter(function(d,i) {
- return yAxis.tickFormat()(d);
- })
- .data(
- {
+ var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex));
+ interactiveLayer.tooltip
+ .chartContainer(that.parentNode)
+ .valueFormatter(function(d,i) {
+ return d == null ? "N/A" : yAxis.tickFormat()(d);
+ })
+ .data({
value: xValue,
+ index: pointIndex,
series: allData
- }
- )();
-
- interactiveLayer.renderGuideLine(pointXLocation);
-
- });
-
- interactiveLayer.dispatch.on("elementMouseout",function(e) {
- dispatch.tooltipHide();
- lines.clearHighlights();
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
-
-
- dispatch.on('changeState', function(e) {
-
- if (typeof e.disabled !== 'undefined' && data.length === e.disabled.length) {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
-
- state.disabled = e.disabled;
- }
-
- chart.update();
- });
-
- //============================================================
-
- });
-
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- lines.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
+ })();
- lines.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
+ interactiveLayer.renderGuideLine(pointXLocation);
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.lines = lines;
- chart.legend = legend;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
- chart.interactiveLayer = interactiveLayer;
-
- d3.rebind(chart, lines, 'defined', 'isArea', 'x', 'y', 'size', 'xScale', 'yScale', 'xDomain', 'yDomain', 'xRange', 'yRange'
- , 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi', 'useVoronoi','id', 'interpolate');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
+ });
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ interactiveLayer.dispatch.on('elementClick', function(e) {
+ var pointXLocation, allData = [];
+
+ data.filter(function(series, i) {
+ series.seriesIndex = i;
+ return !series.disabled;
+ }).forEach(function(series) {
+ var pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
+ var point = series.values[pointIndex];
+ if (typeof point === 'undefined') return;
+ if (typeof pointXLocation === 'undefined') pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
+ var yPos = chart.yScale()(chart.y()(point,pointIndex));
+ allData.push({
+ point: point,
+ pointIndex: pointIndex,
+ pos: [pointXLocation, yPos],
+ seriesIndex: series.seriesIndex,
+ series: series
+ });
+ });
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ lines.dispatch.elementClick(allData);
+ });
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ interactiveLayer.dispatch.on("elementMouseout",function(e) {
+ lines.clearHighlights();
+ });
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined' && data.length === e.disabled.length) {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
+ state.disabled = e.disabled;
+ }
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
+ chart.update();
+ });
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
+ });
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.useInteractiveGuideline = function(_) {
- if(!arguments.length) return useInteractiveGuideline;
- useInteractiveGuideline = _;
- if (_ === true) {
- chart.interactive(false);
- chart.useVoronoi(false);
+ renderWatch.renderEnd('lineChart immediate');
+ return chart;
}
- return chart;
- };
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ lines.dispatch.on('elementMouseover.tooltip', function(evt) {
+ tooltip.data(evt).hidden(false);
+ });
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
+ lines.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.lines = lines;
+ chart.legend = legend;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.interactiveLayer = interactiveLayer;
+ chart.tooltip = tooltip;
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ lines.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ lines.color(color);
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( rightAlignYAxis ? 'right' : 'left');
+ }},
+ useInteractiveGuideline: {get: function(){return useInteractiveGuideline;}, set: function(_){
+ useInteractiveGuideline = _;
+ if (useInteractiveGuideline) {
+ lines.interactive(false);
+ lines.useVoronoi(false);
+ }
+ }}
+ });
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ nv.utils.inheritOptions(chart, lines);
+ nv.utils.initOptions(chart);
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
-
+};
nv.models.linePlusBarChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var lines = nv.models.line()
- , bars = nv.models.historicalBar()
- , xAxis = nv.models.axis()
- , y1Axis = nv.models.axis()
- , y2Axis = nv.models.axis()
- , legend = nv.models.legend()
- ;
-
- var margin = {top: 30, right: 60, bottom: 50, left: 60}
- , width = null
- , height = null
- , getX = function(d) { return d.x }
- , getY = function(d) { return d.y }
- , color = nv.utils.defaultColor()
- , showLegend = true
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>';
- }
- , x
- , y1
- , y2
- , state = {}
- , defaultState = null
- , noData = "No Data Available."
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- ;
-
- bars
- .padData(true)
- ;
- lines
- .clipEdge(false)
- .padData(true)
- ;
- xAxis
- .orient('bottom')
- .tickPadding(7)
- .highlightZero(false)
- ;
- y1Axis
- .orient('left')
- ;
- y2Axis
- .orient('right')
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(lines.x()(e.point, e.pointIndex)),
- y = (e.series.bar ? y1Axis : y2Axis).tickFormat()(lines.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
- }
- ;
-
- //------------------------------------------------------------
-
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var lines = nv.models.line()
+ , lines2 = nv.models.line()
+ , bars = nv.models.historicalBar()
+ , bars2 = nv.models.historicalBar()
+ , xAxis = nv.models.axis()
+ , x2Axis = nv.models.axis()
+ , y1Axis = nv.models.axis()
+ , y2Axis = nv.models.axis()
+ , y3Axis = nv.models.axis()
+ , y4Axis = nv.models.axis()
+ , legend = nv.models.legend()
+ , brush = d3.svg.brush()
+ , tooltip = nv.models.tooltip()
+ ;
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ var margin = {top: 30, right: 30, bottom: 30, left: 60}
+ , margin2 = {top: 0, right: 30, bottom: 20, left: 60}
+ , width = null
+ , height = null
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , color = nv.utils.defaultColor()
+ , showLegend = true
+ , focusEnable = true
+ , focusShowAxisY = false
+ , focusShowAxisX = true
+ , focusHeight = 50
+ , extent
+ , brushExtent = null
+ , x
+ , x2
+ , y1
+ , y2
+ , y3
+ , y4
+ , noData = null
+ , dispatch = d3.dispatch('brush', 'stateChange', 'changeState')
+ , transitionDuration = 0
+ , state = nv.utils.state()
+ , defaultState = null
+ , legendLeftAxisHint = ' (left axis)'
+ , legendRightAxisHint = ' (right axis)'
+ ;
- chart.update = function() { container.transition().call(chart); };
- // chart.container = this;
+ lines.clipEdge(true);
+ lines2.interactive(false);
+ // We don't want any points emitted for the focus chart's scatter graph.
+ lines2.pointActive(function(d) { return false });
+ xAxis.orient('bottom').tickPadding(5);
+ y1Axis.orient('left');
+ y2Axis.orient('right');
+ x2Axis.orient('bottom').tickPadding(5);
+ y3Axis.orient('left');
+ y4Axis.orient('right');
+
+ tooltip.headerEnabled(true).headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ });
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled })
+ };
}
- }
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- var dataBars = data.filter(function(d) { return !d.disabled && d.bar });
- var dataLines = data.filter(function(d) { return !d.bar }); // removed the !d.disabled clause here to fix Issue #240
-
- //x = xAxis.scale();
- x = dataLines.filter(function(d) { return !d.disabled; }).length && dataLines.filter(function(d) { return !d.disabled; })[0].values.length ? lines.xScale() : bars.xScale();
- //x = dataLines.filter(function(d) { return !d.disabled; }).length ? lines.xScale() : bars.xScale(); //old code before change above
- y1 = bars.yScale();
- y2 = lines.yScale();
-
- //------------------------------------------------------------
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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');
- var g = wrap.select('g');
-
- 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');
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Legend
-
- if (showLegend) {
- legend.width( availableWidth / 2 );
-
- 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;
- }))
- .call(legend);
+ };
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
}
+ };
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(' + ( availableWidth / 2 ) + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
-
- //------------------------------------------------------------
- // Main Chart Component(s)
-
-
- lines
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- 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(d, i);
- }).filter(function(d,i) { return !data[i].disabled && data[i].bar }))
-
-
-
- var barsWrap = g.select('.nv-barsWrap')
- .datum(dataBars.length ? dataBars : [{values:[]}])
-
- var linesWrap = g.select('.nv-linesWrap')
- .datum(dataLines[0] && !dataLines[0].disabled ? dataLines : [{values:[]}] );
- //.datum(!dataLines[0].disabled ? dataLines : [{values:dataLines[0].values.map(function(d) { return [d[0], null] }) }] );
+ var allDisabled = function(data) {
+ return data.every(function(series) {
+ return series.disabled;
+ });
+ }
- d3.transition(barsWrap).call(bars);
- d3.transition(linesWrap).call(lines);
+ function chart(selection) {
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight1 = nv.utils.availableHeight(height, container, margin)
+ - (focusEnable ? focusHeight : 0),
+ availableHeight2 = focusHeight - margin2.top - margin2.bottom;
+
+ chart.update = function() { container.transition().duration(transitionDuration).call(chart); };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- //------------------------------------------------------------
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
+ // Setup Scales
+ var dataBars = data.filter(function(d) { return !d.disabled && d.bar });
+ var dataLines = data.filter(function(d) { return !d.bar }); // removed the !d.disabled clause here to fix Issue #240
- //------------------------------------------------------------
- // Setup Axes
+ x = bars.xScale();
+ x2 = x2Axis.scale();
+ y1 = bars.yScale();
+ y2 = lines.yScale();
+ y3 = bars2.yScale();
+ y4 = lines2.yScale();
+
+ var series1 = data
+ .filter(function(d) { return !d.disabled && d.bar })
+ .map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d,i), y: getY(d,i) }
+ })
+ });
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight, 0);
+ var series2 = data
+ .filter(function(d) { return !d.disabled && !d.bar })
+ .map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d,i), y: getY(d,i) }
+ })
+ });
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y1.range()[0] + ')');
- d3.transition(g.select('.nv-x.nv-axis'))
- .call(xAxis);
+ x.range([0, availableWidth]);
+
+ x2 .domain(d3.extent(d3.merge(series1.concat(series2)), function(d) { return d.x } ))
+ .range([0, availableWidth]);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-linePlusBar').data([data]);
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-linePlusBar').append('g');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-legendWrap');
+
+ // this is the main chart
+ var focusEnter = gEnter.append('g').attr('class', 'nv-focus');
+ focusEnter.append('g').attr('class', 'nv-x nv-axis');
+ focusEnter.append('g').attr('class', 'nv-y1 nv-axis');
+ focusEnter.append('g').attr('class', 'nv-y2 nv-axis');
+ focusEnter.append('g').attr('class', 'nv-barsWrap');
+ focusEnter.append('g').attr('class', 'nv-linesWrap');
+
+ // context chart is where you can focus in
+ var contextEnter = gEnter.append('g').attr('class', 'nv-context');
+ contextEnter.append('g').attr('class', 'nv-x nv-axis');
+ contextEnter.append('g').attr('class', 'nv-y1 nv-axis');
+ contextEnter.append('g').attr('class', 'nv-y2 nv-axis');
+ contextEnter.append('g').attr('class', 'nv-barsWrap');
+ contextEnter.append('g').attr('class', 'nv-linesWrap');
+ contextEnter.append('g').attr('class', 'nv-brushBackground');
+ contextEnter.append('g').attr('class', 'nv-x nv-brush');
+
+ //============================================================
+ // Legend
+ //------------------------------------------------------------
+
+ if (showLegend) {
+ var legendWidth = legend.align() ? availableWidth / 2 : availableWidth;
+ var legendXPosition = legend.align() ? legendWidth : 0;
+
+ legend.width(legendWidth);
+
+ g.select('.nv-legendWrap')
+ .datum(data.map(function(series) {
+ series.originalKey = series.originalKey === undefined ? series.key : series.originalKey;
+ series.key = series.originalKey + (series.bar ? legendLeftAxisHint : legendRightAxisHint);
+ return series;
+ }))
+ .call(legend);
+
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ // FIXME: shouldn't this be "- (focusEnabled ? focusHeight : 0)"?
+ availableHeight1 = nv.utils.availableHeight(height, container, margin) - focusHeight;
+ }
+ g.select('.nv-legendWrap')
+ .attr('transform', 'translate(' + legendXPosition + ',' + (-margin.top) +')');
+ }
- y1Axis
- .scale(y1)
- .ticks( availableHeight / 36 )
- .tickSize(-availableWidth, 0);
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ //============================================================
+ // Context chart (focus chart) components
+ //------------------------------------------------------------
+
+ // hide or show the focus context chart
+ g.select('.nv-context').style('display', focusEnable ? 'initial' : 'none');
+
+ bars2
+ .width(availableWidth)
+ .height(availableHeight2)
+ .color(data.map(function (d, i) {
+ return d.color || color(d, i);
+ }).filter(function (d, i) {
+ return !data[i].disabled && data[i].bar
+ }));
+ lines2
+ .width(availableWidth)
+ .height(availableHeight2)
+ .color(data.map(function (d, i) {
+ return d.color || color(d, i);
+ }).filter(function (d, i) {
+ return !data[i].disabled && !data[i].bar
+ }));
+
+ var bars2Wrap = g.select('.nv-context .nv-barsWrap')
+ .datum(dataBars.length ? dataBars : [
+ {values: []}
+ ]);
+ var lines2Wrap = g.select('.nv-context .nv-linesWrap')
+ .datum(allDisabled(dataLines) ?
+ [{values: []}] :
+ dataLines.filter(function(dataLine) {
+ return !dataLine.disabled;
+ }));
+
+ g.select('.nv-context')
+ .attr('transform', 'translate(0,' + ( availableHeight1 + margin.bottom + margin2.top) + ')');
+
+ bars2Wrap.transition().call(bars2);
+ lines2Wrap.transition().call(lines2);
+
+ // context (focus chart) axis controls
+ if (focusShowAxisX) {
+ x2Axis
+ ._ticks( nv.utils.calcTicksX(availableWidth / 100, data))
+ .tickSize(-availableHeight2, 0);
+ g.select('.nv-context .nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y3.range()[0] + ')');
+ g.select('.nv-context .nv-x.nv-axis').transition()
+ .call(x2Axis);
+ }
- d3.transition(g.select('.nv-y1.nv-axis'))
- .style('opacity', dataBars.length ? 1 : 0)
- .call(y1Axis);
+ if (focusShowAxisY) {
+ y3Axis
+ .scale(y3)
+ ._ticks( availableHeight2 / 36 )
+ .tickSize( -availableWidth, 0);
+ y4Axis
+ .scale(y4)
+ ._ticks( availableHeight2 / 36 )
+ .tickSize(dataBars.length ? 0 : -availableWidth, 0); // Show the y2 rules only if y1 has none
+
+ g.select('.nv-context .nv-y3.nv-axis')
+ .style('opacity', dataBars.length ? 1 : 0)
+ .attr('transform', 'translate(0,' + x2.range()[0] + ')');
+ g.select('.nv-context .nv-y2.nv-axis')
+ .style('opacity', dataLines.length ? 1 : 0)
+ .attr('transform', 'translate(' + x2.range()[1] + ',0)');
+
+ g.select('.nv-context .nv-y1.nv-axis').transition()
+ .call(y3Axis);
+ g.select('.nv-context .nv-y2.nv-axis').transition()
+ .call(y4Axis);
+ }
+ // Setup Brush
+ brush.x(x2).on('brush', onBrush);
- y2Axis
- .scale(y2)
- .ticks( availableHeight / 36 )
- .tickSize(dataBars.length ? 0 : -availableWidth, 0); // Show the y2 rules only if y1 has none
+ if (brushExtent) brush.extent(brushExtent);
- g.select('.nv-y2.nv-axis')
- .style('opacity', dataLines.length ? 1 : 0)
- .attr('transform', 'translate(' + availableWidth + ',0)');
- //.attr('transform', 'translate(' + x.range()[1] + ',0)');
+ var brushBG = g.select('.nv-brushBackground').selectAll('g')
+ .data([brushExtent || brush.extent()]);
- d3.transition(g.select('.nv-y2.nv-axis'))
- .call(y2Axis);
+ 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);
+
+ var 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);
+
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
+
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
+ state.disabled = e.disabled;
+ }
+ chart.update();
+ });
- legend.dispatch.on('stateChange', function(newState) {
- state = newState;
- dispatch.stateChange(state);
- chart.update();
- });
+ //============================================================
+ // Functions
+ //------------------------------------------------------------
+
+ // Taken from crossfilter (http://square.github.com/crossfilter/)
+ function resizePath(d) {
+ 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);
+ }
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ function updateBrushBG() {
+ if (!brush.empty()) brush.extent(brushExtent);
+ brushBG
+ .data([brush.empty() ? x2.domain() : brushExtent])
+ .each(function(d,i) {
+ var leftWidth = x2(d[0]) - x2.range()[0],
+ rightWidth = x2.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);
+ });
+ }
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
+ function onBrush() {
+ brushExtent = brush.empty() ? null : brush.extent();
+ extent = brush.empty() ? x2.domain() : brush.extent();
+ dispatch.brush({extent: extent, brush: brush});
+ updateBrushBG();
+
+ // Prepare Main (Focus) Bars and Lines
+ bars
+ .width(availableWidth)
+ .height(availableHeight1)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled && data[i].bar }));
+
+ lines
+ .width(availableWidth)
+ .height(availableHeight1)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled && !data[i].bar }));
+
+ var focusBarsWrap = g.select('.nv-focus .nv-barsWrap')
+ .datum(!dataBars.length ? [{values:[]}] :
+ dataBars
+ .map(function(d,i) {
+ return {
+ key: d.key,
+ values: d.values.filter(function(d,i) {
+ return bars.x()(d,i) >= extent[0] && bars.x()(d,i) <= extent[1];
+ })
+ }
+ })
+ );
+
+ var focusLinesWrap = g.select('.nv-focus .nv-linesWrap')
+ .datum(allDisabled(dataLines) ? [{values:[]}] :
+ dataLines
+ .filter(function(dataLine) { return !dataLine.disabled; })
+ .map(function(d,i) {
+ return {
+ area: d.area,
+ fillOpacity: d.fillOpacity,
+ key: d.key,
+ values: d.values.filter(function(d,i) {
+ return lines.x()(d,i) >= extent[0] && lines.x()(d,i) <= extent[1];
+ })
+ }
+ })
+ );
+
+ // Update Main (Focus) X Axis
+ if (dataBars.length) {
+ x = bars.xScale();
+ } else {
+ x = lines.xScale();
+ }
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight1, 0);
+
+ xAxis.domain([Math.ceil(extent[0]), Math.floor(extent[1])]);
+
+ g.select('.nv-x.nv-axis').transition().duration(transitionDuration)
+ .call(xAxis);
+
+ // Update Main (Focus) Bars and Lines
+ focusBarsWrap.transition().duration(transitionDuration).call(bars);
+ focusLinesWrap.transition().duration(transitionDuration).call(lines);
+
+ // Setup and Update Main (Focus) Y Axes
+ g.select('.nv-focus .nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y1.range()[0] + ')');
+
+ y1Axis
+ .scale(y1)
+ ._ticks( nv.utils.calcTicksY(availableHeight1/36, data) )
+ .tickSize(-availableWidth, 0);
+ y2Axis
+ .scale(y2)
+ ._ticks( nv.utils.calcTicksY(availableHeight1/36, data) )
+ .tickSize(dataBars.length ? 0 : -availableWidth, 0); // Show the y2 rules only if y1 has none
+
+ g.select('.nv-focus .nv-y1.nv-axis')
+ .style('opacity', dataBars.length ? 1 : 0);
+ g.select('.nv-focus .nv-y2.nv-axis')
+ .style('opacity', dataLines.length && !allDisabled(dataLines) ? 1 : 0)
+ .attr('transform', 'translate(' + x.range()[1] + ',0)');
+
+ g.select('.nv-focus .nv-y1.nv-axis').transition().duration(transitionDuration)
+ .call(y1Axis);
+ g.select('.nv-focus .nv-y2.nv-axis').transition().duration(transitionDuration)
+ .call(y2Axis);
+ }
- state.disabled = e.disabled;
- }
+ onBrush();
- chart.update();
- });
+ });
- //============================================================
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ lines.dispatch.on('elementMouseover.tooltip', function(evt) {
+ tooltip
+ .duration(100)
+ .valueFormatter(function(d, i) {
+ return y2Axis.tickFormat()(d, i);
+ })
+ .data(evt)
+ .hidden(false);
});
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- lines.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- bars.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- bars.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.legend = legend;
- chart.lines = lines;
- chart.bars = bars;
- chart.xAxis = xAxis;
- chart.y1Axis = y1Axis;
- chart.y2Axis = y2Axis;
-
- d3.rebind(chart, lines, 'defined', 'size', 'clipVoronoi', 'interpolate');
- //TODO: consider rebinding x, y and some other stuff, and simply do soemthign lile bars.x(lines.x()), etc.
- //d3.rebind(chart, lines, 'x', 'y', 'size', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi', 'id');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- lines.x(_);
- bars.x(_);
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- lines.y(_);
- bars.y(_);
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
+ lines.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
+ bars.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt.value = chart.x()(evt.data);
+ evt['series'] = {
+ value: chart.y()(evt.data),
+ color: evt.color
+ };
+ tooltip
+ .duration(0)
+ .valueFormatter(function(d, i) {
+ return y1Axis.tickFormat()(d, i);
+ })
+ .data(evt)
+ .hidden(false);
+ });
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ bars.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ bars.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
+ //============================================================
+
+
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.legend = legend;
+ chart.lines = lines;
+ chart.lines2 = lines2;
+ chart.bars = bars;
+ chart.bars2 = bars2;
+ chart.xAxis = xAxis;
+ chart.x2Axis = x2Axis;
+ chart.y1Axis = y1Axis;
+ chart.y2Axis = y2Axis;
+ chart.y3Axis = y3Axis;
+ chart.y4Axis = y4Axis;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ brushExtent: {get: function(){return brushExtent;}, set: function(_){brushExtent=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ focusEnable: {get: function(){return focusEnable;}, set: function(_){focusEnable=_;}},
+ focusHeight: {get: function(){return focusHeight;}, set: function(_){focusHeight=_;}},
+ focusShowAxisX: {get: function(){return focusShowAxisX;}, set: function(_){focusShowAxisX=_;}},
+ focusShowAxisY: {get: function(){return focusShowAxisY;}, set: function(_){focusShowAxisY=_;}},
+ legendLeftAxisHint: {get: function(){return legendLeftAxisHint;}, set: function(_){legendLeftAxisHint=_;}},
+ legendRightAxisHint: {get: function(){return legendRightAxisHint;}, set: function(_){legendRightAxisHint=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ focusMargin: {get: function(){return margin2;}, set: function(_){
+ margin2.top = _.top !== undefined ? _.top : margin2.top;
+ margin2.right = _.right !== undefined ? _.right : margin2.right;
+ margin2.bottom = _.bottom !== undefined ? _.bottom : margin2.bottom;
+ margin2.left = _.left !== undefined ? _.left : margin2.left;
+ }},
+ duration: {get: function(){return transitionDuration;}, set: function(_){
+ transitionDuration = _;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ }},
+ x: {get: function(){return getX;}, set: function(_){
+ getX = _;
+ lines.x(_);
+ lines2.x(_);
+ bars.x(_);
+ bars2.x(_);
+ }},
+ y: {get: function(){return getY;}, set: function(_){
+ getY = _;
+ lines.y(_);
+ lines2.y(_);
+ bars.y(_);
+ bars2.y(_);
+ }}
+ });
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
+ nv.utils.inheritOptions(chart, lines);
+ nv.utils.initOptions(chart);
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
+};
nv.models.lineWithFocusChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var lines = nv.models.line()
- , lines2 = nv.models.line()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , x2Axis = nv.models.axis()
- , y2Axis = nv.models.axis()
- , legend = nv.models.legend()
- , brush = d3.svg.brush()
- ;
-
- 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
- , x
- , y
- , x2
- , y2
- , showLegend = true
- , brushExtent = null
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>'
- }
- , noData = "No Data Available."
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'brush')
- , transitionDuration = 250
- ;
-
- lines
- .clipEdge(true)
- ;
- lines2
- .interactive(false)
- ;
- xAxis
- .orient('bottom')
- .tickPadding(5)
- ;
- yAxis
- .orient('left')
- ;
- x2Axis
- .orient('bottom')
- .tickPadding(5)
- ;
- y2Axis
- .orient('left')
- ;
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(lines.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(lines.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, null, null, offsetElement);
- };
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight1 = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom - height2,
- availableHeight2 = height2 - margin2.top - margin2.bottom;
-
- chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
- chart.container = this;
-
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight1 / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = lines.xScale();
- y = lines.yScale();
- x2 = lines2.xScale();
- y2 = lines2.yScale();
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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 g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-legendWrap');
-
- 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');
-
- //------------------------------------------------------------
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var lines = nv.models.line()
+ , lines2 = nv.models.line()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , x2Axis = nv.models.axis()
+ , y2Axis = nv.models.axis()
+ , legend = nv.models.legend()
+ , brush = d3.svg.brush()
+ , tooltip = nv.models.tooltip()
+ , interactiveLayer = nv.interactiveGuideline()
+ ;
+ 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 = 50
+ , useInteractiveGuideline = false
+ , x
+ , y
+ , x2
+ , y2
+ , showLegend = true
+ , brushExtent = null
+ , noData = null
+ , dispatch = d3.dispatch('brush', 'stateChange', 'changeState')
+ , transitionDuration = 250
+ , state = nv.utils.state()
+ , defaultState = null
+ ;
- //------------------------------------------------------------
- // Legend
+ lines.clipEdge(true).duration(0);
+ lines2.interactive(false);
+ // We don't want any points emitted for the focus chart's scatter graph.
+ lines2.pointActive(function(d) { return false });
+ xAxis.orient('bottom').tickPadding(5);
+ yAxis.orient('left');
+ x2Axis.orient('bottom').tickPadding(5);
+ y2Axis.orient('left');
+
+ tooltip.valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ }).headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ });
- if (showLegend) {
- legend.width(availableWidth);
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- g.select('.nv-legendWrap')
- .datum(data)
- .call(legend);
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled })
+ };
+ }
+ };
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight1 = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom - height2;
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
}
+ };
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- }
+ function chart(selection) {
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight1 = nv.utils.availableHeight(height, container, margin) - height2,
+ availableHeight2 = height2 - margin2.top - margin2.bottom;
+
+ chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- //------------------------------------------------------------
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
+ // Setup Scales
+ x = lines.xScale();
+ y = lines.yScale();
+ x2 = lines2.xScale();
+ y2 = lines2.yScale();
+
+ // Setup containers and skeleton of chart
+ 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 g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-legendWrap');
+
+ 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');
+ focusEnter.append('g').attr('class', 'nv-interactive');
+
+ 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');
+
+ // Legend
+ if (showLegend) {
+ legend.width(availableWidth);
+
+ g.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
+
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight1 = nv.utils.availableHeight(height, container, margin) - height2;
+ }
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ g.select('.nv-legendWrap')
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ }
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- //------------------------------------------------------------
- // Main Chart Component(s)
- lines
- .width(availableWidth)
- .height(availableHeight1)
- .color(
- data
- .map(function(d,i) {
- return d.color || color(d, i);
- })
- .filter(function(d,i) {
- return !data[i].disabled;
- })
- );
-
- lines2
- .defined(lines.defined())
- .width(availableWidth)
- .height(availableHeight2)
- .color(
- data
- .map(function(d,i) {
- return d.color || color(d, i);
- })
- .filter(function(d,i) {
- return !data[i].disabled;
- })
- );
+ //Set up interactive layer
+ if (useInteractiveGuideline) {
+ interactiveLayer
+ .width(availableWidth)
+ .height(availableHeight1)
+ .margin({left:margin.left, top:margin.top})
+ .svgContainer(container)
+ .xScale(x);
+ wrap.select(".nv-interactive").call(interactiveLayer);
+ }
- g.select('.nv-context')
- .attr('transform', 'translate(0,' + ( availableHeight1 + margin.bottom + margin2.top) + ')')
+ // Main Chart Component(s)
+ lines
+ .width(availableWidth)
+ .height(availableHeight1)
+ .color(
+ data
+ .map(function(d,i) {
+ return d.color || color(d, i);
+ })
+ .filter(function(d,i) {
+ return !data[i].disabled;
+ })
+ );
- var contextLinesWrap = g.select('.nv-context .nv-linesWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
+ lines2
+ .defined(lines.defined())
+ .width(availableWidth)
+ .height(availableHeight2)
+ .color(
+ data
+ .map(function(d,i) {
+ return d.color || color(d, i);
+ })
+ .filter(function(d,i) {
+ return !data[i].disabled;
+ })
+ );
- d3.transition(contextLinesWrap).call(lines2);
+ g.select('.nv-context')
+ .attr('transform', 'translate(0,' + ( availableHeight1 + margin.bottom + margin2.top) + ')')
- //------------------------------------------------------------
+ var contextLinesWrap = g.select('.nv-context .nv-linesWrap')
+ .datum(data.filter(function(d) { return !d.disabled }))
+ d3.transition(contextLinesWrap).call(lines2);
- /*
- var focusLinesWrap = g.select('.nv-focus .nv-linesWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
+ // Setup Main (Focus) Axes
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight1, 0);
- d3.transition(focusLinesWrap).call(lines);
- */
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksY(availableHeight1/36, data) )
+ .tickSize( -availableWidth, 0);
+ g.select('.nv-focus .nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + availableHeight1 + ')');
- //------------------------------------------------------------
- // Setup Main (Focus) Axes
+ // Setup Brush
+ brush
+ .x(x2)
+ .on('brush', function() {
+ onBrush();
+ });
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight1, 0);
+ if (brushExtent) brush.extent(brushExtent);
- yAxis
- .scale(y)
- .ticks( availableHeight1 / 36 )
- .tickSize( -availableWidth, 0);
+ var brushBG = g.select('.nv-brushBackground').selectAll('g')
+ .data([brushExtent || brush.extent()])
- g.select('.nv-focus .nv-x.nv-axis')
- .attr('transform', 'translate(0,' + availableHeight1 + ')');
+ 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);
- //------------------------------------------------------------
- // Setup Brush
+ var gBrush = g.select('.nv-x.nv-brush')
+ .call(brush);
+ gBrush.selectAll('rect')
+ .attr('height', availableHeight2);
+ gBrush.selectAll('.resize').append('path').attr('d', resizePath);
- brush
- .x(x2)
- .on('brush', function() {
- //When brushing, turn off transitions because chart needs to change immediately.
- var oldTransition = chart.transitionDuration();
- chart.transitionDuration(0);
onBrush();
- chart.transitionDuration(oldTransition);
- });
-
- 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);
-
- var 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);
-
- onBrush();
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Secondary (Context) Axes
-
- x2Axis
- .scale(x2)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight2, 0);
-
- g.select('.nv-context .nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y2.range()[0] + ')');
- d3.transition(g.select('.nv-context .nv-x.nv-axis'))
- .call(x2Axis);
-
- y2Axis
- .scale(y2)
- .ticks( availableHeight2 / 36 )
- .tickSize( -availableWidth, 0);
-
- d3.transition(g.select('.nv-context .nv-y.nv-axis'))
- .call(y2Axis);
-
- g.select('.nv-context .nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y2.range()[0] + ')');
-
- //------------------------------------------------------------
+ // Setup Secondary (Context) Axes
+ x2Axis
+ .scale(x2)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight2, 0);
+
+ g.select('.nv-context .nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y2.range()[0] + ')');
+ d3.transition(g.select('.nv-context .nv-x.nv-axis'))
+ .call(x2Axis);
+
+ y2Axis
+ .scale(y2)
+ ._ticks( nv.utils.calcTicksY(availableHeight2/36, data) )
+ .tickSize( -availableWidth, 0);
+
+ d3.transition(g.select('.nv-context .nv-y.nv-axis'))
+ .call(y2Axis);
+
+ g.select('.nv-context .nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y2.range()[0] + ')');
+
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
+
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
+ interactiveLayer.dispatch.on('elementMousemove', function(e) {
+ lines.clearHighlights();
+ var singlePoint, pointIndex, pointXLocation, allData = [];
+ data
+ .filter(function(series, i) {
+ series.seriesIndex = i;
+ return !series.disabled;
+ })
+ .forEach(function(series,i) {
+ var extent = brush.empty() ? x2.domain() : brush.extent();
+ var currentValues = series.values.filter(function(d,i) {
+ return lines.x()(d,i) >= extent[0] && lines.x()(d,i) <= extent[1];
+ });
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ pointIndex = nv.interactiveBisect(currentValues, e.pointXValue, lines.x());
+ var point = currentValues[pointIndex];
+ var pointYValue = chart.y()(point, pointIndex);
+ if (pointYValue != null) {
+ lines.highlightPoint(i, pointIndex, true);
+ }
+ if (point === undefined) return;
+ if (singlePoint === undefined) singlePoint = point;
+ if (pointXLocation === undefined) pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
+ allData.push({
+ key: series.key,
+ value: chart.y()(point, pointIndex),
+ color: color(series,series.seriesIndex)
+ });
+ });
+ //Highlight the tooltip entry based on which point the mouse is closest to.
+ if (allData.length > 2) {
+ var yValue = chart.yScale().invert(e.mouseY);
+ var domainExtent = Math.abs(chart.yScale().domain()[0] - chart.yScale().domain()[1]);
+ var threshold = 0.03 * domainExtent;
+ var indexToHighlight = nv.nearestValueIndex(allData.map(function(d){return d.value}),yValue,threshold);
+ if (indexToHighlight !== null)
+ allData[indexToHighlight].highlight = true;
+ }
- legend.dispatch.on('stateChange', function(newState) {
- chart.update();
- });
+ var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex));
+ interactiveLayer.tooltip
+ .chartContainer(that.parentNode)
+ .valueFormatter(function(d,i) {
+ return d == null ? "N/A" : yAxis.tickFormat()(d);
+ })
+ .data({
+ value: xValue,
+ index: pointIndex,
+ series: allData
+ })();
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ interactiveLayer.renderGuideLine(pointXLocation);
- //============================================================
-
-
- //============================================================
- // Functions
- //------------------------------------------------------------
-
- // Taken from crossfilter (http://square.github.com/crossfilter/)
- function resizePath(d) {
- 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);
- }
-
-
- function updateBrushBG() {
- if (!brush.empty()) brush.extent(brushExtent);
- brushBG
- .data([brush.empty() ? x2.domain() : brushExtent])
- .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);
});
- }
+ interactiveLayer.dispatch.on("elementMouseout",function(e) {
+ lines.clearHighlights();
+ });
- function onBrush() {
- brushExtent = brush.empty() ? null : brush.extent();
- var extent = brush.empty() ? x2.domain() : brush.extent();
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
+ }
+ chart.update();
+ });
- //The brush extent cannot be less than one. If it is, don't update the line chart.
- if (Math.abs(extent[0] - extent[1]) <= 1) {
- return;
- }
+ //============================================================
+ // Functions
+ //------------------------------------------------------------
+
+ // Taken from crossfilter (http://square.github.com/crossfilter/)
+ function resizePath(d) {
+ 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);
+ }
- dispatch.brush({extent: extent, brush: brush});
+ function updateBrushBG() {
+ if (!brush.empty()) brush.extent(brushExtent);
+ brushBG
+ .data([brush.empty() ? x2.domain() : brushExtent])
+ .each(function(d,i) {
+ var leftWidth = x2(d[0]) - x.range()[0],
+ rightWidth = availableWidth - 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);
+ });
+ }
- updateBrushBG();
- // Update Main (Focus)
- 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];
- })
- }
- })
- );
- focusLinesWrap.transition().duration(transitionDuration).call(lines);
+ function onBrush() {
+ brushExtent = brush.empty() ? null : brush.extent();
+ var extent = brush.empty() ? x2.domain() : brush.extent();
+ //The brush extent cannot be less than one. If it is, don't update the line chart.
+ if (Math.abs(extent[0] - extent[1]) <= 1) {
+ return;
+ }
- // Update Main (Focus) Axes
- g.select('.nv-focus .nv-x.nv-axis').transition().duration(transitionDuration)
- .call(xAxis);
- g.select('.nv-focus .nv-y.nv-axis').transition().duration(transitionDuration)
- .call(yAxis);
- }
+ dispatch.brush({extent: extent, brush: brush});
+
+
+ updateBrushBG();
+
+ // Update Main (Focus)
+ var focusLinesWrap = g.select('.nv-focus .nv-linesWrap')
+ .datum(
+ data
+ .filter(function(d) { return !d.disabled })
+ .map(function(d,i) {
+ return {
+ key: d.key,
+ area: d.area,
+ classed: d.classed,
+ values: d.values.filter(function(d,i) {
+ return lines.x()(d,i) >= extent[0] && lines.x()(d,i) <= extent[1];
+ })
+ }
+ })
+ );
+ focusLinesWrap.transition().duration(transitionDuration).call(lines);
+
+
+ // Update Main (Focus) Axes
+ g.select('.nv-focus .nv-x.nv-axis').transition().duration(transitionDuration)
+ .call(xAxis);
+ g.select('.nv-focus .nv-y.nv-axis').transition().duration(transitionDuration)
+ .call(yAxis);
+ }
+ });
- //============================================================
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ lines.dispatch.on('elementMouseover.tooltip', function(evt) {
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- lines.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
+ lines.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.legend = legend;
- chart.lines = lines;
- chart.lines2 = lines2;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
- chart.x2Axis = x2Axis;
- chart.y2Axis = y2Axis;
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.legend = legend;
+ chart.lines = lines;
+ chart.lines2 = lines2;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.x2Axis = x2Axis;
+ chart.y2Axis = y2Axis;
+ chart.interactiveLayer = interactiveLayer;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ focusHeight: {get: function(){return height2;}, set: function(_){height2=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ brushExtent: {get: function(){return brushExtent;}, set: function(_){brushExtent=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ focusMargin: {get: function(){return margin2;}, set: function(_){
+ margin2.top = _.top !== undefined ? _.top : margin2.top;
+ margin2.right = _.right !== undefined ? _.right : margin2.right;
+ margin2.bottom = _.bottom !== undefined ? _.bottom : margin2.bottom;
+ margin2.left = _.left !== undefined ? _.left : margin2.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ // line color is handled above?
+ }},
+ interpolate: {get: function(){return lines.interpolate();}, set: function(_){
+ lines.interpolate(_);
+ lines2.interpolate(_);
+ }},
+ xTickFormat: {get: function(){return xAxis.tickFormat();}, set: function(_){
+ xAxis.tickFormat(_);
+ x2Axis.tickFormat(_);
+ }},
+ yTickFormat: {get: function(){return yAxis.tickFormat();}, set: function(_){
+ yAxis.tickFormat(_);
+ y2Axis.tickFormat(_);
+ }},
+ duration: {get: function(){return transitionDuration;}, set: function(_){
+ transitionDuration=_;
+ yAxis.duration(transitionDuration);
+ y2Axis.duration(transitionDuration);
+ xAxis.duration(transitionDuration);
+ x2Axis.duration(transitionDuration);
+ }},
+ x: {get: function(){return lines.x();}, set: function(_){
+ lines.x(_);
+ lines2.x(_);
+ }},
+ y: {get: function(){return lines.y();}, set: function(_){
+ lines.y(_);
+ lines2.y(_);
+ }},
+ useInteractiveGuideline: {get: function(){return useInteractiveGuideline;}, set: function(_){
+ useInteractiveGuideline = _;
+ if (useInteractiveGuideline) {
+ lines.interactive(false);
+ lines.useVoronoi(false);
+ }
+ }}
+ });
- d3.rebind(chart, lines, 'defined', 'isArea', 'size', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi', 'id');
+ nv.utils.inheritOptions(chart, lines);
+ nv.utils.initOptions(chart);
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return lines.x;
- lines.x(_);
- lines2.x(_);
return chart;
- };
+};
- chart.y = function(_) {
- if (!arguments.length) return lines.y;
- lines.y(_);
- lines2.y(_);
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+nv.models.multiBar = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 960
+ , height = 500
+ , x = d3.scale.ordinal()
+ , y = d3.scale.linear()
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container = null
+ , 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
+ , clipEdge = true
+ , stacked = false
+ , stackOffset = 'zero' // options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function
+ , color = nv.utils.defaultColor()
+ , hideable = false
+ , barColor = null // adding the ability to set the color for each rather than the whole group
+ , disabled // used in conjunction with barColor to communicate from multiBarHorizontalChart what series are disabled
+ , duration = 500
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , groupSpacing = 0.1
+ , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
+ ;
- chart.margin2 = function(_) {
- if (!arguments.length) return margin2;
- margin2 = _;
- return chart;
- };
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ var x0, y0 //used to store previous scales
+ , renderWatch = nv.utils.renderWatch(dispatch, duration)
+ ;
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ var last_datalength = 0;
+
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
+
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+ var nonStackableCount = 0;
+ // This function defines the requirements for render complete
+ var endFn = function(d, i) {
+ if (d.series === data.length - 1 && i === data[0].values.length - 1)
+ return true;
+ return false;
+ };
- chart.height2 = function(_) {
- if (!arguments.length) return height2;
- height2 = _;
- return chart;
- };
+ if(hideable && data.length) hideable = [{
+ values: data[0].values.map(function(d) {
+ return {
+ x: d.x,
+ y: 0,
+ series: d.series,
+ size: 0.01
+ };}
+ )}];
+
+ if (stacked) {
+ var parsed = d3.layout.stack()
+ .offset(stackOffset)
+ .values(function(d){ return d.values })
+ .y(getY)
+ (!data.length && hideable ? hideable : data);
+
+ parsed.forEach(function(series, i){
+ // if series is non-stackable, use un-parsed data
+ if (series.nonStackable) {
+ data[i].nonStackableSeries = nonStackableCount++;
+ parsed[i] = data[i];
+ } else {
+ // don't stack this seires on top of the nonStackable seriees
+ if (i > 0 && parsed[i - 1].nonStackable){
+ parsed[i].values.map(function(d,j){
+ d.y0 -= parsed[i - 1].values[j].y;
+ d.y1 = d.y0 + d.y;
+ });
+ }
+ }
+ });
+ data = parsed;
+ }
+ //add series index and key to each data point for reference
+ data.forEach(function(series, i) {
+ series.values.forEach(function(point) {
+ point.series = i;
+ point.key = series.key;
+ });
+ });
- chart.color = function(_) {
- if (!arguments.length) return color;
- color =nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
+ // HACK for negative value stacking
+ if (stacked) {
+ data[0].values.map(function(d,i) {
+ var posBase = 0, negBase = 0;
+ data.map(function(d, idx) {
+ if (!data[idx].nonStackable) {
+ var f = d.values[i]
+ f.size = Math.abs(f.y);
+ if (f.y<0) {
+ f.y1 = negBase;
+ negBase = negBase - f.size;
+ } else
+ {
+ f.y1 = f.size + posBase;
+ posBase = posBase + f.size;
+ }
+ }
+
+ });
+ });
+ }
+ // Setup Scales
+ // remap and flatten the data for use in calculating the scales' domains
+ var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
+ data.map(function(d, idx) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d,i), y: getY(d,i), y0: d.y0, y1: d.y1, idx:idx }
+ })
+ });
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
+ x.domain(xDomain || d3.merge(seriesData).map(function(d) { return d.x }))
+ .rangeBands(xRange || [0, availableWidth], groupSpacing);
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ y.domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) {
+ var domain = d.y;
+ // increase the domain range if this series is stackable
+ if (stacked && !data[d.idx].nonStackable) {
+ if (d.y > 0){
+ domain = d.y1
+ } else {
+ domain = d.y1 + d.y
+ }
+ }
+ return domain;
+ }).concat(forceY)))
+ .range(yRange || [availableHeight, 0]);
+
+ // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
+ if (x.domain()[0] === x.domain()[1])
+ x.domain()[0] ?
+ x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
+ : x.domain([-1,1]);
+
+ 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])
+ : y.domain([-1,1]);
+
+ x0 = x0 || x;
+ y0 = y0 || y;
+
+ // Setup containers and skeleton of chart
+ var wrap = container.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');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-groups');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-edge-clip-' + id)
+ .append('rect');
+ wrap.select('#nv-edge-clip-' + id + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', availableHeight);
+
+ g.attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
+
+ var groups = wrap.select('.nv-groups').selectAll('.nv-group')
+ .data(function(d) { return d }, function(d,i) { return i });
+ groups.enter().append('g')
+ .style('stroke-opacity', 1e-6)
+ .style('fill-opacity', 1e-6);
+
+ var exitTransition = renderWatch
+ .transition(groups.exit().selectAll('rect.nv-bar'), 'multibarExit', Math.min(100, duration))
+ .attr('y', function(d, i, j) {
+ var yVal = y0(0) || 0;
+ if (stacked) {
+ if (data[d.series] && !data[d.series].nonStackable) {
+ yVal = y0(d.y0);
+ }
+ }
+ return yVal;
+ })
+ .attr('height', 0)
+ .remove();
+ if (exitTransition.delay)
+ exitTransition.delay(function(d,i) {
+ var delay = i * (duration / (last_datalength + 1)) - i;
+ return delay;
+ });
+ groups
+ .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(d, i) })
+ .style('stroke', function(d,i){ return color(d, i) });
+ groups
+ .style('stroke-opacity', 1)
+ .style('fill-opacity', 0.75);
+
+ var bars = groups.selectAll('rect.nv-bar')
+ .data(function(d) { return (hideable && !data.length) ? hideable.values : d.values });
+ bars.exit().remove();
+
+ var barsEnter = bars.enter().append('rect')
+ .attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
+ .attr('x', function(d,i,j) {
+ return stacked && !data[j].nonStackable ? 0 : (j * x.rangeBand() / data.length )
+ })
+ .attr('y', function(d,i,j) { return y0(stacked && !data[j].nonStackable ? d.y0 : 0) || 0 })
+ .attr('height', 0)
+ .attr('width', function(d,i,j) { return x.rangeBand() / (stacked && !data[j].nonStackable ? 1 : data.length) })
+ .attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',0)'; })
+ ;
+ bars
+ .style('fill', function(d,i,j){ return color(d, j, i); })
+ .style('stroke', function(d,i,j){ return color(d, j, i); })
+ .on('mouseover', function(d,i) { //TODO: figure out why j works above, but not here
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mouseout', function(d,i) {
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mousemove', function(d,i) {
+ dispatch.elementMousemove({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('click', function(d,i) {
+ dispatch.elementClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ })
+ .on('dblclick', function(d,i) {
+ dispatch.elementDblClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ });
+ bars
+ .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 (barColor) {
+ if (!disabled) disabled = data.map(function() { return true });
+ bars
+ .style('fill', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); })
+ .style('stroke', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); });
+ }
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ var barSelection =
+ bars.watchTransition(renderWatch, 'multibar', Math.min(250, duration))
+ .delay(function(d,i) {
+ return i * duration / data[0].values.length;
+ });
+ if (stacked){
+ barSelection
+ .attr('y', function(d,i,j) {
+ var yVal = 0;
+ // if stackable, stack it on top of the previous series
+ if (!data[j].nonStackable) {
+ yVal = y(d.y1);
+ } else {
+ if (getY(d,i) < 0){
+ yVal = y(0);
+ } else {
+ if (y(0) - y(getY(d,i)) < -1){
+ yVal = y(0) - 1;
+ } else {
+ yVal = y(getY(d, i)) || 0;
+ }
+ }
+ }
+ return yVal;
+ })
+ .attr('height', function(d,i,j) {
+ if (!data[j].nonStackable) {
+ return Math.max(Math.abs(y(d.y+d.y0) - y(d.y0)), 0);
+ } else {
+ return Math.max(Math.abs(y(getY(d,i)) - y(0)), 0) || 0;
+ }
+ })
+ .attr('x', function(d,i,j) {
+ var width = 0;
+ if (data[j].nonStackable) {
+ width = d.series * x.rangeBand() / data.length;
+ if (data.length !== nonStackableCount){
+ width = data[j].nonStackableSeries * x.rangeBand()/(nonStackableCount*2);
+ }
+ }
+ return width;
+ })
+ .attr('width', function(d,i,j){
+ if (!data[j].nonStackable) {
+ return x.rangeBand();
+ } else {
+ // if all series are nonStacable, take the full width
+ var width = (x.rangeBand() / nonStackableCount);
+ // otherwise, nonStackable graph will be only taking the half-width
+ // of the x rangeBand
+ if (data.length !== nonStackableCount) {
+ width = x.rangeBand()/(nonStackableCount*2);
+ }
+ return width;
+ }
+ });
+ }
+ else {
+ barSelection
+ .attr('x', function(d,i) {
+ return d.series * x.rangeBand() / data.length;
+ })
+ .attr('width', x.rangeBand() / data.length)
+ .attr('y', function(d,i) {
+ return getY(d,i) < 0 ?
+ y(0) :
+ y(0) - y(getY(d,i)) < 1 ?
+ y(0) - 1 :
+ y(getY(d,i)) || 0;
+ })
+ .attr('height', function(d,i) {
+ return Math.max(Math.abs(y(getY(d,i)) - y(0)),1) || 0;
+ });
+ }
- chart.interpolate = function(_) {
- if (!arguments.length) return lines.interpolate();
- lines.interpolate(_);
- lines2.interpolate(_);
- return chart;
- };
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ // keep track of the last data value length for transition calculations
+ if (data[0] && data[0].values) {
+ last_datalength = data[0].values.length;
+ }
- // Chart has multiple similar Axes, to prevent code duplication, probably need to link all axis functions manually like below
- chart.xTickFormat = function(_) {
- if (!arguments.length) return xAxis.tickFormat();
- xAxis.tickFormat(_);
- x2Axis.tickFormat(_);
- return chart;
- };
+ });
- chart.yTickFormat = function(_) {
- if (!arguments.length) return yAxis.tickFormat();
- yAxis.tickFormat(_);
- y2Axis.tickFormat(_);
- return chart;
- };
-
- chart.brushExtent = function(_) {
- if (!arguments.length) return brushExtent;
- brushExtent = _;
- return chart;
- };
+ renderWatch.renderEnd('multibar immediate');
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
+ return chart;
+ }
- //============================================================
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ stacked: {get: function(){return stacked;}, set: function(_){stacked=_;}},
+ stackOffset: {get: function(){return stackOffset;}, set: function(_){stackOffset=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+ disabled: {get: function(){return disabled;}, set: function(_){disabled=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ hideable: {get: function(){return hideable;}, set: function(_){hideable=_;}},
+ groupSpacing:{get: function(){return groupSpacing;}, set: function(_){groupSpacing=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ barColor: {get: function(){return barColor;}, set: function(_){
+ barColor = _ ? nv.utils.getColor(_) : null;
+ }}
+ });
+ nv.utils.initOptions(chart);
- return chart;
-}
+ return chart;
+};
+nv.models.multiBarChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var multibar = nv.models.multiBar()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend()
+ , controls = nv.models.legend()
+ , tooltip = nv.models.tooltip()
+ ;
-nv.models.linePlusBarWithFocusChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var lines = nv.models.line()
- , lines2 = nv.models.line()
- , bars = nv.models.historicalBar()
- , bars2 = nv.models.historicalBar()
- , xAxis = nv.models.axis()
- , x2Axis = nv.models.axis()
- , y1Axis = nv.models.axis()
- , y2Axis = nv.models.axis()
- , y3Axis = nv.models.axis()
- , y4Axis = nv.models.axis()
- , legend = nv.models.legend()
- , brush = d3.svg.brush()
- ;
+ var margin = {top: 30, right: 20, bottom: 50, left: 60}
+ , width = null
+ , height = null
+ , color = nv.utils.defaultColor()
+ , showControls = true
+ , controlLabels = {}
+ , showLegend = true
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , reduceXTicks = true // if false a tick will show for every data point
+ , staggerLabels = false
+ , wrapLabels = false
+ , rotateLabels = 0
+ , x //can be accessed via chart.xScale()
+ , y //can be accessed via chart.yScale()
+ , state = nv.utils.state()
+ , defaultState = null
+ , noData = null
+ , dispatch = d3.dispatch('stateChange', 'changeState', 'renderEnd')
+ , controlWidth = function() { return showControls ? 180 : 0 }
+ , duration = 250
+ ;
- var margin = {top: 30, right: 30, bottom: 30, left: 60}
- , margin2 = {top: 0, right: 30, bottom: 20, left: 60}
- , width = null
- , height = null
- , height2 = 100
- , getX = function(d) { return d.x }
- , getY = function(d) { return d.y }
- , color = nv.utils.defaultColor()
- , showLegend = true
- , extent
- , brushExtent = null
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>';
- }
- , x
- , x2
- , y1
- , y2
- , y3
- , y4
- , noData = "No Data Available."
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'brush')
- , transitionDuration = 0
- ;
+ state.stacked = false // DEPRECATED Maintained for backward compatibility
- lines
- .clipEdge(true)
- ;
- lines2
- .interactive(false)
- ;
- xAxis
- .orient('bottom')
- .tickPadding(5)
- ;
- y1Axis
- .orient('left')
- ;
- y2Axis
- .orient('right')
- ;
- x2Axis
- .orient('bottom')
- .tickPadding(5)
- ;
- y3Axis
- .orient('left')
+ multibar.stacked(false);
+ xAxis
+ .orient('bottom')
+ .tickPadding(7)
+ .showMaxMin(false)
+ .tickFormat(function(d) { return d })
;
- y4Axis
- .orient('right')
+ yAxis
+ .orient((rightAlignYAxis) ? 'right' : 'left')
+ .tickFormat(d3.format(',.1f'))
;
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- if (extent) {
- e.pointIndex += Math.ceil(extent[0]);
- }
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(lines.x()(e.point, e.pointIndex)),
- y = (e.series.bar ? y1Axis : y2Axis).tickFormat()(lines.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
- };
-
- //------------------------------------------------------------
-
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight1 = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom - height2,
- availableHeight2 = height2 - margin2.top - margin2.bottom;
-
- chart.update = function() { container.transition().duration(transitionDuration).call(chart); };
- chart.container = this;
-
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight1 / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- var dataBars = data.filter(function(d) { return !d.disabled && d.bar });
- var dataLines = data.filter(function(d) { return !d.bar }); // removed the !d.disabled clause here to fix Issue #240
-
- x = bars.xScale();
- x2 = x2Axis.scale();
- y1 = bars.yScale();
- y2 = lines.yScale();
- y3 = bars2.yScale();
- y4 = lines2.yScale();
-
- var series1 = data
- .filter(function(d) { return !d.disabled && d.bar })
- .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) {
- return d.values.map(function(d,i) {
- return { x: getX(d,i), y: getY(d,i) }
- })
+ tooltip
+ .duration(0)
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ })
+ .headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
});
- x .range([0, availableWidth]);
-
- x2 .domain(d3.extent(d3.merge(series1.concat(series2)), function(d) { return d.x } ))
- .range([0, availableWidth]);
-
+ controls.updateState(false);
- //------------------------------------------------------------
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ var renderWatch = nv.utils.renderWatch(dispatch);
+ var stacked = false;
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.selectAll('g.nv-wrap.nv-linePlusBar').data([data]);
- var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-linePlusBar').append('g');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-legendWrap');
-
- var focusEnter = gEnter.append('g').attr('class', 'nv-focus');
- focusEnter.append('g').attr('class', 'nv-x nv-axis');
- focusEnter.append('g').attr('class', 'nv-y1 nv-axis');
- focusEnter.append('g').attr('class', 'nv-y2 nv-axis');
- focusEnter.append('g').attr('class', 'nv-barsWrap');
- 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-y1 nv-axis');
- contextEnter.append('g').attr('class', 'nv-y2 nv-axis');
- contextEnter.append('g').attr('class', 'nv-barsWrap');
- contextEnter.append('g').attr('class', 'nv-linesWrap');
- contextEnter.append('g').attr('class', 'nv-brushBackground');
- contextEnter.append('g').attr('class', 'nv-x nv-brush');
-
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Legend
-
- if (showLegend) {
- legend.width( availableWidth / 2 );
-
- 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;
- }))
- .call(legend);
-
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight1 = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom - height2;
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled }),
+ stacked: stacked
+ };
}
+ };
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(' + ( availableWidth / 2 ) + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
-
- //------------------------------------------------------------
- // Context Components
-
- bars2
- .width(availableWidth)
- .height(availableHeight2)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled && data[i].bar }));
-
- lines2
- .width(availableWidth)
- .height(availableHeight2)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled && !data[i].bar }));
-
- var bars2Wrap = g.select('.nv-context .nv-barsWrap')
- .datum(dataBars.length ? dataBars : [{values:[]}]);
-
- var lines2Wrap = g.select('.nv-context .nv-linesWrap')
- .datum(!dataLines[0].disabled ? dataLines : [{values:[]}]);
-
- g.select('.nv-context')
- .attr('transform', 'translate(0,' + ( availableHeight1 + margin.bottom + margin2.top) + ')')
-
- bars2Wrap.transition().call(bars2);
- lines2Wrap.transition().call(lines2);
-
- //------------------------------------------------------------
-
-
-
- //------------------------------------------------------------
- // Setup Brush
-
- brush
- .x(x2)
- .on('brush', onBrush);
-
- 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);
-
- var 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);
-
- //------------------------------------------------------------
-
- //------------------------------------------------------------
- // Setup Secondary (Context) Axes
-
- x2Axis
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight2, 0);
-
- g.select('.nv-context .nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y3.range()[0] + ')');
- g.select('.nv-context .nv-x.nv-axis').transition()
- .call(x2Axis);
-
-
- y3Axis
- .scale(y3)
- .ticks( availableHeight2 / 36 )
- .tickSize( -availableWidth, 0);
-
- g.select('.nv-context .nv-y1.nv-axis')
- .style('opacity', dataBars.length ? 1 : 0)
- .attr('transform', 'translate(0,' + x2.range()[0] + ')');
-
- g.select('.nv-context .nv-y1.nv-axis').transition()
- .call(y3Axis);
-
-
- y4Axis
- .scale(y4)
- .ticks( availableHeight2 / 36 )
- .tickSize(dataBars.length ? 0 : -availableWidth, 0); // Show the y2 rules only if y1 has none
-
- g.select('.nv-context .nv-y2.nv-axis')
- .style('opacity', dataLines.length ? 1 : 0)
- .attr('transform', 'translate(' + x2.range()[1] + ',0)');
-
- g.select('.nv-context .nv-y2.nv-axis').transition()
- .call(y4Axis);
-
- //------------------------------------------------------------
-
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
-
- legend.dispatch.on('stateChange', function(newState) {
- chart.update();
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
-
- //============================================================
-
-
- //============================================================
- // Functions
- //------------------------------------------------------------
-
- // Taken from crossfilter (http://square.github.com/crossfilter/)
- function resizePath(d) {
- 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);
- }
-
-
- function updateBrushBG() {
- if (!brush.empty()) brush.extent(brushExtent);
- brushBG
- .data([brush.empty() ? x2.domain() : brushExtent])
- .each(function(d,i) {
- var leftWidth = x2(d[0]) - x2.range()[0],
- rightWidth = x2.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);
- });
- }
-
-
- function onBrush() {
- brushExtent = brush.empty() ? null : brush.extent();
- extent = brush.empty() ? x2.domain() : brush.extent();
-
-
- dispatch.brush({extent: extent, brush: brush});
-
- updateBrushBG();
-
-
- //------------------------------------------------------------
- // Prepare Main (Focus) Bars and Lines
-
- bars
- .width(availableWidth)
- .height(availableHeight1)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled && data[i].bar }));
-
-
- lines
- .width(availableWidth)
- .height(availableHeight1)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled && !data[i].bar }));
-
- var focusBarsWrap = g.select('.nv-focus .nv-barsWrap')
- .datum(!dataBars.length ? [{values:[]}] :
- dataBars
- .map(function(d,i) {
- return {
- key: d.key,
- values: d.values.filter(function(d,i) {
- return bars.x()(d,i) >= extent[0] && bars.x()(d,i) <= extent[1];
- })
- }
- })
- );
-
- var focusLinesWrap = g.select('.nv-focus .nv-linesWrap')
- .datum(dataLines[0].disabled ? [{values:[]}] :
- dataLines
- .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];
- })
- }
- })
- );
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Update Main (Focus) X Axis
-
- if (dataBars.length) {
- x = bars.xScale();
- } else {
- x = lines.xScale();
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.stacked !== undefined)
+ stacked = state.stacked;
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
}
-
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight1, 0);
-
- xAxis.domain([Math.ceil(extent[0]), Math.floor(extent[1])]);
-
- g.select('.nv-x.nv-axis').transition().duration(transitionDuration)
- .call(xAxis);
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Update Main (Focus) Bars and Lines
-
- focusBarsWrap.transition().duration(transitionDuration).call(bars);
- focusLinesWrap.transition().duration(transitionDuration).call(lines);
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup and Update Main (Focus) Y Axes
-
- g.select('.nv-focus .nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y1.range()[0] + ')');
-
-
- y1Axis
- .scale(y1)
- .ticks( availableHeight1 / 36 )
- .tickSize(-availableWidth, 0);
-
- g.select('.nv-focus .nv-y1.nv-axis')
- .style('opacity', dataBars.length ? 1 : 0);
-
-
- y2Axis
- .scale(y2)
- .ticks( availableHeight1 / 36 )
- .tickSize(dataBars.length ? 0 : -availableWidth, 0); // Show the y2 rules only if y1 has none
-
- g.select('.nv-focus .nv-y2.nv-axis')
- .style('opacity', dataLines.length ? 1 : 0)
- .attr('transform', 'translate(' + x.range()[1] + ',0)');
-
- g.select('.nv-focus .nv-y1.nv-axis').transition().duration(transitionDuration)
- .call(y1Axis);
- g.select('.nv-focus .nv-y2.nv-axis').transition().duration(transitionDuration)
- .call(y2Axis);
- }
-
- //============================================================
-
- onBrush();
+ };
- });
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(multibar);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ chart.update = function() {
+ if (duration === 0)
+ container.call(chart);
+ else
+ container.transition()
+ .duration(duration)
+ .call(chart);
+ };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- lines.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- bars.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- bars.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.legend = legend;
- chart.lines = lines;
- chart.lines2 = lines2;
- chart.bars = bars;
- chart.bars2 = bars2;
- chart.xAxis = xAxis;
- chart.x2Axis = x2Axis;
- chart.y1Axis = y1Axis;
- chart.y2Axis = y2Axis;
- chart.y3Axis = y3Axis;
- chart.y4Axis = y4Axis;
-
- d3.rebind(chart, lines, 'defined', 'size', 'clipVoronoi', 'interpolate');
- //TODO: consider rebinding x, y and some other stuff, and simply do soemthign lile bars.x(lines.x()), etc.
- //d3.rebind(chart, lines, 'x', 'y', 'size', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'interactive', 'clipEdge', 'clipVoronoi', 'id');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- lines.x(_);
- bars.x(_);
- return chart;
- };
+ // Display noData message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- lines.y(_);
- bars.y(_);
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ // Setup Scales
+ x = multibar.xScale();
+ y = multibar.yScale();
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ 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');
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
+ // Legend
+ if (showLegend) {
+ legend.width(availableWidth - controlWidth());
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
+ g.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ g.select('.nv-legendWrap')
+ .attr('transform', 'translate(' + controlWidth() + ',' + (-margin.top) +')');
+ }
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ // Controls
+ if (showControls) {
+ var controlsData = [
+ { key: controlLabels.grouped || 'Grouped', disabled: multibar.stacked() },
+ { key: controlLabels.stacked || 'Stacked', disabled: !multibar.stacked() }
+ ];
+
+ controls.width(controlWidth()).color(['#444', '#444', '#444']);
+ g.select('.nv-controlsWrap')
+ .datum(controlsData)
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ .call(controls);
+ }
- chart.brushExtent = function(_) {
- if (!arguments.length) return brushExtent;
- brushExtent = _;
- return chart;
- };
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
+ // Main Chart Component(s)
+ multibar
+ .disabled(data.map(function(series) { return series.disabled }))
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled }));
- //============================================================
+ var barsWrap = g.select('.nv-barsWrap')
+ .datum(data.filter(function(d) { return !d.disabled }));
- return chart;
-}
+ barsWrap.call(multibar);
-nv.models.multiBar = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , x = d3.scale.ordinal()
- , y = d3.scale.linear()
- , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
- , 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
- , clipEdge = true
- , stacked = false
- , stackOffset = 'zero' // options include 'silhouette', 'wiggle', 'expand', 'zero', or a custom function
- , color = nv.utils.defaultColor()
- , hideable = false
- , barColor = null // adding the ability to set the color for each rather than the whole group
- , disabled // used in conjunction with barColor to communicate from multiBarHorizontalChart what series are disabled
- , delay = 1200
- , xDomain
- , yDomain
- , xRange
- , yRange
- , groupSpacing = 0.1
- , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
- ;
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight, 0);
- //============================================================
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y.range()[0] + ')');
+ g.select('.nv-x.nv-axis')
+ .call(xAxis);
+ var xTicks = g.select('.nv-x.nv-axis > g').selectAll('g');
- //============================================================
- // Private Variables
- //------------------------------------------------------------
+ xTicks
+ .selectAll('line, text')
+ .style('opacity', 1)
- var x0, y0 //used to store previous scales
- ;
+ if (staggerLabels) {
+ var getTranslate = function(x,y) {
+ return "translate(" + x + "," + y + ")";
+ };
- //============================================================
+ var staggerUp = 5, staggerDown = 17; //pixels to stagger by
+ // Issue #140
+ xTicks
+ .selectAll("text")
+ .attr('transform', function(d,i,j) {
+ return getTranslate(0, (j % 2 == 0 ? staggerUp : staggerDown));
+ });
+ var totalInBetweenTicks = d3.selectAll(".nv-x.nv-axis .nv-wrap g g text")[0].length;
+ g.selectAll(".nv-x.nv-axis .nv-axisMaxMin text")
+ .attr("transform", function(d,i) {
+ return getTranslate(0, (i === 0 || totalInBetweenTicks % 2 !== 0) ? staggerDown : staggerUp);
+ });
+ }
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
+ if (wrapLabels) {
+ g.selectAll('.tick text')
+ .call(nv.utils.wrapTicks, chart.xAxis.rangeBand())
+ }
- if(hideable && data.length) hideable = [{
- values: data[0].values.map(function(d) {
- return {
- x: d.x,
- y: 0,
- series: d.series,
- size: 0.01
- };}
- )}];
-
- if (stacked)
- data = d3.layout.stack()
- .offset(stackOffset)
- .values(function(d){ return d.values })
- .y(getY)
- (!data.length && hideable ? hideable : data);
-
-
- //add series index to each data point for reference
- data.forEach(function(series, i) {
- series.values.forEach(function(point) {
- point.series = i;
- });
- });
+ if (reduceXTicks)
+ xTicks
+ .filter(function(d,i) {
+ return i % Math.ceil(data[0].values.length / (availableWidth / 100)) !== 0;
+ })
+ .selectAll('text, line')
+ .style('opacity', 0);
+
+ if(rotateLabels)
+ xTicks
+ .selectAll('.tick text')
+ .attr('transform', 'rotate(' + rotateLabels + ' 0,0)')
+ .style('text-anchor', rotateLabels > 0 ? 'start' : 'end');
+
+ g.select('.nv-x.nv-axis').selectAll('g.nv-axisMaxMin text')
+ .style('opacity', 1);
+ }
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
- //------------------------------------------------------------
- // HACK for negative value stacking
- if (stacked)
- data[0].values.map(function(d,i) {
- var posBase = 0, negBase = 0;
- data.map(function(d) {
- var f = d.values[i]
- f.size = Math.abs(f.y);
- if (f.y<0) {
- f.y1 = negBase;
- negBase = negBase - f.size;
- } else
- {
- f.y1 = f.size + posBase;
- posBase = posBase + f.size;
- }
- });
- });
+ g.select('.nv-y.nv-axis')
+ .call(yAxis);
+ }
- //------------------------------------------------------------
- // Setup Scales
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- // remap and flatten the data for use in calculating the scales' domains
- var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
- data.map(function(d) {
- return d.values.map(function(d,i) {
- return { x: getX(d,i), y: getY(d,i), y0: d.y0, y1: d.y1 }
- })
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
});
- x .domain(xDomain || d3.merge(seriesData).map(function(d) { return d.x }))
- .rangeBands(xRange || [0, availableWidth], groupSpacing);
-
- //y .domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return d.y + (stacked ? d.y1 : 0) }).concat(forceY)))
- y .domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return stacked ? (d.y > 0 ? d.y1 : d.y1 + d.y ) : d.y }).concat(forceY)))
- .range(yRange || [availableHeight, 0]);
-
- // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
- if (x.domain()[0] === x.domain()[1])
- x.domain()[0] ?
- x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
- : x.domain([-1,1]);
-
- 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])
- : y.domain([-1,1]);
-
-
- x0 = x0 || x;
- y0 = y0 || y;
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.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');
- var g = wrap.select('g')
-
- gEnter.append('g').attr('class', 'nv-groups');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- //------------------------------------------------------------
-
-
-
- defsEnter.append('clipPath')
- .attr('id', 'nv-edge-clip-' + id)
- .append('rect');
- wrap.select('#nv-edge-clip-' + id + ' rect')
- .attr('width', availableWidth)
- .attr('height', availableHeight);
-
- g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
-
+ controls.dispatch.on('legendClick', function(d,i) {
+ if (!d.disabled) return;
+ controlsData = controlsData.map(function(s) {
+ s.disabled = true;
+ return s;
+ });
+ d.disabled = false;
+ switch (d.key) {
+ case 'Grouped':
+ case controlLabels.grouped:
+ multibar.stacked(false);
+ break;
+ case 'Stacked':
+ case controlLabels.stacked:
+ multibar.stacked(true);
+ break;
+ }
- var groups = wrap.select('.nv-groups').selectAll('.nv-group')
- .data(function(d) { return d }, function(d,i) { return i });
- groups.enter().append('g')
- .style('stroke-opacity', 1e-6)
- .style('fill-opacity', 1e-6);
- groups.exit()
- .transition()
- .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 'nv-group nv-series-' + i })
- .classed('hover', function(d) { return d.hover })
- .style('fill', function(d,i){ return color(d, i) })
- .style('stroke', function(d,i){ return color(d, i) });
- groups
- .transition()
- .style('stroke-opacity', 1)
- .style('fill-opacity', .75);
-
-
- var bars = groups.selectAll('rect.nv-bar')
- .data(function(d) { return (hideable && !data.length) ? hideable.values : d.values });
-
- bars.exit().remove();
-
-
- var barsEnter = bars.enter().append('rect')
- .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 )
- })
- .attr('y', function(d) { return y0(stacked ? d.y0 : 0) })
- .attr('height', 0)
- .attr('width', x.rangeBand() / (stacked ? 1 : data.length) )
- .attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',0)'; })
- ;
- bars
- .style('fill', function(d,i,j){ return color(d, j, i); })
- .style('stroke', function(d,i,j){ return color(d, j, i); })
- .on('mouseover', function(d,i) { //TODO: figure out why j works above, but not here
- d3.select(this).classed('hover', true);
- dispatch.elementMouseover({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (stacked ? data.length / 2 : d.series + .5) / data.length), y(getY(d,i) + (stacked ? d.y0 : 0))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
+ state.stacked = multibar.stacked();
+ dispatch.stateChange(state);
+ chart.update();
});
- })
- .on('mouseout', function(d,i) {
- d3.select(this).classed('hover', false);
- dispatch.elementMouseout({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- })
- .on('click', function(d,i) {
- dispatch.elementClick({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (stacked ? data.length / 2 : d.series + .5) / data.length), y(getY(d,i) + (stacked ? d.y0 : 0))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- d3.event.stopPropagation();
- })
- .on('dblclick', function(d,i) {
- dispatch.elementDblClick({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (stacked ? data.length / 2 : d.series + .5) / data.length), y(getY(d,i) + (stacked ? d.y0 : 0))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- d3.event.stopPropagation();
- });
- bars
- .attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
- .transition()
- .attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',0)'; })
-
- if (barColor) {
- if (!disabled) disabled = data.map(function() { return true });
- bars
- .style('fill', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); })
- .style('stroke', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); });
- }
-
-
- if (stacked)
- bars.transition()
- .delay(function(d,i) {
-
- return i * delay / data[0].values.length;
- })
- .attr('y', function(d,i) {
- return y((stacked ? d.y1 : 0));
- })
- .attr('height', function(d,i) {
- return Math.max(Math.abs(y(d.y + (stacked ? d.y0 : 0)) - y((stacked ? d.y0 : 0))),1);
- })
- .attr('x', function(d,i) {
- return stacked ? 0 : (d.series * x.rangeBand() / data.length )
- })
- .attr('width', x.rangeBand() / (stacked ? 1 : data.length) );
- else
- bars.transition()
- .delay(function(d,i) {
- return i * delay/ data[0].values.length;
- })
- .attr('x', function(d,i) {
- return d.series * x.rangeBand() / data.length
- })
- .attr('width', x.rangeBand() / data.length)
- .attr('y', function(d,i) {
- return getY(d,i) < 0 ?
- y(0) :
- y(0) - y(getY(d,i)) < 1 ?
- y(0) - 1 :
- y(getY(d,i)) || 0;
- })
- .attr('height', function(d,i) {
- return Math.max(Math.abs(y(getY(d,i)) - y(0)),1) || 0;
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
+ state.disabled = e.disabled;
+ }
+ if (typeof e.stacked !== 'undefined') {
+ multibar.stacked(e.stacked);
+ state.stacked = e.stacked;
+ stacked = e.stacked;
+ }
+ chart.update();
});
+ });
+ renderWatch.renderEnd('multibarchart immediate');
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
-
+ multibar.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt.value = chart.x()(evt.data);
+ evt['series'] = {
+ key: evt.data.key,
+ value: chart.y()(evt.data),
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
+ multibar.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
+ multibar.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.dispatch = dispatch;
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.multibar = multibar;
+ chart.legend = legend;
+ chart.controls = controls;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.state = state;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ showControls: {get: function(){return showControls;}, set: function(_){showControls=_;}},
+ controlLabels: {get: function(){return controlLabels;}, set: function(_){controlLabels=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ reduceXTicks: {get: function(){return reduceXTicks;}, set: function(_){reduceXTicks=_;}},
+ rotateLabels: {get: function(){return rotateLabels;}, set: function(_){rotateLabels=_;}},
+ staggerLabels: {get: function(){return staggerLabels;}, set: function(_){staggerLabels=_;}},
+ wrapLabels: {get: function(){return wrapLabels;}, set: function(_){wrapLabels=!!_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ multibar.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ renderWatch.reset(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( rightAlignYAxis ? 'right' : 'left');
+ }},
+ barColor: {get: function(){return multibar.barColor;}, set: function(_){
+ multibar.barColor(_);
+ legend.color(function(d,i) {return d3.rgb('#ccc').darker(i * 1.5).toString();})
+ }}
+ });
- chart.options = nv.utils.optionsFunc.bind(chart);
+ nv.utils.inheritOptions(chart, multibar);
+ nv.utils.initOptions(chart);
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
return chart;
- };
+};
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+nv.models.multiBarHorizontal = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 960
+ , height = 500
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container = null
+ , x = d3.scale.ordinal()
+ , y = d3.scale.linear()
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , getYerr = function(d) { return d.yErr }
+ , 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 = nv.utils.defaultColor()
+ , barColor = null // adding the ability to set the color for each rather than the whole group
+ , disabled // used in conjunction with barColor to communicate from multiBarHorizontalChart what series are disabled
+ , stacked = false
+ , showValues = false
+ , showBarLabels = false
+ , valuePadding = 60
+ , groupSpacing = 0.1
+ , valueFormat = d3.format(',.2f')
+ , delay = 1200
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , duration = 250
+ , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
+ ;
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+
+ var x0, y0; //used to store previous scales
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
+
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
+
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+
+ if (stacked)
+ data = d3.layout.stack()
+ .offset('zero')
+ .values(function(d){ return d.values })
+ .y(getY)
+ (data);
+
+ //add series index and key to each data point for reference
+ data.forEach(function(series, i) {
+ series.values.forEach(function(point) {
+ point.series = i;
+ point.key = series.key;
+ });
+ });
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ // HACK for negative value stacking
+ if (stacked)
+ data[0].values.map(function(d,i) {
+ var posBase = 0, negBase = 0;
+ data.map(function(d) {
+ var f = d.values[i]
+ f.size = Math.abs(f.y);
+ if (f.y<0) {
+ f.y1 = negBase - f.size;
+ negBase = negBase - f.size;
+ } else
+ {
+ f.y1 = posBase;
+ posBase = posBase + f.size;
+ }
+ });
+ });
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
+ // Setup Scales
+ // remap and flatten the data for use in calculating the scales' domains
+ var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
+ data.map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d,i), y: getY(d,i), y0: d.y0, y1: d.y1 }
+ })
+ });
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
+ x.domain(xDomain || d3.merge(seriesData).map(function(d) { return d.x }))
+ .rangeBands(xRange || [0, availableHeight], groupSpacing);
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
+ y.domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return stacked ? (d.y > 0 ? d.y1 + d.y : d.y1 ) : d.y }).concat(forceY)))
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
+ if (showValues && !stacked)
+ y.range(yRange || [(y.domain()[0] < 0 ? valuePadding : 0), availableWidth - (y.domain()[1] > 0 ? valuePadding : 0) ]);
+ else
+ y.range(yRange || [0, availableWidth]);
+
+ x0 = x0 || x;
+ y0 = y0 || d3.scale.linear().domain(y.domain()).range([y(0),y(0)]);
+
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-groups');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ var groups = wrap.select('.nv-groups').selectAll('.nv-group')
+ .data(function(d) { return d }, function(d,i) { return i });
+ groups.enter().append('g')
+ .style('stroke-opacity', 1e-6)
+ .style('fill-opacity', 1e-6);
+ groups.exit().watchTransition(renderWatch, 'multibarhorizontal: exit groups')
+ .style('stroke-opacity', 1e-6)
+ .style('fill-opacity', 1e-6)
+ .remove();
+ groups
+ .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(d, i) })
+ .style('stroke', function(d,i){ return color(d, i) });
+ groups.watchTransition(renderWatch, 'multibarhorizontal: groups')
+ .style('stroke-opacity', 1)
+ .style('fill-opacity', .75);
+
+ var bars = groups.selectAll('g.nv-bar')
+ .data(function(d) { return d.values });
+ bars.exit().remove();
+
+ var barsEnter = bars.enter().append('g')
+ .attr('transform', function(d,i,j) {
+ return 'translate(' + y0(stacked ? d.y0 : 0) + ',' + (stacked ? 0 : (j * x.rangeBand() / data.length ) + x(getX(d,i))) + ')'
+ });
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
+ 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);
+ dispatch.elementMouseover({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mouseout', function(d,i) {
+ d3.select(this).classed('hover', false);
+ dispatch.elementMouseout({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mouseout', function(d,i) {
+ dispatch.elementMouseout({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mousemove', function(d,i) {
+ dispatch.elementMousemove({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('click', function(d,i) {
+ dispatch.elementClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ })
+ .on('dblclick', function(d,i) {
+ dispatch.elementDblClick({
+ data: d,
+ index: i,
+ color: d3.select(this).style("fill")
+ });
+ d3.event.stopPropagation();
+ });
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
+ if (getYerr(data[0],0)) {
+ barsEnter.append('polyline');
+
+ bars.select('polyline')
+ .attr('fill', 'none')
+ .attr('points', function(d,i) {
+ var xerr = getYerr(d,i)
+ , mid = 0.8 * x.rangeBand() / ((stacked ? 1 : data.length) * 2);
+ xerr = xerr.length ? xerr : [-Math.abs(xerr), Math.abs(xerr)];
+ xerr = xerr.map(function(e) { return y(e) - y(0); });
+ var a = [[xerr[0],-mid], [xerr[0],mid], [xerr[0],0], [xerr[1],0], [xerr[1],-mid], [xerr[1],mid]];
+ return a.map(function (path) { return path.join(',') }).join(' ');
+ })
+ .attr('transform', function(d,i) {
+ var mid = x.rangeBand() / ((stacked ? 1 : data.length) * 2);
+ return 'translate(' + (getY(d,i) < 0 ? 0 : y(getY(d,i)) - y(0)) + ', ' + mid + ')'
+ });
+ }
- chart.forceY = function(_) {
- if (!arguments.length) return forceY;
- forceY = _;
- return chart;
- };
+ barsEnter.append('text');
+
+ if (showValues && !stacked) {
+ bars.select('text')
+ .attr('text-anchor', function(d,i) { return getY(d,i) < 0 ? 'end' : 'start' })
+ .attr('y', x.rangeBand() / (data.length * 2))
+ .attr('dy', '.32em')
+ .text(function(d,i) {
+ var t = valueFormat(getY(d,i))
+ , yerr = getYerr(d,i);
+ if (yerr === undefined)
+ return t;
+ if (!yerr.length)
+ return t + '±' + valueFormat(Math.abs(yerr));
+ return t + '+' + valueFormat(Math.abs(yerr[1])) + '-' + valueFormat(Math.abs(yerr[0]));
+ });
+ bars.watchTransition(renderWatch, 'multibarhorizontal: bars')
+ .select('text')
+ .attr('x', function(d,i) { return getY(d,i) < 0 ? -4 : y(getY(d,i)) - y(0) + 4 })
+ } else {
+ bars.selectAll('text').text('');
+ }
- chart.stacked = function(_) {
- if (!arguments.length) return stacked;
- stacked = _;
- return chart;
- };
+ if (showBarLabels && !stacked) {
+ barsEnter.append('text').classed('nv-bar-label',true);
+ bars.select('text.nv-bar-label')
+ .attr('text-anchor', function(d,i) { return getY(d,i) < 0 ? 'start' : 'end' })
+ .attr('y', x.rangeBand() / (data.length * 2))
+ .attr('dy', '.32em')
+ .text(function(d,i) { return getX(d,i) });
+ bars.watchTransition(renderWatch, 'multibarhorizontal: bars')
+ .select('text.nv-bar-label')
+ .attr('x', function(d,i) { return getY(d,i) < 0 ? y(0) - y(getY(d,i)) + 4 : -4 });
+ }
+ else {
+ bars.selectAll('text.nv-bar-label').text('');
+ }
- chart.stackOffset = function(_) {
- if (!arguments.length) return stackOffset;
- stackOffset = _;
- return chart;
- };
+ bars
+ .attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
- chart.clipEdge = function(_) {
- if (!arguments.length) return clipEdge;
- clipEdge = _;
- return chart;
- };
+ if (barColor) {
+ if (!disabled) disabled = data.map(function() { return true });
+ bars
+ .style('fill', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); })
+ .style('stroke', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); });
+ }
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
+ if (stacked)
+ bars.watchTransition(renderWatch, 'multibarhorizontal: bars')
+ .attr('transform', function(d,i) {
+ return 'translate(' + y(d.y1) + ',' + x(getX(d,i)) + ')'
+ })
+ .select('rect')
+ .attr('width', function(d,i) {
+ return Math.abs(y(getY(d,i) + d.y0) - y(d.y0)) || 0
+ })
+ .attr('height', x.rangeBand() );
+ else
+ bars.watchTransition(renderWatch, 'multibarhorizontal: bars')
+ .attr('transform', function(d,i) {
+ //TODO: stacked must be all positive or all negative, not both?
+ return 'translate(' +
+ (getY(d,i) < 0 ? y(getY(d,i)) : y(0))
+ + ',' +
+ (d.series * x.rangeBand() / data.length
+ +
+ x(getX(d,i)) )
+ + ')'
+ })
+ .select('rect')
+ .attr('height', x.rangeBand() / data.length )
+ .attr('width', function(d,i) {
+ return Math.max(Math.abs(y(getY(d,i)) - y(0)),1) || 0
+ });
- chart.barColor = function(_) {
- if (!arguments.length) return barColor;
- barColor = nv.utils.getColor(_);
- return chart;
- };
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
- chart.disabled = function(_) {
- if (!arguments.length) return disabled;
- disabled = _;
- return chart;
- };
+ });
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
+ renderWatch.renderEnd('multibarHorizontal immediate');
+ return chart;
+ }
- chart.hideable = function(_) {
- if (!arguments.length) return hideable;
- hideable = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ yErr: {get: function(){return getYerr;}, set: function(_){getYerr=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ stacked: {get: function(){return stacked;}, set: function(_){stacked=_;}},
+ showValues: {get: function(){return showValues;}, set: function(_){showValues=_;}},
+ // this shows the group name, seems pointless?
+ //showBarLabels: {get: function(){return showBarLabels;}, set: function(_){showBarLabels=_;}},
+ disabled: {get: function(){return disabled;}, set: function(_){disabled=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ valueFormat: {get: function(){return valueFormat;}, set: function(_){valueFormat=_;}},
+ valuePadding: {get: function(){return valuePadding;}, set: function(_){valuePadding=_;}},
+ groupSpacing:{get: function(){return groupSpacing;}, set: function(_){groupSpacing=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ barColor: {get: function(){return barColor;}, set: function(_){
+ barColor = _ ? nv.utils.getColor(_) : null;
+ }}
+ });
- chart.delay = function(_) {
- if (!arguments.length) return delay;
- delay = _;
- return chart;
- };
+ nv.utils.initOptions(chart);
- chart.groupSpacing = function(_) {
- if (!arguments.length) return groupSpacing;
- groupSpacing = _;
return chart;
- };
-
- //============================================================
+};
+nv.models.multiBarHorizontalChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var multibar = nv.models.multiBarHorizontal()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend().height(30)
+ , controls = nv.models.legend().height(30)
+ , tooltip = nv.models.tooltip()
+ ;
- return chart;
-}
+ var margin = {top: 30, right: 20, bottom: 50, left: 60}
+ , width = null
+ , height = null
+ , color = nv.utils.defaultColor()
+ , showControls = true
+ , controlLabels = {}
+ , showLegend = true
+ , showXAxis = true
+ , showYAxis = true
+ , stacked = false
+ , x //can be accessed via chart.xScale()
+ , y //can be accessed via chart.yScale()
+ , state = nv.utils.state()
+ , defaultState = null
+ , noData = null
+ , dispatch = d3.dispatch('stateChange', 'changeState','renderEnd')
+ , controlWidth = function() { return showControls ? 180 : 0 }
+ , duration = 250
+ ;
-nv.models.multiBarChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var multibar = nv.models.multiBar()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- , controls = nv.models.legend()
- ;
+ state.stacked = false; // DEPRECATED Maintained for backward compatibility
- var margin = {top: 30, right: 20, bottom: 50, left: 60}
- , width = null
- , height = null
- , color = nv.utils.defaultColor()
- , showControls = true
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , reduceXTicks = true // if false a tick will show for every data point
- , staggerLabels = false
- , rotateLabels = 0
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' on ' + x + '</p>'
- }
- , x //can be accessed via chart.xScale()
- , y //can be accessed via chart.yScale()
- , state = { stacked: false }
- , defaultState = null
- , noData = "No Data Available."
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , controlWidth = function() { return showControls ? 180 : 0 }
- , transitionDuration = 250
- ;
+ multibar.stacked(stacked);
- multibar
- .stacked(false)
- ;
- xAxis
- .orient('bottom')
- .tickPadding(7)
- .highlightZero(true)
- .showMaxMin(false)
- .tickFormat(function(d) { return d })
+ xAxis
+ .orient('left')
+ .tickPadding(5)
+ .showMaxMin(false)
+ .tickFormat(function(d) { return d })
;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- .tickFormat(d3.format(',.1f'))
+ yAxis
+ .orient('bottom')
+ .tickFormat(d3.format(',.1f'))
;
- controls.updateState(false);
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(multibar.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(multibar.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
- };
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ tooltip
+ .duration(0)
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ })
+ .headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ });
- chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
- chart.container = this;
+ controls.updateState(false);
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled }),
+ stacked: stacked
+ };
}
- }
- //------------------------------------------------------------
- // Display noData message if there's nothing to show.
-
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = multibar.xScale();
- y = multibar.yScale();
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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');
- var g = wrap.select('g');
-
- 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');
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Legend
-
- if (showLegend) {
- legend.width(availableWidth - controlWidth());
-
- if (multibar.barColor())
- data.forEach(function(series,i) {
- series.color = d3.rgb('#ccc').darker(i * 1.5).toString();
- })
-
- 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;
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.stacked !== undefined)
+ stacked = state.stacked;
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
}
+ };
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(' + controlWidth() + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Controls
-
- if (showControls) {
- var controlsData = [
- { key: 'Grouped', disabled: multibar.stacked() },
- { key: 'Stacked', disabled: !multibar.stacked() }
- ];
-
- controls.width(controlWidth()).color(['#444', '#444', '#444']);
- g.select('.nv-controlsWrap')
- .datum(controlsData)
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- .call(controls);
- }
-
- //------------------------------------------------------------
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
+
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(multibar);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ chart.update = function() { container.transition().duration(duration).call(chart) };
+ chart.container = this;
+
+ stacked = multibar.stacked();
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ // Setup Scales
+ x = multibar.xScale();
+ y = multibar.yScale();
+
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-x nv-axis');
+ gEnter.append('g').attr('class', 'nv-y nv-axis')
+ .append('g').attr('class', 'nv-zeroLine')
+ .append('line');
+ gEnter.append('g').attr('class', 'nv-barsWrap');
+ gEnter.append('g').attr('class', 'nv-legendWrap');
+ gEnter.append('g').attr('class', 'nv-controlsWrap');
+
+ // Legend
+ if (showLegend) {
+ legend.width(availableWidth - controlWidth());
+
+ g.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
+
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
+ g.select('.nv-legendWrap')
+ .attr('transform', 'translate(' + controlWidth() + ',' + (-margin.top) +')');
+ }
- //------------------------------------------------------------
- // Main Chart Component(s)
+ // Controls
+ if (showControls) {
+ var controlsData = [
+ { key: controlLabels.grouped || 'Grouped', disabled: multibar.stacked() },
+ { key: controlLabels.stacked || 'Stacked', disabled: !multibar.stacked() }
+ ];
+
+ controls.width(controlWidth()).color(['#444', '#444', '#444']);
+ g.select('.nv-controlsWrap')
+ .datum(controlsData)
+ .attr('transform', 'translate(0,' + (-margin.top) +')')
+ .call(controls);
+ }
- multibar
- .disabled(data.map(function(series) { return series.disabled }))
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }))
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ // Main Chart Component(s)
+ multibar
+ .disabled(data.map(function(series) { return series.disabled }))
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled }));
- var barsWrap = g.select('.nv-barsWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
+ var barsWrap = g.select('.nv-barsWrap')
+ .datum(data.filter(function(d) { return !d.disabled }));
- barsWrap.transition().call(multibar);
+ barsWrap.transition().call(multibar);
- //------------------------------------------------------------
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksY(availableHeight/24, data) )
+ .tickSize(-availableWidth, 0);
+ g.select('.nv-x.nv-axis').call(xAxis);
- //------------------------------------------------------------
- // Setup Axes
+ var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight, 0);
+ xTicks
+ .selectAll('line, text');
+ }
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y.range()[0] + ')');
- g.select('.nv-x.nv-axis').transition()
- .call(xAxis);
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize( -availableHeight, 0);
- var xTicks = g.select('.nv-x.nv-axis > g').selectAll('g');
+ g.select('.nv-y.nv-axis')
+ .attr('transform', 'translate(0,' + availableHeight + ')');
+ g.select('.nv-y.nv-axis').call(yAxis);
+ }
- xTicks
- .selectAll('line, text')
- .style('opacity', 1)
+ // Zero line
+ g.select(".nv-zeroLine line")
+ .attr("x1", y(0))
+ .attr("x2", y(0))
+ .attr("y1", 0)
+ .attr("y2", -availableHeight)
+ ;
- if (staggerLabels) {
- var getTranslate = function(x,y) {
- return "translate(" + x + "," + y + ")";
- };
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- var staggerUp = 5, staggerDown = 17; //pixels to stagger by
- // Issue #140
- xTicks
- .selectAll("text")
- .attr('transform', function(d,i,j) {
- return getTranslate(0, (j % 2 == 0 ? staggerUp : staggerDown));
- });
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
- var totalInBetweenTicks = d3.selectAll(".nv-x.nv-axis .nv-wrap g g text")[0].length;
- g.selectAll(".nv-x.nv-axis .nv-axisMaxMin text")
- .attr("transform", function(d,i) {
- return getTranslate(0, (i === 0 || totalInBetweenTicks % 2 !== 0) ? staggerDown : staggerUp);
+ controls.dispatch.on('legendClick', function(d,i) {
+ if (!d.disabled) return;
+ controlsData = controlsData.map(function(s) {
+ s.disabled = true;
+ return s;
});
- }
-
- if (reduceXTicks)
- xTicks
- .filter(function(d,i) {
- return i % Math.ceil(data[0].values.length / (availableWidth / 100)) !== 0;
- })
- .selectAll('text, line')
- .style('opacity', 0);
-
- if(rotateLabels)
- xTicks
- .selectAll('.tick text')
- .attr('transform', 'rotate(' + rotateLabels + ' 0,0)')
- .style('text-anchor', rotateLabels > 0 ? 'start' : 'end');
-
- g.select('.nv-x.nv-axis').selectAll('g.nv-axisMaxMin text')
- .style('opacity', 1);
- }
-
-
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
+ d.disabled = false;
- g.select('.nv-y.nv-axis').transition()
- .call(yAxis);
- }
+ switch (d.key) {
+ case 'Grouped':
+ multibar.stacked(false);
+ break;
+ case 'Stacked':
+ multibar.stacked(true);
+ break;
+ }
+ state.stacked = multibar.stacked();
+ dispatch.stateChange(state);
+ stacked = multibar.stacked();
- //------------------------------------------------------------
+ chart.update();
+ });
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ state.disabled = e.disabled;
+ }
- legend.dispatch.on('stateChange', function(newState) {
- state = newState;
- dispatch.stateChange(state);
- chart.update();
- });
+ if (typeof e.stacked !== 'undefined') {
+ multibar.stacked(e.stacked);
+ state.stacked = e.stacked;
+ stacked = e.stacked;
+ }
- controls.dispatch.on('legendClick', function(d,i) {
- if (!d.disabled) return;
- controlsData = controlsData.map(function(s) {
- s.disabled = true;
- return s;
+ chart.update();
+ });
});
- d.disabled = false;
-
- switch (d.key) {
- case 'Grouped':
- multibar.stacked(false);
- break;
- case 'Stacked':
- multibar.stacked(true);
- break;
- }
-
- state.stacked = multibar.stacked();
- dispatch.stateChange(state);
-
- chart.update();
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode)
- });
-
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
-
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
-
- state.disabled = e.disabled;
- }
-
- if (typeof e.stacked !== 'undefined') {
- multibar.stacked(e.stacked);
- state.stacked = e.stacked;
- }
-
- chart.update();
- });
-
- //============================================================
+ renderWatch.renderEnd('multibar horizontal chart immediate');
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ multibar.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt.value = chart.x()(evt.data);
+ evt['series'] = {
+ key: evt.data.key,
+ value: chart.y()(evt.data),
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- multibar.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- multibar.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.multibar = multibar;
- chart.legend = legend;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
-
- d3.rebind(chart, multibar, 'x', 'y', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY', 'clipEdge',
- 'id', 'stacked', 'stackOffset', 'delay', 'barColor','groupSpacing');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
-
- chart.showControls = function(_) {
- if (!arguments.length) return showControls;
- showControls = _;
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
-
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.reduceXTicks= function(_) {
- if (!arguments.length) return reduceXTicks;
- reduceXTicks = _;
- return chart;
- };
-
- chart.rotateLabels = function(_) {
- if (!arguments.length) return rotateLabels;
- rotateLabels = _;
- return chart;
- }
-
- chart.staggerLabels = function(_) {
- if (!arguments.length) return staggerLabels;
- staggerLabels = _;
- return chart;
- };
-
- chart.tooltip = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
+ multibar.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
+ multibar.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.multibar = multibar;
+ chart.legend = legend;
+ chart.controls = controls;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.state = state;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ showControls: {get: function(){return showControls;}, set: function(_){showControls=_;}},
+ controlLabels: {get: function(){return controlLabels;}, set: function(_){controlLabels=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ multibar.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ }},
+ barColor: {get: function(){return multibar.barColor;}, set: function(_){
+ multibar.barColor(_);
+ legend.color(function(d,i) {return d3.rgb('#ccc').darker(i * 1.5).toString();})
+ }}
+ });
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ nv.utils.inheritOptions(chart, multibar);
+ nv.utils.initOptions(chart);
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
-
-nv.models.multiBarHorizontal = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
- , x = d3.scale.ordinal()
- , y = d3.scale.linear()
- , 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 = nv.utils.defaultColor()
- , barColor = null // adding the ability to set the color for each rather than the whole group
- , disabled // used in conjunction with barColor to communicate from multiBarHorizontalChart what series are disabled
- , stacked = false
- , showValues = false
- , showBarLabels = false
- , valuePadding = 60
- , valueFormat = d3.format(',.2f')
- , delay = 1200
- , xDomain
- , yDomain
- , xRange
- , yRange
- , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var x0, y0 //used to store previous scales
- ;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
-
-
- if (stacked)
- data = d3.layout.stack()
- .offset('zero')
- .values(function(d){ return d.values })
- .y(getY)
- (data);
-
-
- //add series index to each data point for reference
- data.forEach(function(series, i) {
- series.values.forEach(function(point) {
- point.series = i;
- });
- });
-
-
-
- //------------------------------------------------------------
- // HACK for negative value stacking
- if (stacked)
- data[0].values.map(function(d,i) {
- var posBase = 0, negBase = 0;
- data.map(function(d) {
- var f = d.values[i]
- f.size = Math.abs(f.y);
- if (f.y<0) {
- f.y1 = negBase - f.size;
- negBase = negBase - f.size;
- } else
- {
- f.y1 = posBase;
- posBase = posBase + f.size;
- }
- });
- });
+};
+nv.models.multiChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 30, right: 20, bottom: 50, left: 60},
+ color = nv.utils.defaultColor(),
+ width = null,
+ height = null,
+ showLegend = true,
+ noData = null,
+ yDomain1,
+ yDomain2,
+ getX = function(d) { return d.x },
+ getY = function(d) { return d.y},
+ interpolate = 'monotone',
+ useVoronoi = true
+ ;
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+
+ var x = d3.scale.linear(),
+ yScale1 = d3.scale.linear(),
+ yScale2 = d3.scale.linear(),
+
+ lines1 = nv.models.line().yScale(yScale1),
+ lines2 = nv.models.line().yScale(yScale2),
+
+ scatters1 = nv.models.scatter().yScale(yScale1),
+ scatters2 = nv.models.scatter().yScale(yScale2),
+
+ bars1 = nv.models.multiBar().stacked(false).yScale(yScale1),
+ bars2 = nv.models.multiBar().stacked(false).yScale(yScale2),
+
+ stack1 = nv.models.stackedArea().yScale(yScale1),
+ stack2 = nv.models.stackedArea().yScale(yScale2),
+
+ xAxis = nv.models.axis().scale(x).orient('bottom').tickPadding(5),
+ yAxis1 = nv.models.axis().scale(yScale1).orient('left'),
+ yAxis2 = nv.models.axis().scale(yScale2).orient('right'),
+
+ legend = nv.models.legend().height(30),
+ tooltip = nv.models.tooltip(),
+ dispatch = d3.dispatch();
+
+ function chart(selection) {
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+
+ chart.update = function() { container.transition().call(chart); };
+ chart.container = this;
+
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ var dataLines1 = data.filter(function(d) {return d.type == 'line' && d.yAxis == 1});
+ var dataLines2 = data.filter(function(d) {return d.type == 'line' && d.yAxis == 2});
+ var dataScatters1 = data.filter(function(d) {return d.type == 'scatter' && d.yAxis == 1});
+ var dataScatters2 = data.filter(function(d) {return d.type == 'scatter' && d.yAxis == 2});
+ var dataBars1 = data.filter(function(d) {return d.type == 'bar' && d.yAxis == 1});
+ var dataBars2 = data.filter(function(d) {return d.type == 'bar' && d.yAxis == 2});
+ var dataStack1 = data.filter(function(d) {return d.type == 'area' && d.yAxis == 1});
+ var dataStack2 = data.filter(function(d) {return d.type == 'area' && d.yAxis == 2});
+
+ // Display noData message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container);
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
+ var series1 = data.filter(function(d) {return !d.disabled && d.yAxis == 1})
+ .map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d), y: getY(d) }
+ })
+ });
- //------------------------------------------------------------
- // Setup Scales
+ var series2 = data.filter(function(d) {return !d.disabled && d.yAxis == 2})
+ .map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d), y: getY(d) }
+ })
+ });
- // remap and flatten the data for use in calculating the scales' domains
- var seriesData = (xDomain && yDomain) ? [] : // if we know xDomain and yDomain, no need to calculate
- data.map(function(d) {
- return d.values.map(function(d,i) {
- return { x: getX(d,i), y: getY(d,i), y0: d.y0, y1: d.y1 }
- })
+ x .domain(d3.extent(d3.merge(series1.concat(series2)), function(d) { return getX(d) }))
+ .range([0, availableWidth]);
+
+ var wrap = container.selectAll('g.wrap.multiChart').data([data]);
+ var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multiChart').append('g');
+
+ 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', 'lines1Wrap');
+ gEnter.append('g').attr('class', 'lines2Wrap');
+ gEnter.append('g').attr('class', 'scatters1Wrap');
+ gEnter.append('g').attr('class', 'scatters2Wrap');
+ gEnter.append('g').attr('class', 'bars1Wrap');
+ gEnter.append('g').attr('class', 'bars2Wrap');
+ gEnter.append('g').attr('class', 'stack1Wrap');
+ gEnter.append('g').attr('class', 'stack2Wrap');
+ gEnter.append('g').attr('class', 'legendWrap');
+
+ var g = wrap.select('g');
+
+ var color_array = data.map(function(d,i) {
+ return data[i].color || color(d, i);
});
- x .domain(xDomain || d3.merge(seriesData).map(function(d) { return d.x }))
- .rangeBands(xRange || [0, availableHeight], .1);
-
- //y .domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return d.y + (stacked ? d.y0 : 0) }).concat(forceY)))
- y .domain(yDomain || d3.extent(d3.merge(seriesData).map(function(d) { return stacked ? (d.y > 0 ? d.y1 + d.y : d.y1 ) : d.y }).concat(forceY)))
-
- if (showValues && !stacked)
- y.range(yRange || [(y.domain()[0] < 0 ? valuePadding : 0), availableWidth - (y.domain()[1] > 0 ? valuePadding : 0) ]);
- else
- y.range(yRange || [0, availableWidth]);
-
- x0 = x0 || x;
- y0 = y0 || d3.scale.linear().domain(y.domain()).range([y(0),y(0)]);
-
- //------------------------------------------------------------
-
+ if (showLegend) {
+ var legendWidth = legend.align() ? availableWidth / 2 : availableWidth;
+ var legendXPosition = legend.align() ? legendWidth : 0;
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ legend.width(legendWidth);
+ legend.color(color_array);
- 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');
- var g = wrap.select('g');
+ g.select('.legendWrap')
+ .datum(data.map(function(series) {
+ series.originalKey = series.originalKey === undefined ? series.key : series.originalKey;
+ series.key = series.originalKey + (series.yAxis == 1 ? '' : ' (right axis)');
+ return series;
+ }))
+ .call(legend);
- gEnter.append('g').attr('class', 'nv-groups');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- //------------------------------------------------------------
+ g.select('.legendWrap')
+ .attr('transform', 'translate(' + legendXPosition + ',' + (-margin.top) +')');
+ }
+ lines1
+ .width(availableWidth)
+ .height(availableHeight)
+ .interpolate(interpolate)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'line'}));
+ lines2
+ .width(availableWidth)
+ .height(availableHeight)
+ .interpolate(interpolate)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'line'}));
+ scatters1
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'scatter'}));
+ scatters2
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'scatter'}));
+ bars1
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'bar'}));
+ bars2
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'bar'}));
+ stack1
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'area'}));
+ stack2
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(color_array.filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'area'}));
+
+ g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ var lines1Wrap = g.select('.lines1Wrap')
+ .datum(dataLines1.filter(function(d){return !d.disabled}));
+ var scatters1Wrap = g.select('.scatters1Wrap')
+ .datum(dataScatters1.filter(function(d){return !d.disabled}));
+ var bars1Wrap = g.select('.bars1Wrap')
+ .datum(dataBars1.filter(function(d){return !d.disabled}));
+ var stack1Wrap = g.select('.stack1Wrap')
+ .datum(dataStack1.filter(function(d){return !d.disabled}));
+ var lines2Wrap = g.select('.lines2Wrap')
+ .datum(dataLines2.filter(function(d){return !d.disabled}));
+ var scatters2Wrap = g.select('.scatters2Wrap')
+ .datum(dataScatters2.filter(function(d){return !d.disabled}));
+ var bars2Wrap = g.select('.bars2Wrap')
+ .datum(dataBars2.filter(function(d){return !d.disabled}));
+ var stack2Wrap = g.select('.stack2Wrap')
+ .datum(dataStack2.filter(function(d){return !d.disabled}));
+
+ var extraValue1 = dataStack1.length ? dataStack1.map(function(a){return a.values}).reduce(function(a,b){
+ return a.map(function(aVal,i){return {x: aVal.x, y: aVal.y + b[i].y}})
+ }).concat([{x:0, y:0}]) : [];
+ var extraValue2 = dataStack2.length ? dataStack2.map(function(a){return a.values}).reduce(function(a,b){
+ return a.map(function(aVal,i){return {x: aVal.x, y: aVal.y + b[i].y}})
+ }).concat([{x:0, y:0}]) : [];
+
+ yScale1 .domain(yDomain1 || d3.extent(d3.merge(series1).concat(extraValue1), function(d) { return d.y } ))
+ .range([0, availableHeight]);
+
+ yScale2 .domain(yDomain2 || d3.extent(d3.merge(series2).concat(extraValue2), function(d) { return d.y } ))
+ .range([0, availableHeight]);
+
+ lines1.yDomain(yScale1.domain());
+ scatters1.yDomain(yScale1.domain());
+ bars1.yDomain(yScale1.domain());
+ stack1.yDomain(yScale1.domain());
+
+ lines2.yDomain(yScale2.domain());
+ scatters2.yDomain(yScale2.domain());
+ bars2.yDomain(yScale2.domain());
+ stack2.yDomain(yScale2.domain());
+
+ if(dataStack1.length){d3.transition(stack1Wrap).call(stack1);}
+ if(dataStack2.length){d3.transition(stack2Wrap).call(stack2);}
+
+ if(dataBars1.length){d3.transition(bars1Wrap).call(bars1);}
+ if(dataBars2.length){d3.transition(bars2Wrap).call(bars2);}
+
+ if(dataLines1.length){d3.transition(lines1Wrap).call(lines1);}
+ if(dataLines2.length){d3.transition(lines2Wrap).call(lines2);}
+
+ if(dataScatters1.length){d3.transition(scatters1Wrap).call(scatters1);}
+ if(dataScatters2.length){d3.transition(scatters2Wrap).call(scatters2);}
+
+ xAxis
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize(-availableHeight, 0);
+
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + availableHeight + ')');
+ d3.transition(g.select('.nv-x.nv-axis'))
+ .call(xAxis);
+
+ yAxis1
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
+
+
+ d3.transition(g.select('.nv-y1.nv-axis'))
+ .call(yAxis1);
+
+ yAxis2
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
+
+ d3.transition(g.select('.nv-y2.nv-axis'))
+ .call(yAxis2);
+
+ g.select('.nv-y1.nv-axis')
+ .classed('nv-disabled', series1.length ? false : true)
+ .attr('transform', 'translate(' + x.range()[0] + ',0)');
+
+ g.select('.nv-y2.nv-axis')
+ .classed('nv-disabled', series2.length ? false : true)
+ .attr('transform', 'translate(' + x.range()[1] + ',0)');
+
+ legend.dispatch.on('stateChange', function(newState) {
+ chart.update();
+ });
+ //============================================================
+ // Event Handling/Dispatching
+ //------------------------------------------------------------
+
+ function mouseover_line(evt) {
+ var yaxis = data[evt.seriesIndex].yAxis === 2 ? yAxis2 : yAxis1;
+ evt.value = evt.point.x;
+ evt.series = {
+ value: evt.point.y,
+ color: evt.point.color,
+ key: evt.series.key
+ };
+ tooltip
+ .duration(0)
+ .valueFormatter(function(d, i) {
+ return yaxis.tickFormat()(d, i);
+ })
+ .data(evt)
+ .hidden(false);
+ }
- var groups = wrap.select('.nv-groups').selectAll('.nv-group')
- .data(function(d) { return d }, function(d,i) { return i });
- groups.enter().append('g')
- .style('stroke-opacity', 1e-6)
- .style('fill-opacity', 1e-6);
- groups.exit().transition()
- .style('stroke-opacity', 1e-6)
- .style('fill-opacity', 1e-6)
- .remove();
- groups
- .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(d, i) })
- .style('stroke', function(d,i){ return color(d, i) });
- groups.transition()
- .style('stroke-opacity', 1)
- .style('fill-opacity', .75);
+ function mouseover_scatter(evt) {
+ var yaxis = data[evt.seriesIndex].yAxis === 2 ? yAxis2 : yAxis1;
+ evt.value = evt.point.x;
+ evt.series = {
+ value: evt.point.y,
+ color: evt.point.color,
+ key: evt.series.key
+ };
+ tooltip
+ .duration(100)
+ .valueFormatter(function(d, i) {
+ return yaxis.tickFormat()(d, i);
+ })
+ .data(evt)
+ .hidden(false);
+ }
+ function mouseover_stack(evt) {
+ var yaxis = data[evt.seriesIndex].yAxis === 2 ? yAxis2 : yAxis1;
+ evt.point['x'] = stack1.x()(evt.point);
+ evt.point['y'] = stack1.y()(evt.point);
+ tooltip
+ .duration(0)
+ .valueFormatter(function(d, i) {
+ return yaxis.tickFormat()(d, i);
+ })
+ .data(evt)
+ .hidden(false);
+ }
- var bars = groups.selectAll('g.nv-bar')
- .data(function(d) { return d.values });
+ function mouseover_bar(evt) {
+ var yaxis = data[evt.data.series].yAxis === 2 ? yAxis2 : yAxis1;
+
+ evt.value = bars1.x()(evt.data);
+ evt['series'] = {
+ value: bars1.y()(evt.data),
+ color: evt.color,
+ key: evt.data.key
+ };
+ tooltip
+ .duration(0)
+ .valueFormatter(function(d, i) {
+ return yaxis.tickFormat()(d, i);
+ })
+ .data(evt)
+ .hidden(false);
+ }
- bars.exit().remove();
+ lines1.dispatch.on('elementMouseover.tooltip', mouseover_line);
+ lines2.dispatch.on('elementMouseover.tooltip', mouseover_line);
+ lines1.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
+ lines2.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
+ scatters1.dispatch.on('elementMouseover.tooltip', mouseover_scatter);
+ scatters2.dispatch.on('elementMouseover.tooltip', mouseover_scatter);
+ scatters1.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
+ scatters2.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
- var barsEnter = bars.enter().append('g')
- .attr('transform', function(d,i,j) {
- return 'translate(' + y0(stacked ? d.y0 : 0) + ',' + (stacked ? 0 : (j * x.rangeBand() / data.length ) + x(getX(d,i))) + ')'
- });
+ stack1.dispatch.on('elementMouseover.tooltip', mouseover_stack);
+ stack2.dispatch.on('elementMouseover.tooltip', mouseover_stack);
+ stack1.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
+ stack2.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
- barsEnter.append('rect')
- .attr('width', 0)
- .attr('height', x.rangeBand() / (stacked ? 1 : data.length) )
+ bars1.dispatch.on('elementMouseover.tooltip', mouseover_bar);
+ bars2.dispatch.on('elementMouseover.tooltip', mouseover_bar);
- bars
- .on('mouseover', function(d,i) { //TODO: figure out why j works above, but not here
- d3.select(this).classed('hover', true);
- dispatch.elementMouseover({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [ y(getY(d,i) + (stacked ? d.y0 : 0)), x(getX(d,i)) + (x.rangeBand() * (stacked ? data.length / 2 : d.series + .5) / data.length) ],
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
- });
- })
- .on('mouseout', function(d,i) {
- d3.select(this).classed('hover', false);
- dispatch.elementMouseout({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
+ bars1.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
});
- })
- .on('click', function(d,i) {
- dispatch.elementClick({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (stacked ? data.length / 2 : d.series + .5) / data.length), y(getY(d,i) + (stacked ? d.y0 : 0))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
+ bars2.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
});
- d3.event.stopPropagation();
- })
- .on('dblclick', function(d,i) {
- dispatch.elementDblClick({
- value: getY(d,i),
- point: d,
- series: data[d.series],
- pos: [x(getX(d,i)) + (x.rangeBand() * (stacked ? data.length / 2 : d.series + .5) / data.length), y(getY(d,i) + (stacked ? d.y0 : 0))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: d.series,
- e: d3.event
+ bars1.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
});
- d3.event.stopPropagation();
- });
-
-
- barsEnter.append('text');
-
- if (showValues && !stacked) {
- bars.select('text')
- .attr('text-anchor', function(d,i) { return getY(d,i) < 0 ? 'end' : 'start' })
- .attr('y', x.rangeBand() / (data.length * 2))
- .attr('dy', '.32em')
- .text(function(d,i) { return valueFormat(getY(d,i)) })
- bars.transition()
- .select('text')
- .attr('x', function(d,i) { return getY(d,i) < 0 ? -4 : y(getY(d,i)) - y(0) + 4 })
- } else {
- bars.selectAll('text').text('');
- }
-
- if (showBarLabels && !stacked) {
- barsEnter.append('text').classed('nv-bar-label',true);
- bars.select('text.nv-bar-label')
- .attr('text-anchor', function(d,i) { return getY(d,i) < 0 ? 'start' : 'end' })
- .attr('y', x.rangeBand() / (data.length * 2))
- .attr('dy', '.32em')
- .text(function(d,i) { return getX(d,i) });
- bars.transition()
- .select('text.nv-bar-label')
- .attr('x', function(d,i) { return getY(d,i) < 0 ? y(0) - y(getY(d,i)) + 4 : -4 });
- }
- else {
- bars.selectAll('text.nv-bar-label').text('');
- }
-
- bars
- .attr('class', function(d,i) { return getY(d,i) < 0 ? 'nv-bar negative' : 'nv-bar positive'})
-
- if (barColor) {
- if (!disabled) disabled = data.map(function() { return true });
- bars
- .style('fill', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); })
- .style('stroke', function(d,i,j) { return d3.rgb(barColor(d,i)).darker( disabled.map(function(d,i) { return i }).filter(function(d,i){ return !disabled[i] })[j] ).toString(); });
- }
-
- if (stacked)
- bars.transition()
- .attr('transform', function(d,i) {
- return 'translate(' + y(d.y1) + ',' + x(getX(d,i)) + ')'
- })
- .select('rect')
- .attr('width', function(d,i) {
- return Math.abs(y(getY(d,i) + d.y0) - y(d.y0))
- })
- .attr('height', x.rangeBand() );
- else
- bars.transition()
- .attr('transform', function(d,i) {
- //TODO: stacked must be all positive or all negative, not both?
- return 'translate(' +
- (getY(d,i) < 0 ? y(getY(d,i)) : y(0))
- + ',' +
- (d.series * x.rangeBand() / data.length
- +
- x(getX(d,i)) )
- + ')'
- })
- .select('rect')
- .attr('height', x.rangeBand() / data.length )
- .attr('width', function(d,i) {
- return Math.max(Math.abs(y(getY(d,i)) - y(0)),1)
+ bars2.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
});
+ });
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
+ return chart;
+ }
+ //============================================================
+ // Global getters and setters
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.legend = legend;
+ chart.lines1 = lines1;
+ chart.lines2 = lines2;
+ chart.scatters1 = scatters1;
+ chart.scatters2 = scatters2;
+ chart.bars1 = bars1;
+ chart.bars2 = bars2;
+ chart.stack1 = stack1;
+ chart.stack2 = stack2;
+ chart.xAxis = xAxis;
+ chart.yAxis1 = yAxis1;
+ chart.yAxis2 = yAxis2;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ yDomain1: {get: function(){return yDomain1;}, set: function(_){yDomain1=_;}},
+ yDomain2: {get: function(){return yDomain2;}, set: function(_){yDomain2=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ interpolate: {get: function(){return interpolate;}, set: function(_){interpolate=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ x: {get: function(){return getX;}, set: function(_){
+ getX = _;
+ lines1.x(_);
+ lines2.x(_);
+ scatters1.x(_);
+ scatters2.x(_);
+ bars1.x(_);
+ bars2.x(_);
+ stack1.x(_);
+ stack2.x(_);
+ }},
+ y: {get: function(){return getY;}, set: function(_){
+ getY = _;
+ lines1.y(_);
+ lines2.y(_);
+ scatters1.y(_);
+ scatters2.y(_);
+ stack1.y(_);
+ stack2.y(_);
+ bars1.y(_);
+ bars2.y(_);
+ }},
+ useVoronoi: {get: function(){return useVoronoi;}, set: function(_){
+ useVoronoi=_;
+ lines1.useVoronoi(_);
+ lines2.useVoronoi(_);
+ stack1.useVoronoi(_);
+ stack2.useVoronoi(_);
+ }}
});
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
-
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
-
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
-
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
-
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
-
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
-
- chart.forceY = function(_) {
- if (!arguments.length) return forceY;
- forceY = _;
- return chart;
- };
-
- chart.stacked = function(_) {
- if (!arguments.length) return stacked;
- stacked = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
-
- chart.barColor = function(_) {
- if (!arguments.length) return barColor;
- barColor = nv.utils.getColor(_);
- return chart;
- };
-
- chart.disabled = function(_) {
- if (!arguments.length) return disabled;
- disabled = _;
- return chart;
- };
-
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
-
- chart.delay = function(_) {
- if (!arguments.length) return delay;
- delay = _;
- return chart;
- };
-
- chart.showValues = function(_) {
- if (!arguments.length) return showValues;
- showValues = _;
- return chart;
- };
-
- chart.showBarLabels = function(_) {
- if (!arguments.length) return showBarLabels;
- showBarLabels = _;
- return chart;
- };
-
-
- chart.valueFormat= function(_) {
- if (!arguments.length) return valueFormat;
- valueFormat = _;
- return chart;
- };
+ nv.utils.initOptions(chart);
- chart.valuePadding = function(_) {
- if (!arguments.length) return valuePadding;
- valuePadding = _;
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
-
-nv.models.multiBarHorizontalChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var multibar = nv.models.multiBarHorizontal()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend().height(30)
- , controls = nv.models.legend().height(30)
- ;
-
- var margin = {top: 30, right: 20, bottom: 50, left: 60}
- , width = null
- , height = null
- , color = nv.utils.defaultColor()
- , showControls = true
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , stacked = false
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + ' - ' + x + '</h3>' +
- '<p>' + y + '</p>'
- }
- , x //can be accessed via chart.xScale()
- , y //can be accessed via chart.yScale()
- , state = { stacked: stacked }
- , defaultState = null
- , noData = 'No Data Available.'
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , controlWidth = function() { return showControls ? 180 : 0 }
- , transitionDuration = 250
- ;
-
- multibar
- .stacked(stacked)
- ;
- xAxis
- .orient('left')
- .tickPadding(5)
- .highlightZero(false)
- .showMaxMin(false)
- .tickFormat(function(d) { return d })
- ;
- yAxis
- .orient('bottom')
- .tickFormat(d3.format(',.1f'))
- ;
-
- controls.updateState(false);
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(multibar.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(multibar.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'e' : 'w', null, offsetElement);
- };
-
- //============================================================
-
+};
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
+nv.models.ohlcBar = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = null
+ , height = null
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container = null
+ , x = d3.scale.linear()
+ , y = d3.scale.linear()
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , getOpen = function(d) { return d.open }
+ , getClose = function(d) { return d.close }
+ , getHigh = function(d) { return d.high }
+ , getLow = function(d) { return d.low }
+ , forceX = []
+ , forceY = []
+ , padData = false // If true, adds half a data points width to front and back, for lining up a line chart with a bar chart
+ , clipEdge = true
+ , color = nv.utils.defaultColor()
+ , interactive = false
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ , dispatch = d3.dispatch('stateChange', 'changeState', 'renderEnd', 'chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove')
+ ;
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- chart.update = function() { container.transition().duration(transitionDuration).call(chart) };
- chart.container = this;
+ function chart(selection) {
+ selection.each(function(data) {
+ container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ nv.utils.initSVG(container);
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
+ // ohlc bar width.
+ var w = (availableWidth / data[0].values.length) * .9;
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
+ // Setup Scales
+ x.domain(xDomain || d3.extent(data[0].values.map(getX).concat(forceX) ));
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
+ if (padData)
+ x.range(xRange || [availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
+ else
+ x.range(xRange || [5 + w/2, availableWidth - w/2 - 5]);
+
+ y.domain(yDomain || [
+ d3.min(data[0].values.map(getLow).concat(forceY)),
+ d3.max(data[0].values.map(getHigh).concat(forceY))
+ ]
+ ).range(yRange || [availableHeight, 0]);
+
+ // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
+ if (x.domain()[0] === x.domain()[1])
+ x.domain()[0] ?
+ x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
+ : x.domain([-1,1]);
+
+ 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])
+ : y.domain([-1,1]);
+
+ // Setup containers and skeleton of chart
+ 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 defsEnter = wrapEnter.append('defs');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
+
+ gEnter.append('g').attr('class', 'nv-ticks');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ container
+ .on('click', function(d,i) {
+ dispatch.chartClick({
+ data: d,
+ index: i,
+ pos: d3.event,
+ id: id
+ });
+ });
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-chart-clip-path-' + id)
+ .append('rect');
+
+ wrap.select('#nv-chart-clip-path-' + id + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', availableHeight);
+
+ g .attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
+
+ var ticks = wrap.select('.nv-ticks').selectAll('.nv-tick')
+ .data(function(d) { return d });
+ ticks.exit().remove();
+
+ ticks.enter().append('path')
+ .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) {
+ 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]; })
+ .attr('stroke', function(d,i) { return color[0]; })
+ .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)) });
+
+ // the bar colors are controlled by CSS currently
+ ticks.attr('class', function(d,i,j) {
+ return (getOpen(d,i) > getClose(d,i) ? 'nv-tick negative' : 'nv-tick positive') + ' nv-tick-' + j + '-' + i;
+ });
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
+ 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 chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = multibar.xScale();
- y = multibar.yScale();
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-x nv-axis');
- gEnter.append('g').attr('class', 'nv-y nv-axis')
- .append('g').attr('class', 'nv-zeroLine')
- .append('line');
- gEnter.append('g').attr('class', 'nv-barsWrap');
- gEnter.append('g').attr('class', 'nv-legendWrap');
- gEnter.append('g').attr('class', 'nv-controlsWrap');
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Legend
-
- if (showLegend) {
- legend.width(availableWidth - controlWidth());
-
- if (multibar.barColor())
- data.forEach(function(series,i) {
- series.color = d3.rgb('#ccc').darker(i * 1.5).toString();
- })
-
- 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;
- }
-
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(' + controlWidth() + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Controls
-
- if (showControls) {
- var controlsData = [
- { key: 'Grouped', disabled: multibar.stacked() },
- { key: 'Stacked', disabled: !multibar.stacked() }
- ];
-
- controls.width(controlWidth()).color(['#444', '#444', '#444']);
- g.select('.nv-controlsWrap')
- .datum(controlsData)
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- .call(controls);
- }
-
- //------------------------------------------------------------
-
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
-
- //------------------------------------------------------------
- // Main Chart Component(s)
-
- multibar
- .disabled(data.map(function(series) { return series.disabled }))
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }))
-
-
- var barsWrap = g.select('.nv-barsWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
-
- barsWrap.transition().call(multibar);
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Axes
-
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( availableHeight / 24 )
- .tickSize(-availableWidth, 0);
-
- g.select('.nv-x.nv-axis').transition()
- .call(xAxis);
-
- var xTicks = g.select('.nv-x.nv-axis').selectAll('g');
-
- xTicks
- .selectAll('line, text');
- }
-
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( availableWidth / 100 )
- .tickSize( -availableHeight, 0);
+ }
- g.select('.nv-y.nv-axis')
- .attr('transform', 'translate(0,' + availableHeight + ')');
- g.select('.nv-y.nv-axis').transition()
- .call(yAxis);
- }
- // Zero line
- g.select(".nv-zeroLine line")
- .attr("x1", y(0))
- .attr("x2", y(0))
- .attr("y1", 0)
- .attr("y2", -availableHeight)
+ //Create methods to allow outside functions to highlight a specific bar.
+ chart.highlightPoint = function(pointIndex, isHoverOver) {
+ chart.clearHighlights();
+ container.select(".nv-ohlcBar .nv-tick-0-" + pointIndex)
+ .classed("hover", isHoverOver)
;
+ };
- //------------------------------------------------------------
-
-
-
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
-
- legend.dispatch.on('stateChange', function(newState) {
- state = newState;
- dispatch.stateChange(state);
- chart.update();
- });
-
- controls.dispatch.on('legendClick', function(d,i) {
- if (!d.disabled) return;
- controlsData = controlsData.map(function(s) {
- s.disabled = true;
- return s;
- });
- d.disabled = false;
-
- switch (d.key) {
- case 'Grouped':
- multibar.stacked(false);
- break;
- case 'Stacked':
- multibar.stacked(true);
- break;
- }
-
- state.stacked = multibar.stacked();
- dispatch.stateChange(state);
-
- chart.update();
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
-
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
-
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
-
- state.disabled = e.disabled;
- }
-
- if (typeof e.stacked !== 'undefined') {
- multibar.stacked(e.stacked);
- state.stacked = e.stacked;
- }
-
- chart.update();
- });
- //============================================================
-
-
- });
-
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- multibar.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- multibar.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.multibar = multibar;
- chart.legend = legend;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
-
- d3.rebind(chart, multibar, 'x', 'y', 'xDomain', 'yDomain', 'xRange', 'yRange', 'forceX', 'forceY',
- 'clipEdge', 'id', 'delay', 'showValues','showBarLabels', 'valueFormat', 'stacked', 'barColor');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- return chart;
- };
-
- chart.showControls = function(_) {
- if (!arguments.length) return showControls;
- showControls = _;
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
-
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.tooltip = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
-
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
-
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
- //============================================================
-
-
- return chart;
-}
-nv.models.multiChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 30, right: 20, bottom: 50, left: 60},
- color = d3.scale.category20().range(),
- width = null,
- height = null,
- showLegend = true,
- tooltips = true,
- tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' at ' + x + '</p>'
- },
- x,
- y,
- yDomain1,
- yDomain2
- ; //can be accessed via chart.lines.[x/y]Scale()
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var x = d3.scale.linear(),
- yScale1 = d3.scale.linear(),
- yScale2 = d3.scale.linear(),
-
- lines1 = nv.models.line().yScale(yScale1),
- lines2 = nv.models.line().yScale(yScale2),
-
- bars1 = nv.models.multiBar().stacked(false).yScale(yScale1),
- bars2 = nv.models.multiBar().stacked(false).yScale(yScale2),
-
- stack1 = nv.models.stackedArea().yScale(yScale1),
- stack2 = nv.models.stackedArea().yScale(yScale2),
-
- xAxis = nv.models.axis().scale(x).orient('bottom').tickPadding(5),
- yAxis1 = nv.models.axis().scale(yScale1).orient('left'),
- yAxis2 = nv.models.axis().scale(yScale2).orient('right'),
-
- legend = nv.models.legend().height(30),
- dispatch = d3.dispatch('tooltipShow', 'tooltipHide');
-
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(lines1.x()(e.point, e.pointIndex)),
- y = ((e.series.yAxis == 2) ? yAxis2 : yAxis1).tickFormat()(lines1.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
-
- nv.tooltip.show([left, top], content, undefined, undefined, offsetElement.offsetParent);
- };
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- chart.update = function() { container.transition().call(chart); };
- chart.container = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
-
- var dataLines1 = data.filter(function(d) {return !d.disabled && d.type == 'line' && d.yAxis == 1})
- var dataLines2 = data.filter(function(d) {return !d.disabled && d.type == 'line' && d.yAxis == 2})
- var dataBars1 = data.filter(function(d) {return !d.disabled && d.type == 'bar' && d.yAxis == 1})
- var dataBars2 = data.filter(function(d) {return !d.disabled && d.type == 'bar' && d.yAxis == 2})
- var dataStack1 = data.filter(function(d) {return !d.disabled && d.type == 'area' && d.yAxis == 1})
- var dataStack2 = data.filter(function(d) {return !d.disabled && d.type == 'area' && d.yAxis == 2})
-
- var series1 = data.filter(function(d) {return !d.disabled && d.yAxis == 1})
- .map(function(d) {
- return d.values.map(function(d,i) {
- return { x: d.x, y: d.y }
- })
- })
-
- var series2 = data.filter(function(d) {return !d.disabled && d.yAxis == 2})
- .map(function(d) {
- return d.values.map(function(d,i) {
- return { x: d.x, y: d.y }
- })
- })
-
- x .domain(d3.extent(d3.merge(series1.concat(series2)), function(d) { return d.x } ))
- .range([0, availableWidth]);
-
- var wrap = container.selectAll('g.wrap.multiChart').data([data]);
- var gEnter = wrap.enter().append('g').attr('class', 'wrap nvd3 multiChart').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', 'lines1Wrap');
- gEnter.append('g').attr('class', 'lines2Wrap');
- gEnter.append('g').attr('class', 'bars1Wrap');
- gEnter.append('g').attr('class', 'bars2Wrap');
- gEnter.append('g').attr('class', 'stack1Wrap');
- gEnter.append('g').attr('class', 'stack2Wrap');
- gEnter.append('g').attr('class', 'legendWrap');
-
- var g = wrap.select('g');
-
- if (showLegend) {
- legend.width( availableWidth / 2 );
-
- g.select('.legendWrap')
- .datum(data.map(function(series) {
- series.originalKey = series.originalKey === undefined ? series.key : series.originalKey;
- series.key = series.originalKey + (series.yAxis == 1 ? '' : ' (right axis)');
- return series;
- }))
- .call(legend);
-
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
- }
-
- g.select('.legendWrap')
- .attr('transform', 'translate(' + ( availableWidth / 2 ) + ',' + (-margin.top) +')');
- }
-
-
- lines1
- .width(availableWidth)
- .height(availableHeight)
- .interpolate("monotone")
- .color(data.map(function(d,i) {
- return d.color || color[i % color.length];
- }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'line'}));
-
- lines2
- .width(availableWidth)
- .height(availableHeight)
- .interpolate("monotone")
- .color(data.map(function(d,i) {
- return d.color || color[i % color.length];
- }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'line'}));
-
- bars1
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color[i % color.length];
- }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'bar'}));
-
- bars2
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color[i % color.length];
- }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'bar'}));
-
- stack1
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color[i % color.length];
- }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 1 && data[i].type == 'area'}));
-
- stack2
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color[i % color.length];
- }).filter(function(d,i) { return !data[i].disabled && data[i].yAxis == 2 && data[i].type == 'area'}));
-
- g.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
-
- var lines1Wrap = g.select('.lines1Wrap')
- .datum(dataLines1)
- var bars1Wrap = g.select('.bars1Wrap')
- .datum(dataBars1)
- var stack1Wrap = g.select('.stack1Wrap')
- .datum(dataStack1)
-
- var lines2Wrap = g.select('.lines2Wrap')
- .datum(dataLines2)
- var bars2Wrap = g.select('.bars2Wrap')
- .datum(dataBars2)
- var stack2Wrap = g.select('.stack2Wrap')
- .datum(dataStack2)
-
- var extraValue1 = dataStack1.length ? dataStack1.map(function(a){return a.values}).reduce(function(a,b){
- return a.map(function(aVal,i){return {x: aVal.x, y: aVal.y + b[i].y}})
- }).concat([{x:0, y:0}]) : []
- var extraValue2 = dataStack2.length ? dataStack2.map(function(a){return a.values}).reduce(function(a,b){
- return a.map(function(aVal,i){return {x: aVal.x, y: aVal.y + b[i].y}})
- }).concat([{x:0, y:0}]) : []
-
- yScale1 .domain(yDomain1 || d3.extent(d3.merge(series1).concat(extraValue1), function(d) { return d.y } ))
- .range([0, availableHeight])
-
- yScale2 .domain(yDomain2 || d3.extent(d3.merge(series2).concat(extraValue2), function(d) { return d.y } ))
- .range([0, availableHeight])
-
- lines1.yDomain(yScale1.domain())
- bars1.yDomain(yScale1.domain())
- stack1.yDomain(yScale1.domain())
-
- lines2.yDomain(yScale2.domain())
- bars2.yDomain(yScale2.domain())
- stack2.yDomain(yScale2.domain())
-
- if(dataStack1.length){d3.transition(stack1Wrap).call(stack1);}
- if(dataStack2.length){d3.transition(stack2Wrap).call(stack2);}
-
- if(dataBars1.length){d3.transition(bars1Wrap).call(bars1);}
- if(dataBars2.length){d3.transition(bars2Wrap).call(bars2);}
-
- if(dataLines1.length){d3.transition(lines1Wrap).call(lines1);}
- if(dataLines2.length){d3.transition(lines2Wrap).call(lines2);}
-
-
-
- xAxis
- .ticks( availableWidth / 100 )
- .tickSize(-availableHeight, 0);
-
- g.select('.x.axis')
- .attr('transform', 'translate(0,' + availableHeight + ')');
- d3.transition(g.select('.x.axis'))
- .call(xAxis);
-
- yAxis1
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
-
-
- d3.transition(g.select('.y1.axis'))
- .call(yAxis1);
-
- yAxis2
- .ticks( availableHeight / 36 )
- .tickSize( -availableWidth, 0);
-
- d3.transition(g.select('.y2.axis'))
- .call(yAxis2);
-
- g.select('.y2.axis')
- .style('opacity', series2.length ? 1 : 0)
- .attr('transform', 'translate(' + x.range()[1] + ',0)');
-
- legend.dispatch.on('stateChange', function(newState) {
- chart.update();
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ chart.clearHighlights = function() {
+ container.select(".nv-ohlcBar .nv-tick.hover")
+ .classed("hover", false)
+ ;
+ };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ forceX: {get: function(){return forceX;}, set: function(_){forceX=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ padData: {get: function(){return padData;}, set: function(_){padData=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ interactive: {get: function(){return interactive;}, set: function(_){interactive=_;}},
+
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ y: {get: function(){return getY;}, set: function(_){getY=_;}},
+ open: {get: function(){return getOpen();}, set: function(_){getOpen=_;}},
+ close: {get: function(){return getClose();}, set: function(_){getClose=_;}},
+ high: {get: function(){return getHigh;}, set: function(_){getHigh=_;}},
+ low: {get: function(){return getLow;}, set: function(_){getLow=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top != undefined ? _.top : margin.top;
+ margin.right = _.right != undefined ? _.right : margin.right;
+ margin.bottom = _.bottom != undefined ? _.bottom : margin.bottom;
+ margin.left = _.left != undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
});
+ nv.utils.initOptions(chart);
return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- lines1.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines1.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- lines2.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines2.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- bars1.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- bars1.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- bars2.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- bars2.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- stack1.dispatch.on('tooltipShow', function(e) {
- //disable tooltips when value ~= 0
- //// TODO: consider removing points from voronoi that have 0 value instead of this hack
- if (!Math.round(stack1.y()(e.point) * 100)) { // 100 will not be good for very small numbers... will have to think about making this valu dynamic, based on data range
- setTimeout(function() { d3.selectAll('.point.hover').classed('hover', false) }, 0);
- return false;
- }
-
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top],
- dispatch.tooltipShow(e);
- });
-
- stack1.dispatch.on('tooltipHide', function(e) {
- dispatch.tooltipHide(e);
- });
-
- stack2.dispatch.on('tooltipShow', function(e) {
- //disable tooltips when value ~= 0
- //// TODO: consider removing points from voronoi that have 0 value instead of this hack
- if (!Math.round(stack2.y()(e.point) * 100)) { // 100 will not be good for very small numbers... will have to think about making this valu dynamic, based on data range
- setTimeout(function() { d3.selectAll('.point.hover').classed('hover', false) }, 0);
- return false;
- }
-
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top],
- dispatch.tooltipShow(e);
- });
-
- stack2.dispatch.on('tooltipHide', function(e) {
- dispatch.tooltipHide(e);
- });
-
- lines1.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines1.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- lines2.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- lines2.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
-
-
- //============================================================
- // Global getters and setters
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
- chart.lines1 = lines1;
- chart.lines2 = lines2;
- chart.bars1 = bars1;
- chart.bars2 = bars2;
- chart.stack1 = stack1;
- chart.stack2 = stack2;
- chart.xAxis = xAxis;
- chart.yAxis1 = yAxis1;
- chart.yAxis2 = yAxis2;
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- lines1.x(_);
- bars1.x(_);
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- lines1.y(_);
- bars1.y(_);
- return chart;
- };
-
- chart.yDomain1 = function(_) {
- if (!arguments.length) return yDomain1;
- yDomain1 = _;
- return chart;
- };
-
- chart.yDomain2 = function(_) {
- if (!arguments.length) return yDomain2;
- yDomain2 = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin = _;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = _;
- legend.color(_);
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- return chart;
-}
-
-
-nv.models.ohlcBar = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
- , x = d3.scale.linear()
- , y = d3.scale.linear()
- , getX = function(d) { return d.x }
- , getY = function(d) { return d.y }
- , getOpen = function(d) { return d.open }
- , getClose = function(d) { return d.close }
- , getHigh = function(d) { return d.high }
- , getLow = function(d) { return d.low }
- , forceX = []
- , forceY = []
- , padData = false // If true, adds half a data points width to front and back, for lining up a line chart with a bar chart
- , clipEdge = true
- , color = nv.utils.defaultColor()
- , xDomain
- , yDomain
- , xRange
- , yRange
- , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
- ;
-
- //============================================================
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- //TODO: store old scales for transitions
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x .domain(xDomain || d3.extent(data[0].values.map(getX).concat(forceX) ));
-
- if (padData)
- x.range(xRange || [availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
- else
- x.range(xRange || [0, availableWidth]);
-
- y .domain(yDomain || [
- d3.min(data[0].values.map(getLow).concat(forceY)),
- d3.max(data[0].values.map(getHigh).concat(forceY))
- ])
- .range(yRange || [availableHeight, 0]);
-
- // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
- if (x.domain()[0] === x.domain()[1])
- x.domain()[0] ?
- x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
- : x.domain([-1,1]);
-
- 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])
- : y.domain([-1,1]);
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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 defsEnter = wrapEnter.append('defs');
- var gEnter = wrapEnter.append('g');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-ticks');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+};
+// Code adapted from Jason Davies' "Parallel Coordinates"
+// http://bl.ocks.org/jasondavies/1341281
+nv.models.parallelCoordinates = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 30, right: 0, bottom: 10, left: 0}
+ , width = null
+ , height = null
+ , x = d3.scale.ordinal()
+ , y = {}
+ , dimensionNames = []
+ , dimensionFormats = []
+ , color = nv.utils.defaultColor()
+ , filters = []
+ , active = []
+ , dragging = []
+ , lineTension = 1
+ , dispatch = d3.dispatch('brush', 'elementMouseover', 'elementMouseout')
+ ;
- //------------------------------------------------------------
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+
+ function chart(selection) {
+ selection.each(function(data) {
+ var container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ nv.utils.initSVG(container);
+
+ active = data; //set all active before first brush call
+
+ // Setup Scales
+ x.rangePoints([0, availableWidth], 1).domain(dimensionNames);
+
+ //Set as true if all values on an axis are missing.
+ var onlyNanValues = {};
+ // Extract the list of dimensions and create a scale for each.
+ dimensionNames.forEach(function(d) {
+ var extent = d3.extent(data, function(p) { return +p[d]; });
+ onlyNanValues[d] = false;
+ //If there is no values to display on an axis, set the extent to 0
+ if (extent[0] === undefined) {
+ onlyNanValues[d] = true;
+ extent[0] = 0;
+ extent[1] = 0;
+ }
+ //Scale axis if there is only one value
+ if (extent[0] === extent[1]) {
+ extent[0] = extent[0] - 1;
+ extent[1] = extent[1] + 1;
+ }
+ //Use 90% of (availableHeight - 12) for the axis range, 12 reprensenting the space necessary to display "undefined values" text.
+ //The remaining 10% are used to display the missingValue line.
+ y[d] = d3.scale.linear()
+ .domain(extent)
+ .range([(availableHeight - 12) * 0.9, 0]);
+ y[d].brush = d3.svg.brush().y(y[d]).on('brush', brush);
- container
- .on('click', function(d,i) {
- dispatch.chartClick({
- data: d,
- index: i,
- pos: d3.event,
- id: id
+ return d != 'name';
});
- });
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-parallelCoordinates').data([data]);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-parallelCoordinates');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
- defsEnter.append('clipPath')
- .attr('id', 'nv-chart-clip-path-' + id)
- .append('rect');
+ gEnter.append('g').attr('class', 'nv-parallelCoordinates background');
+ gEnter.append('g').attr('class', 'nv-parallelCoordinates foreground');
+ gEnter.append('g').attr('class', 'nv-parallelCoordinates missingValuesline');
- wrap.select('#nv-chart-clip-path-' + id + ' rect')
- .attr('width', availableWidth)
- .attr('height', availableHeight);
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- g .attr('clip-path', clipEdge ? 'url(#nv-chart-clip-path-' + id + ')' : '');
-
-
-
- var ticks = wrap.select('.nv-ticks').selectAll('.nv-tick')
- .data(function(d) { return d });
-
- ticks.exit().remove();
+ var line = d3.svg.line().interpolate('cardinal').tension(lineTension),
+ axis = d3.svg.axis().orient('left'),
+ axisDrag = d3.behavior.drag()
+ .on('dragstart', dragStart)
+ .on('drag', dragMove)
+ .on('dragend', dragEnd);
+ //Add missing value line at the bottom of the chart
+ var missingValuesline, missingValueslineText;
+ var step = x.range()[1] - x.range()[0];
+ var axisWithMissingValues = [];
+ var lineData = [0 + step / 2, availableHeight - 12, availableWidth - step / 2, availableHeight - 12];
+ missingValuesline = wrap.select('.missingValuesline').selectAll('line').data([lineData]);
+ missingValuesline.enter().append('line');
+ missingValuesline.exit().remove();
+ missingValuesline.attr("x1", function(d) { return d[0]; })
+ .attr("y1", function(d) { return d[1]; })
+ .attr("x2", function(d) { return d[2]; })
+ .attr("y2", function(d) { return d[3]; });
+
+ //Add the text "undefined values" under the missing value line
+ missingValueslineText = wrap.select('.missingValuesline').selectAll('text').data(["undefined values"]);
+ missingValueslineText.append('text').data(["undefined values"]);
+ missingValueslineText.enter().append('text');
+ missingValueslineText.exit().remove();
+ missingValueslineText.attr("y", availableHeight)
+ //To have the text right align with the missingValues line, substract 92 representing the text size.
+ .attr("x", availableWidth - 92 - step / 2)
+ .text(function(d) { return d; });
+
+ // Add grey background lines for context.
+ var background = wrap.select('.background').selectAll('path').data(data);
+ background.enter().append('path');
+ background.exit().remove();
+ background.attr('d', path);
+
+ // Add blue foreground lines for focus.
+ var foreground = wrap.select('.foreground').selectAll('path').data(data);
+ foreground.enter().append('path')
+ foreground.exit().remove();
+ foreground.attr('d', path).attr('stroke', color);
+ foreground.on("mouseover", function (d, i) {
+ d3.select(this).classed('hover', true);
+ dispatch.elementMouseover({
+ label: d.name,
+ data: d.data,
+ index: i,
+ pos: [d3.mouse(this.parentNode)[0], d3.mouse(this.parentNode)[1]]
+ });
- var ticksEnter = ticks.enter().append('path')
- .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';
- })
- .attr('transform', function(d,i) { return 'translate(' + x(getX(d,i)) + ',' + y(getHigh(d,i)) + ')'; })
- //.attr('fill', function(d,i) { return color[0]; })
- //.attr('stroke', function(d,i) { return color[0]; })
- //.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)) })
- .on('mouseover', function(d,i) {
- d3.select(this).classed('hover', true);
- dispatch.elementMouseover({
- point: d,
- series: data[0],
- pos: [x(getX(d,i)), y(getY(d,i))], // TODO: Figure out why the value appears to be shifted
- pointIndex: i,
- seriesIndex: 0,
- e: d3.event
});
-
- })
- .on('mouseout', function(d,i) {
+ foreground.on("mouseout", function (d, i) {
d3.select(this).classed('hover', false);
dispatch.elementMouseout({
- point: d,
- series: data[0],
- pointIndex: i,
- seriesIndex: 0,
- e: d3.event
- });
- })
- .on('click', function(d,i) {
- dispatch.elementClick({
- //label: d[label],
- value: getY(d,i),
- data: d,
- index: i,
- pos: [x(getX(d,i)), y(getY(d,i))],
- e: d3.event,
- id: id
+ label: d.name,
+ data: d.data,
+ index: i
});
- d3.event.stopPropagation();
- })
- .on('dblclick', function(d,i) {
- dispatch.elementDblClick({
- //label: d[label],
- value: getY(d,i),
- data: d,
- index: i,
- pos: [x(getX(d,i)), y(getY(d,i))],
- e: d3.event,
- id: id
- });
- d3.event.stopPropagation();
- });
-
- ticks
- .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';
- })
- //.attr('width', (availableWidth / data[0].values.length) * .9 )
-
-
- //d3.transition(ticks)
- //.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)) });
- //.order(); // not sure if this makes any sense for this model
-
- });
-
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
-
- chart.options = nv.utils.optionsFunc.bind(chart);
+ });
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- return chart;
- };
+ // Add a group element for each dimension.
+ var dimensions = g.selectAll('.dimension').data(dimensionNames);
+ var dimensionsEnter = dimensions.enter().append('g').attr('class', 'nv-parallelCoordinates dimension');
+ dimensionsEnter.append('g').attr('class', 'nv-parallelCoordinates nv-axis');
+ dimensionsEnter.append('g').attr('class', 'nv-parallelCoordinates-brush');
+ dimensionsEnter.append('text').attr('class', 'nv-parallelCoordinates nv-label');
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = _;
- return chart;
- };
+ dimensions.attr('transform', function(d) { return 'translate(' + x(d) + ',0)'; });
+ dimensions.exit().remove();
- chart.open = function(_) {
- if (!arguments.length) return getOpen;
- getOpen = _;
- return chart;
- };
+ // Add an axis and title.
+ dimensions.select('.nv-label')
+ .style("cursor", "move")
+ .attr('dy', '-1em')
+ .attr('text-anchor', 'middle')
+ .text(String)
+ .on("mouseover", function(d, i) {
+ dispatch.elementMouseover({
+ dim: d,
+ pos: [d3.mouse(this.parentNode.parentNode)[0], d3.mouse(this.parentNode.parentNode)[1]]
+ });
+ })
+ .on("mouseout", function(d, i) {
+ dispatch.elementMouseout({
+ dim: d
+ });
+ })
+ .call(axisDrag);
- chart.close = function(_) {
- if (!arguments.length) return getClose;
- getClose = _;
- return chart;
- };
+ dimensions.select('.nv-axis')
+ .each(function (d, i) {
+ d3.select(this).call(axis.scale(y[d]).tickFormat(d3.format(dimensionFormats[i])));
+ });
- chart.high = function(_) {
- if (!arguments.length) return getHigh;
- getHigh = _;
- return chart;
- };
+ dimensions.select('.nv-parallelCoordinates-brush')
+ .each(function (d) {
+ d3.select(this).call(y[d].brush);
+ })
+ .selectAll('rect')
+ .attr('x', -8)
+ .attr('width', 16);
+
+ // Returns the path for a given data point.
+ function path(d) {
+ return line(dimensionNames.map(function (p) {
+ //If value if missing, put the value on the missing value line
+ if(isNaN(d[p]) || isNaN(parseFloat(d[p]))) {
+ var domain = y[p].domain();
+ var range = y[p].range();
+ var min = domain[0] - (domain[1] - domain[0]) / 9;
+
+ //If it's not already the case, allow brush to select undefined values
+ if(axisWithMissingValues.indexOf(p) < 0) {
+
+ var newscale = d3.scale.linear().domain([min, domain[1]]).range([availableHeight - 12, range[1]]);
+ y[p].brush.y(newscale);
+ axisWithMissingValues.push(p);
+ }
+
+ return [x(p), y[p](min)];
+ }
- chart.low = function(_) {
- if (!arguments.length) return getLow;
- getLow = _;
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ //If parallelCoordinate contain missing values show the missing values line otherwise, hide it.
+ if(axisWithMissingValues.length > 0) {
+ missingValuesline.style("display", "inline");
+ missingValueslineText.style("display", "inline");
+ } else {
+ missingValuesline.style("display", "none");
+ missingValueslineText.style("display", "none");
+ }
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ return [x(p), y[p](d[p])];
+ }));
+ }
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ // Handles a brush event, toggling the display of foreground lines.
+ function brush() {
+ var actives = dimensionNames.filter(function(p) { return !y[p].brush.empty(); }),
+ extents = actives.map(function(p) { return y[p].brush.extent(); });
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
+ filters = []; //erase current filters
+ actives.forEach(function(d,i) {
+ filters[i] = {
+ dimension: d,
+ extent: extents[i]
+ }
+ });
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
+ active = []; //erase current active list
+ foreground.style('display', function(d) {
+ var isActive = actives.every(function(p, i) {
+ if(isNaN(d[p]) && extents[i][0] == y[p].brush.y().domain()[0]) return true;
+ return extents[i][0] <= d[p] && d[p] <= extents[i][1];
+ });
+ if (isActive) active.push(d);
+ return isActive ? null : 'none';
+ });
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
+ dispatch.brush({
+ filters: filters,
+ active: active
+ });
+ }
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
+ function dragStart(d, i) {
+ dragging[d] = this.parentNode.__origin__ = x(d);
+ background.attr("visibility", "hidden");
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
+ }
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
+ function dragMove(d, i) {
+ dragging[d] = Math.min(availableWidth, Math.max(0, this.parentNode.__origin__ += d3.event.x));
+ foreground.attr("d", path);
+ dimensionNames.sort(function (a, b) { return position(a) - position(b); });
+ x.domain(dimensionNames);
+ dimensions.attr("transform", function(d) { return "translate(" + position(d) + ")"; });
+ }
- chart.forceX = function(_) {
- if (!arguments.length) return forceX;
- forceX = _;
- return chart;
- };
+ function dragEnd(d, i) {
+ delete this.parentNode.__origin__;
+ delete dragging[d];
+ d3.select(this.parentNode).attr("transform", "translate(" + x(d) + ")");
+ foreground
+ .attr("d", path);
+ background
+ .attr("d", path)
+ .attr("visibility", null);
- chart.forceY = function(_) {
- if (!arguments.length) return forceY;
- forceY = _;
- return chart;
- };
+ }
- chart.padData = function(_) {
- if (!arguments.length) return padData;
- padData = _;
- return chart;
- };
+ function position(d) {
+ var v = dragging[d];
+ return v == null ? x(d) : v;
+ }
+ });
- chart.clipEdge = function(_) {
- if (!arguments.length) return clipEdge;
- clipEdge = _;
- return chart;
- };
+ return chart;
+ }
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width= _;}},
+ height: {get: function(){return height;}, set: function(_){height= _;}},
+ dimensionNames: {get: function() { return dimensionNames;}, set: function(_){dimensionNames= _;}},
+ dimensionFormats : {get: function(){return dimensionFormats;}, set: function (_){dimensionFormats=_;}},
+ lineTension: {get: function(){return lineTension;}, set: function(_){lineTension = _;}},
+
+ // deprecated options
+ dimensions: {get: function (){return dimensionNames;}, set: function(_){
+ // deprecated after 1.8.1
+ nv.deprecated('dimensions', 'use dimensionNames instead');
+ dimensionNames = _;
+ }},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
+ });
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
+ nv.utils.initOptions(chart);
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
+};
nv.models.pie = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 500
- , height = 500
- , getX = function(d) { return d.x }
- , getY = function(d) { return d.y }
- , getDescription = function(d) { return d.description }
- , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
- , color = nv.utils.defaultColor()
- , valueFormat = d3.format(',.2f')
- , showLabels = true
- , pieLabelsOutside = true
- , donutLabelsOutside = false
- , labelType = "key"
- , labelThreshold = .02 //if slice percentage is under this, don't show label
- , donut = false
- , labelSunbeamLayout = false
- , startAngle = false
- , endAngle = false
- , donutRatio = 0.5
- , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout')
- ;
-
- //============================================================
-
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 500
+ , height = 500
+ , 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
+ , container = null
+ , color = nv.utils.defaultColor()
+ , valueFormat = d3.format(',.2f')
+ , showLabels = true
+ , labelsOutside = false
+ , labelType = "key"
+ , labelThreshold = .02 //if slice percentage is under this, don't show label
+ , donut = false
+ , title = false
+ , growOnHover = true
+ , titleOffset = 0
+ , labelSunbeamLayout = false
+ , startAngle = false
+ , padAngle = false
+ , endAngle = false
+ , cornerRadius = 0
+ , donutRatio = 0.5
+ , arcsRadius = []
+ , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'elementMousemove', 'renderEnd')
+ ;
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- radius = Math.min(availableWidth, availableHeight) / 2,
- arcRadius = radius-(radius / 5),
- container = d3.select(this);
+ var arcs = [];
+ var arcsOver = [];
+ //============================================================
+ // chart function
+ //------------------------------------------------------------
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ var renderWatch = nv.utils.renderWatch(dispatch);
- //var wrap = container.selectAll('.nv-wrap.nv-pie').data([data]);
- var wrap = container.selectAll('.nv-wrap.nv-pie').data(data);
- 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');
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right
+ , availableHeight = height - margin.top - margin.bottom
+ , radius = Math.min(availableWidth, availableHeight) / 2
+ , arcsRadiusOuter = []
+ , arcsRadiusInner = []
+ ;
- gEnter.append('g').attr('class', 'nv-pie');
- gEnter.append('g').attr('class', 'nv-pieLabels');
+ container = d3.select(this)
+ if (arcsRadius.length === 0) {
+ var outer = radius - radius / 5;
+ var inner = donutRatio * radius;
+ for (var i = 0; i < data[0].length; i++) {
+ arcsRadiusOuter.push(outer);
+ arcsRadiusInner.push(inner);
+ }
+ } else {
+ arcsRadiusOuter = arcsRadius.map(function (d) { return (d.outer - d.outer / 5) * radius; });
+ arcsRadiusInner = arcsRadius.map(function (d) { return (d.inner - d.inner / 5) * radius; });
+ donutRatio = d3.min(arcsRadius.map(function (d) { return (d.inner - d.inner / 5); }));
+ }
+ nv.utils.initSVG(container);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('.nv-wrap.nv-pie').data(data);
+ 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');
+ var g_pie = gEnter.append('g').attr('class', 'nv-pie');
+ gEnter.append('g').attr('class', 'nv-pieLabels');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ g.select('.nv-pie').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
+ g.select('.nv-pieLabels').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
+
+ //
+ container.on('click', function(d,i) {
+ dispatch.chartClick({
+ data: d,
+ index: i,
+ pos: d3.event,
+ id: id
+ });
+ });
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- g.select('.nv-pie').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
- g.select('.nv-pieLabels').attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
+ arcs = [];
+ arcsOver = [];
+ for (var i = 0; i < data[0].length; i++) {
- //------------------------------------------------------------
+ var arc = d3.svg.arc().outerRadius(arcsRadiusOuter[i]);
+ var arcOver = d3.svg.arc().outerRadius(arcsRadiusOuter[i] + 5);
+ if (startAngle !== false) {
+ arc.startAngle(startAngle);
+ arcOver.startAngle(startAngle);
+ }
+ if (endAngle !== false) {
+ arc.endAngle(endAngle);
+ arcOver.endAngle(endAngle);
+ }
+ if (donut) {
+ arc.innerRadius(arcsRadiusInner[i]);
+ arcOver.innerRadius(arcsRadiusInner[i]);
+ }
- container
- .on('click', function(d,i) {
- dispatch.chartClick({
- data: d,
- index: i,
- pos: d3.event,
- id: id
- });
- });
+ if (arc.cornerRadius && cornerRadius) {
+ arc.cornerRadius(cornerRadius);
+ arcOver.cornerRadius(cornerRadius);
+ }
+ arcs.push(arc);
+ arcsOver.push(arcOver);
+ }
- var arc = d3.svg.arc()
- .outerRadius(arcRadius);
+ // Setup the Pie chart and choose the data element
+ var pie = d3.layout.pie()
+ .sort(null)
+ .value(function(d) { return d.disabled ? 0 : getY(d) });
- if (startAngle) arc.startAngle(startAngle)
- if (endAngle) arc.endAngle(endAngle);
- if (donut) arc.innerRadius(radius * donutRatio);
+ // padAngle added in d3 3.5
+ if (pie.padAngle && padAngle) {
+ pie.padAngle(padAngle);
+ }
- // Setup the Pie chart and choose the data element
- var pie = d3.layout.pie()
- .sort(null)
- .value(function(d) { return d.disabled ? 0 : getY(d) });
+ // if title is specified and donut, put it in the middle
+ if (donut && title) {
+ g_pie.append("text").attr('class', 'nv-pie-title');
- var slices = wrap.select('.nv-pie').selectAll('.nv-slice')
- .data(pie);
+ wrap.select('.nv-pie-title')
+ .style("text-anchor", "middle")
+ .text(function (d) {
+ return title;
+ })
+ .style("font-size", (Math.min(availableWidth, availableHeight)) * donutRatio * 2 / (title.length + 2) + "px")
+ .attr("dy", "0.35em") // trick to vertically center text
+ .attr('transform', function(d, i) {
+ return 'translate(0, '+ titleOffset + ')';
+ });
+ }
- var pieLabels = wrap.select('.nv-pieLabels').selectAll('.nv-label')
- .data(pie);
+ var slices = wrap.select('.nv-pie').selectAll('.nv-slice').data(pie);
+ var pieLabels = wrap.select('.nv-pieLabels').selectAll('.nv-label').data(pie);
- slices.exit().remove();
- pieLabels.exit().remove();
+ slices.exit().remove();
+ pieLabels.exit().remove();
- var ae = slices.enter().append('g')
- .attr('class', 'nv-slice')
- .on('mouseover', function(d,i){
+ var ae = slices.enter().append('g');
+ ae.attr('class', 'nv-slice');
+ ae.on('mouseover', function(d, i) {
d3.select(this).classed('hover', true);
+ if (growOnHover) {
+ d3.select(this).select("path").transition()
+ .duration(70)
+ .attr("d", arcsOver[i]);
+ }
dispatch.elementMouseover({
- label: getX(d.data),
- value: getY(d.data),
- point: d.data,
- pointIndex: i,
- pos: [d3.event.pageX, d3.event.pageY],
- id: id
- });
- })
- .on('mouseout', function(d,i){
- d3.select(this).classed('hover', false);
- dispatch.elementMouseout({
- label: getX(d.data),
- value: getY(d.data),
- point: d.data,
+ data: d.data,
index: i,
- id: id
+ color: d3.select(this).style("fill")
});
- })
- .on('click', function(d,i) {
+ });
+ ae.on('mouseout', function(d, i) {
+ d3.select(this).classed('hover', false);
+ if (growOnHover) {
+ d3.select(this).select("path").transition()
+ .duration(50)
+ .attr("d", arcs[i]);
+ }
+ dispatch.elementMouseout({data: d.data, index: i});
+ });
+ ae.on('mousemove', function(d, i) {
+ dispatch.elementMousemove({data: d.data, index: i});
+ });
+ ae.on('click', function(d, i) {
dispatch.elementClick({
- label: getX(d.data),
- value: getY(d.data),
- point: d.data,
+ data: d.data,
index: i,
- pos: d3.event,
- id: id
+ color: d3.select(this).style("fill")
});
- d3.event.stopPropagation();
- })
- .on('dblclick', function(d,i) {
+ });
+ ae.on('dblclick', function(d, i) {
dispatch.elementDblClick({
- label: getX(d.data),
- value: getY(d.data),
- point: d.data,
+ data: d.data,
index: i,
- pos: d3.event,
- id: id
+ color: d3.select(this).style("fill")
});
- d3.event.stopPropagation();
- });
+ });
- slices
- .attr('fill', function(d,i) { return color(d, i); })
- .attr('stroke', function(d,i) { return color(d, i); });
-
- var paths = ae.append('path')
- .each(function(d) { this._current = d; });
- //.attr('d', arc);
-
- slices.select('path')
- .transition()
- .attr('d', arc)
- .attrTween('d', arcTween);
-
- if (showLabels) {
- // This does the normal label
- var labelsArc = d3.svg.arc().innerRadius(0);
-
- if (pieLabelsOutside){ labelsArc = arc; }
-
- if (donutLabelsOutside) { labelsArc = d3.svg.arc().outerRadius(arc.outerRadius()); }
-
- pieLabels.enter().append("g").classed("nv-label",true)
- .each(function(d,i) {
- var group = d3.select(this);
-
- group
- .attr('transform', function(d) {
- if (labelSunbeamLayout) {
- d.outerRadius = arcRadius + 10; // Set Outer Coordinate
- d.innerRadius = arcRadius + 15; // Set Inner Coordinate
- var rotateAngle = (d.startAngle + d.endAngle) / 2 * (180 / Math.PI);
- if ((d.startAngle+d.endAngle)/2 < Math.PI) {
- rotateAngle -= 90;
- } else {
- rotateAngle += 90;
- }
- return 'translate(' + labelsArc.centroid(d) + ') rotate(' + rotateAngle + ')';
- } else {
- d.outerRadius = radius + 10; // Set Outer Coordinate
- d.innerRadius = radius + 15; // Set Inner Coordinate
- return 'translate(' + labelsArc.centroid(d) + ')'
- }
- });
-
- group.append('rect')
- .style('stroke', '#fff')
- .style('fill', '#fff')
- .attr("rx", 3)
- .attr("ry", 3);
-
- group.append('text')
- .style('text-anchor', labelSunbeamLayout ? ((d.startAngle + d.endAngle) / 2 < Math.PI ? 'start' : 'end') : 'middle') //center the text on it's origin or begin/end if orthogonal aligned
- .style('fill', '#000')
+ slices.attr('fill', function(d,i) { return color(d.data, i); });
+ slices.attr('stroke', function(d,i) { return color(d.data, i); });
+ var paths = ae.append('path').each(function(d) {
+ this._current = d;
});
- var labelLocationHash = {};
- var avgHeight = 14;
- var avgWidth = 140;
- var createHashKey = function(coordinates) {
+ slices.select('path')
+ .transition()
+ .attr('d', function (d, i) { return arcs[i](d); })
+ .attrTween('d', arcTween);
+
+ if (showLabels) {
+ // This does the normal label
+ var labelsArc = [];
+ for (var i = 0; i < data[0].length; i++) {
+ labelsArc.push(arcs[i]);
+
+ if (labelsOutside) {
+ if (donut) {
+ labelsArc[i] = d3.svg.arc().outerRadius(arcs[i].outerRadius());
+ if (startAngle !== false) labelsArc[i].startAngle(startAngle);
+ if (endAngle !== false) labelsArc[i].endAngle(endAngle);
+ }
+ } else if (!donut) {
+ labelsArc[i].innerRadius(0);
+ }
+ }
- return Math.floor(coordinates[0]/avgWidth) * avgWidth + ',' + Math.floor(coordinates[1]/avgHeight) * avgHeight;
- };
- pieLabels.transition()
- .attr('transform', function(d) {
- if (labelSunbeamLayout) {
- d.outerRadius = arcRadius + 10; // Set Outer Coordinate
- d.innerRadius = arcRadius + 15; // Set Inner Coordinate
- var rotateAngle = (d.startAngle + d.endAngle) / 2 * (180 / Math.PI);
- if ((d.startAngle+d.endAngle)/2 < Math.PI) {
- rotateAngle -= 90;
- } else {
- rotateAngle += 90;
- }
- return 'translate(' + labelsArc.centroid(d) + ') rotate(' + rotateAngle + ')';
+ pieLabels.enter().append("g").classed("nv-label",true).each(function(d,i) {
+ var group = d3.select(this);
+
+ group.attr('transform', function (d, i) {
+ if (labelSunbeamLayout) {
+ d.outerRadius = arcsRadiusOuter[i] + 10; // Set Outer Coordinate
+ d.innerRadius = arcsRadiusOuter[i] + 15; // Set Inner Coordinate
+ var rotateAngle = (d.startAngle + d.endAngle) / 2 * (180 / Math.PI);
+ if ((d.startAngle + d.endAngle) / 2 < Math.PI) {
+ rotateAngle -= 90;
+ } else {
+ rotateAngle += 90;
+ }
+ return 'translate(' + labelsArc[i].centroid(d) + ') rotate(' + rotateAngle + ')';
+ } else {
+ d.outerRadius = radius + 10; // Set Outer Coordinate
+ d.innerRadius = radius + 15; // Set Inner Coordinate
+ return 'translate(' + labelsArc[i].centroid(d) + ')'
+ }
+ });
+
+ group.append('rect')
+ .style('stroke', '#fff')
+ .style('fill', '#fff')
+ .attr("rx", 3)
+ .attr("ry", 3);
+
+ group.append('text')
+ .style('text-anchor', labelSunbeamLayout ? ((d.startAngle + d.endAngle) / 2 < Math.PI ? 'start' : 'end') : 'middle') //center the text on it's origin or begin/end if orthogonal aligned
+ .style('fill', '#000')
+ });
+
+ var labelLocationHash = {};
+ var avgHeight = 14;
+ var avgWidth = 140;
+ var createHashKey = function(coordinates) {
+ return Math.floor(coordinates[0]/avgWidth) * avgWidth + ',' + Math.floor(coordinates[1]/avgHeight) * avgHeight;
+ };
+
+ pieLabels.watchTransition(renderWatch, 'pie labels').attr('transform', function (d, i) {
+ if (labelSunbeamLayout) {
+ d.outerRadius = arcsRadiusOuter[i] + 10; // Set Outer Coordinate
+ d.innerRadius = arcsRadiusOuter[i] + 15; // Set Inner Coordinate
+ var rotateAngle = (d.startAngle + d.endAngle) / 2 * (180 / Math.PI);
+ if ((d.startAngle + d.endAngle) / 2 < Math.PI) {
+ rotateAngle -= 90;
+ } else {
+ rotateAngle += 90;
+ }
+ return 'translate(' + labelsArc[i].centroid(d) + ') rotate(' + rotateAngle + ')';
} else {
- d.outerRadius = radius + 10; // Set Outer Coordinate
- d.innerRadius = radius + 15; // Set Inner Coordinate
-
- /*
- Overlapping pie labels are not good. What this attempts to do is, prevent overlapping.
- Each label location is hashed, and if a hash collision occurs, we assume an overlap.
- Adjust the label's y-position to remove the overlap.
- */
- var center = labelsArc.centroid(d);
- var hashKey = createHashKey(center);
- if (labelLocationHash[hashKey]) {
- center[1] -= avgHeight;
- }
- labelLocationHash[createHashKey(center)] = true;
- return 'translate(' + center + ')'
+ d.outerRadius = radius + 10; // Set Outer Coordinate
+ d.innerRadius = radius + 15; // Set Inner Coordinate
+
+ /*
+ Overlapping pie labels are not good. What this attempts to do is, prevent overlapping.
+ Each label location is hashed, and if a hash collision occurs, we assume an overlap.
+ Adjust the label's y-position to remove the overlap.
+ */
+ var center = labelsArc[i].centroid(d);
+ if (d.value) {
+ var hashKey = createHashKey(center);
+ if (labelLocationHash[hashKey]) {
+ center[1] -= avgHeight;
+ }
+ labelLocationHash[createHashKey(center)] = true;
+ }
+ return 'translate(' + center + ')'
}
});
- pieLabels.select(".nv-label text")
- .style('text-anchor', labelSunbeamLayout ? ((d.startAngle + d.endAngle) / 2 < Math.PI ? 'start' : 'end') : 'middle') //center the text on it's origin or begin/end if orthogonal aligned
- .text(function(d, i) {
- var percent = (d.endAngle - d.startAngle) / (2 * Math.PI);
- var labelTypes = {
- "key" : getX(d.data),
- "value": getY(d.data),
- "percent": d3.format('%')(percent)
- };
- return (d.value && percent > labelThreshold) ? labelTypes[labelType] : '';
- });
- }
-
-
- // Computes the angle of an arc, converting from radians to degrees.
- function angle(d) {
- var a = (d.startAngle + d.endAngle) * 90 / Math.PI - 90;
- return a > 90 ? a - 180 : a;
- }
-
- function arcTween(a) {
- a.endAngle = isNaN(a.endAngle) ? 0 : a.endAngle;
- a.startAngle = isNaN(a.startAngle) ? 0 : a.startAngle;
- if (!donut) a.innerRadius = 0;
- var i = d3.interpolate(this._current, a);
- this._current = i(0);
- return function(t) {
- return arc(i(t));
- };
- }
-
- function tweenPie(b) {
- b.innerRadius = 0;
- var i = d3.interpolate({startAngle: 0, endAngle: 0}, b);
- return function(t) {
- return arc(i(t));
- };
- }
-
- });
-
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.values = function(_) {
- nv.log("pie.values() is no longer supported.");
- return chart;
- };
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = _;
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = d3.functor(_);
- return chart;
- };
-
- chart.description = function(_) {
- if (!arguments.length) return getDescription;
- getDescription = _;
- return chart;
- };
-
- chart.showLabels = function(_) {
- if (!arguments.length) return showLabels;
- showLabels = _;
- return chart;
- };
-
- chart.labelSunbeamLayout = function(_) {
- if (!arguments.length) return labelSunbeamLayout;
- labelSunbeamLayout = _;
- return chart;
- };
-
- chart.donutLabelsOutside = function(_) {
- if (!arguments.length) return donutLabelsOutside;
- donutLabelsOutside = _;
- return chart;
- };
-
- chart.pieLabelsOutside = function(_) {
- if (!arguments.length) return pieLabelsOutside;
- pieLabelsOutside = _;
- return chart;
- };
-
- chart.labelType = function(_) {
- if (!arguments.length) return labelType;
- labelType = _;
- labelType = labelType || "key";
- return chart;
- };
-
- chart.donut = function(_) {
- if (!arguments.length) return donut;
- donut = _;
- return chart;
- };
-
- chart.donutRatio = function(_) {
- if (!arguments.length) return donutRatio;
- donutRatio = _;
- return chart;
- };
+ pieLabels.select(".nv-label text")
+ .style('text-anchor', function(d,i) {
+ //center the text on it's origin or begin/end if orthogonal aligned
+ return labelSunbeamLayout ? ((d.startAngle + d.endAngle) / 2 < Math.PI ? 'start' : 'end') : 'middle';
+ })
+ .text(function(d, i) {
+ var percent = (d.endAngle - d.startAngle) / (2 * Math.PI);
+ var label = '';
+ if (!d.value || percent < labelThreshold) return '';
+
+ if(typeof labelType === 'function') {
+ label = labelType(d, i, {
+ 'key': getX(d.data),
+ 'value': getY(d.data),
+ 'percent': valueFormat(percent)
+ });
+ } else {
+ switch (labelType) {
+ case 'key':
+ label = getX(d.data);
+ break;
+ case 'value':
+ label = valueFormat(getY(d.data));
+ break;
+ case 'percent':
+ label = d3.format('%')(percent);
+ break;
+ }
+ }
+ return label;
+ })
+ ;
+ }
- chart.startAngle = function(_) {
- if (!arguments.length) return startAngle;
- startAngle = _;
- return chart;
- };
- chart.endAngle = function(_) {
- if (!arguments.length) return endAngle;
- endAngle = _;
- return chart;
- };
+ // Computes the angle of an arc, converting from radians to degrees.
+ function angle(d) {
+ var a = (d.startAngle + d.endAngle) * 90 / Math.PI - 90;
+ return a > 90 ? a - 180 : a;
+ }
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
+ function arcTween(a, idx) {
+ a.endAngle = isNaN(a.endAngle) ? 0 : a.endAngle;
+ a.startAngle = isNaN(a.startAngle) ? 0 : a.startAngle;
+ if (!donut) a.innerRadius = 0;
+ var i = d3.interpolate(this._current, a);
+ this._current = i(0);
+ return function (t) {
+ return arcs[idx](i(t));
+ };
+ }
+ });
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
+ renderWatch.renderEnd('pie immediate');
+ return chart;
+ }
- chart.valueFormat = function(_) {
- if (!arguments.length) return valueFormat;
- valueFormat = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ arcsRadius: { get: function () { return arcsRadius; }, set: function (_) { arcsRadius = _; } },
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLabels: {get: function(){return showLabels;}, set: function(_){showLabels=_;}},
+ title: {get: function(){return title;}, set: function(_){title=_;}},
+ titleOffset: {get: function(){return titleOffset;}, set: function(_){titleOffset=_;}},
+ labelThreshold: {get: function(){return labelThreshold;}, set: function(_){labelThreshold=_;}},
+ valueFormat: {get: function(){return valueFormat;}, set: function(_){valueFormat=_;}},
+ x: {get: function(){return getX;}, set: function(_){getX=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ endAngle: {get: function(){return endAngle;}, set: function(_){endAngle=_;}},
+ startAngle: {get: function(){return startAngle;}, set: function(_){startAngle=_;}},
+ padAngle: {get: function(){return padAngle;}, set: function(_){padAngle=_;}},
+ cornerRadius: {get: function(){return cornerRadius;}, set: function(_){cornerRadius=_;}},
+ donutRatio: {get: function(){return donutRatio;}, set: function(_){donutRatio=_;}},
+ labelsOutside: {get: function(){return labelsOutside;}, set: function(_){labelsOutside=_;}},
+ labelSunbeamLayout: {get: function(){return labelSunbeamLayout;}, set: function(_){labelSunbeamLayout=_;}},
+ donut: {get: function(){return donut;}, set: function(_){donut=_;}},
+ growOnHover: {get: function(){return growOnHover;}, set: function(_){growOnHover=_;}},
+
+ // depreciated after 1.7.1
+ pieLabelsOutside: {get: function(){return labelsOutside;}, set: function(_){
+ labelsOutside=_;
+ nv.deprecated('pieLabelsOutside', 'use labelsOutside instead');
+ }},
+ // depreciated after 1.7.1
+ donutLabelsOutside: {get: function(){return labelsOutside;}, set: function(_){
+ labelsOutside=_;
+ nv.deprecated('donutLabelsOutside', 'use labelsOutside instead');
+ }},
+ // deprecated after 1.7.1
+ labelFormat: {get: function(){ return valueFormat;}, set: function(_) {
+ valueFormat=_;
+ nv.deprecated('labelFormat','use valueFormat instead');
+ }},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
+ margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
+ margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
+ margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
+ }},
+ y: {get: function(){return getY;}, set: function(_){
+ getY=d3.functor(_);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color=nv.utils.getColor(_);
+ }},
+ labelType: {get: function(){return labelType;}, set: function(_){
+ labelType= _ || 'key';
+ }}
+ });
- chart.labelThreshold = function(_) {
- if (!arguments.length) return labelThreshold;
- labelThreshold = _;
+ nv.utils.initOptions(chart);
return chart;
- };
- //============================================================
-
-
- return chart;
-}
+};
nv.models.pieChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var pie = nv.models.pie()
- , legend = nv.models.legend()
- ;
-
- var margin = {top: 30, right: 20, bottom: 20, left: 20}
- , width = null
- , height = null
- , showLegend = true
- , color = nv.utils.defaultColor()
- , tooltips = true
- , tooltip = function(key, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + '</p>'
- }
- , state = {}
- , defaultState = null
- , noData = "No Data Available."
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var showTooltip = function(e, offsetElement) {
- var tooltipLabel = pie.description()(e.point) || pie.x()(e.point)
- var left = e.pos[0] + ( (offsetElement && offsetElement.offsetLeft) || 0 ),
- top = e.pos[1] + ( (offsetElement && offsetElement.offsetTop) || 0),
- y = pie.valueFormat()(pie.y()(e.point)),
- content = tooltip(tooltipLabel, y, e, chart);
-
- nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
- };
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var pie = nv.models.pie();
+ var legend = nv.models.legend();
+ var tooltip = nv.models.tooltip();
+
+ var margin = {top: 30, right: 20, bottom: 20, left: 20}
+ , width = null
+ , height = null
+ , showLegend = true
+ , legendPosition = "top"
+ , color = nv.utils.defaultColor()
+ , state = nv.utils.state()
+ , defaultState = null
+ , noData = null
+ , duration = 250
+ , dispatch = d3.dispatch('stateChange', 'changeState','renderEnd')
+ ;
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ tooltip
+ .duration(0)
+ .headerEnabled(false)
+ .valueFormatter(function(d, i) {
+ return pie.valueFormat()(d, i);
+ });
- chart.update = function() { container.transition().call(chart); };
- chart.container = this;
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ var renderWatch = nv.utils.renderWatch(dispatch);
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled })
+ };
}
- }
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!data || !data.length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-pieWrap');
- gEnter.append('g').attr('class', 'nv-legendWrap');
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Legend
-
- if (showLegend) {
- legend
- .width( availableWidth )
- .key(pie.x());
-
- wrap.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;
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.active !== undefined) {
+ data.forEach(function (series, i) {
+ series.disabled = !state.active[i];
+ });
+ }
}
+ };
- wrap.select('.nv-legendWrap')
- .attr('transform', 'translate(0,' + (-margin.top) +')');
- }
+ //============================================================
+ // Chart function
+ //------------------------------------------------------------
- //------------------------------------------------------------
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(pie);
+ selection.each(function(data) {
+ var container = d3.select(this);
+ nv.utils.initSVG(container);
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ var that = this;
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ chart.update = function() { container.transition().call(chart); };
+ chart.container = this;
- //------------------------------------------------------------
- // Main Chart Component(s)
+ state.setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
- pie
- .width(availableWidth)
- .height(availableHeight);
+ //set state.disabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- var pieWrap = g.select('.nv-pieWrap')
- .datum([data]);
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length) {
+ nv.utils.noData(chart, container);
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- d3.transition(pieWrap).call(pie);
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
- //------------------------------------------------------------
+ gEnter.append('g').attr('class', 'nv-pieWrap');
+ gEnter.append('g').attr('class', 'nv-legendWrap');
+ // Legend
+ if (showLegend) {
+ if (legendPosition === "top") {
+ legend.width( availableWidth ).key(pie.x());
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ wrap.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
- legend.dispatch.on('stateChange', function(newState) {
- state = newState;
- dispatch.stateChange(state);
- chart.update();
- });
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- pie.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
+ wrap.select('.nv-legendWrap')
+ .attr('transform', 'translate(0,' + (-margin.top) +')');
+ } else if (legendPosition === "right") {
+ var legendWidth = nv.models.legend().width();
+ if (availableWidth / 2 < legendWidth) {
+ legendWidth = (availableWidth / 2)
+ }
+ legend.height(availableHeight).key(pie.x());
+ legend.width(legendWidth);
+ availableWidth -= legend.width();
+
+ wrap.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend)
+ .attr('transform', 'translate(' + (availableWidth) +',0)');
+ }
+ }
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
+ // Main Chart Component(s)
+ pie.width(availableWidth).height(availableHeight);
+ var pieWrap = g.select('.nv-pieWrap').datum([data]);
+ d3.transition(pieWrap).call(pie);
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- state.disabled = e.disabled;
- }
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState) {
+ state[key] = newState[key];
+ }
+ dispatch.stateChange(state);
+ chart.update();
+ });
- chart.update();
- });
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
+ state.disabled = e.disabled;
+ }
+ chart.update();
+ });
+ });
- //============================================================
+ renderWatch.renderEnd('pieChart immediate');
+ return chart;
+ }
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
+ pie.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt['series'] = {
+ key: chart.x()(evt.data),
+ value: chart.y()(evt.data),
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
});
- return chart;
- }
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- pie.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top];
- dispatch.tooltipShow(e);
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e);
- });
-
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.legend = legend;
- chart.dispatch = dispatch;
- chart.pie = pie;
-
- d3.rebind(chart, pie, 'valueFormat', 'values', 'x', 'y', 'description', 'id', 'showLabels', 'donutLabelsOutside', 'pieLabelsOutside', 'labelType', 'donut', 'donutRatio', 'labelThreshold');
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- pie.color(color);
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
+ pie.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
+ pie.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.legend = legend;
+ chart.dispatch = dispatch;
+ chart.pie = pie;
+ chart.tooltip = tooltip;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ // use Object get/set functionality to map between vars and chart functions
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ legendPosition: {get: function(){return legendPosition;}, set: function(_){legendPosition=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+
+ // options that require extra logic in the setter
+ color: {get: function(){return color;}, set: function(_){
+ color = _;
+ legend.color(color);
+ pie.color(color);
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ }},
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }}
+ });
+ nv.utils.inheritOptions(chart, pie);
+ nv.utils.initOptions(chart);
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
+};
nv.models.scatter = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , color = nv.utils.defaultColor() // chooses color
- , id = Math.floor(Math.random() * 100000) //Create semi-unique ID incase user doesn't select one
- , x = d3.scale.linear()
- , y = d3.scale.linear()
- , z = d3.scale.linear() //linear because d3.svg.shape.size is treated as area
- , getX = function(d) { return d.x } // accessor to get the x value
- , getY = function(d) { return d.y } // accessor to get the y value
- , getSize = function(d) { return d.size || 1} // accessor to get the point size
- , getShape = function(d) { return d.shape || 'circle' } // accessor to get point shape
- , onlyCircles = true // Set to false to use shapes
- , forceX = [] // List of numbers to Force into the X scale (ie. 0, or a max / min, etc.)
- , forceY = [] // List of numbers to Force into the Y scale
- , forceSize = [] // List of numbers to Force into the Size scale
- , interactive = true // If true, plots a voronoi overlay for advanced point intersection
- , pointKey = null
- , pointActive = function(d) { return !d.notActive } // any points that return false will be filtered out
- , padData = false // If true, adds half a data points width to front and back, for lining up a line chart with a bar chart
- , padDataOuter = .1 //outerPadding to imitate ordinal scale outer padding
- , clipEdge = false // if true, masks points within x and y scale
- , clipVoronoi = true // if true, masks each point with a circle... can turn off to slightly increase performance
- , clipRadius = function() { return 25 } // function to get the radius for voronoi point clips
- , xDomain = null // Override x domain (skips the calculation from data)
- , yDomain = null // Override y domain
- , xRange = null // Override x range
- , yRange = null // Override y range
- , sizeDomain = null // Override point size domain
- , sizeRange = null
- , singlePoint = false
- , dispatch = d3.dispatch('elementClick', 'elementMouseover', 'elementMouseout')
- , useVoronoi = true
- ;
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var x0, y0, z0 // used to store previous scales
- , timeoutID
- , needsUpdate = false // Flag for when the points are visually updating, but the interactive layer is behind, to disable tooltips
- ;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
-
- //add series index to each data point for reference
- data.forEach(function(series, i) {
- series.values.forEach(function(point) {
- point.series = i;
- });
- });
-
- //------------------------------------------------------------
- // Setup Scales
-
- // remap and flatten the data for use in calculating the scales' domains
- var seriesData = (xDomain && yDomain && sizeDomain) ? [] : // if we know xDomain and yDomain and sizeDomain, no need to calculate.... if Size is constant remember to set sizeDomain to speed up performance
- d3.merge(
- data.map(function(d) {
- return d.values.map(function(d,i) {
- return { x: getX(d,i), y: getY(d,i), size: getSize(d,i) }
- })
- })
- );
-
- x .domain(xDomain || d3.extent(seriesData.map(function(d) { return d.x; }).concat(forceX)))
-
- if (padData && data[0])
- x.range(xRange || [(availableWidth * padDataOuter + availableWidth) / (2 *data[0].values.length), availableWidth - availableWidth * (1 + padDataOuter) / (2 * data[0].values.length) ]);
- //x.range([availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
- else
- x.range(xRange || [0, availableWidth]);
-
- y .domain(yDomain || d3.extent(seriesData.map(function(d) { return d.y }).concat(forceY)))
- .range(yRange || [availableHeight, 0]);
-
- z .domain(sizeDomain || d3.extent(seriesData.map(function(d) { return d.size }).concat(forceSize)))
- .range(sizeRange || [16, 256]);
-
- // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
- if (x.domain()[0] === x.domain()[1] || y.domain()[0] === y.domain()[1]) singlePoint = true;
- if (x.domain()[0] === x.domain()[1])
- x.domain()[0] ?
- x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
- : x.domain([-1,1]);
-
- 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])
- : y.domain([-1,1]);
-
- if ( isNaN(x.domain()[0])) {
- x.domain([-1,1]);
- }
-
- if ( isNaN(y.domain()[0])) {
- y.domain([-1,1]);
- }
-
-
- x0 = x0 || x;
- y0 = y0 || y;
- z0 = z0 || z;
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = null
+ , height = null
+ , color = nv.utils.defaultColor() // chooses color
+ , id = Math.floor(Math.random() * 100000) //Create semi-unique ID incase user doesn't select one
+ , container = null
+ , x = d3.scale.linear()
+ , y = d3.scale.linear()
+ , z = d3.scale.linear() //linear because d3.svg.shape.size is treated as area
+ , getX = function(d) { return d.x } // accessor to get the x value
+ , getY = function(d) { return d.y } // accessor to get the y value
+ , getSize = function(d) { return d.size || 1} // accessor to get the point size
+ , getShape = function(d) { return d.shape || 'circle' } // accessor to get point shape
+ , forceX = [] // List of numbers to Force into the X scale (ie. 0, or a max / min, etc.)
+ , forceY = [] // List of numbers to Force into the Y scale
+ , forceSize = [] // List of numbers to Force into the Size scale
+ , interactive = true // If true, plots a voronoi overlay for advanced point intersection
+ , pointActive = function(d) { return !d.notActive } // any points that return false will be filtered out
+ , padData = false // If true, adds half a data points width to front and back, for lining up a line chart with a bar chart
+ , padDataOuter = .1 //outerPadding to imitate ordinal scale outer padding
+ , clipEdge = false // if true, masks points within x and y scale
+ , clipVoronoi = true // if true, masks each point with a circle... can turn off to slightly increase performance
+ , showVoronoi = false // display the voronoi areas
+ , clipRadius = function() { return 25 } // function to get the radius for voronoi point clips
+ , xDomain = null // Override x domain (skips the calculation from data)
+ , yDomain = null // Override y domain
+ , xRange = null // Override x range
+ , yRange = null // Override y range
+ , sizeDomain = null // Override point size domain
+ , sizeRange = null
+ , singlePoint = false
+ , dispatch = d3.dispatch('elementClick', 'elementDblClick', 'elementMouseover', 'elementMouseout', 'renderEnd')
+ , useVoronoi = true
+ , duration = 250
+ ;
- //------------------------------------------------------------
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ var x0, y0, z0 // used to store previous scales
+ , timeoutID
+ , needsUpdate = false // Flag for when the points are visually updating, but the interactive layer is behind, to disable tooltips
+ , renderWatch = nv.utils.renderWatch(dispatch, duration)
+ , _sizeRange_def = [16, 256]
+ ;
- 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');
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- gEnter.append('g').attr('class', 'nv-groups');
- gEnter.append('g').attr('class', 'nv-point-paths');
+ nv.utils.initSVG(container);
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ //add series index to each data point for reference
+ data.forEach(function(series, i) {
+ series.values.forEach(function(point) {
+ point.series = i;
+ });
+ });
- //------------------------------------------------------------
+ // Setup Scales
+ // remap and flatten the data for use in calculating the scales' domains
+ var seriesData = (xDomain && yDomain && sizeDomain) ? [] : // if we know xDomain and yDomain and sizeDomain, no need to calculate.... if Size is constant remember to set sizeDomain to speed up performance
+ d3.merge(
+ data.map(function(d) {
+ return d.values.map(function(d,i) {
+ return { x: getX(d,i), y: getY(d,i), size: getSize(d,i) }
+ })
+ })
+ );
+ x .domain(xDomain || d3.extent(seriesData.map(function(d) { return d.x; }).concat(forceX)))
- defsEnter.append('clipPath')
- .attr('id', 'nv-edge-clip-' + id)
- .append('rect');
+ if (padData && data[0])
+ x.range(xRange || [(availableWidth * padDataOuter + availableWidth) / (2 *data[0].values.length), availableWidth - availableWidth * (1 + padDataOuter) / (2 * data[0].values.length) ]);
+ //x.range([availableWidth * .5 / data[0].values.length, availableWidth * (data[0].values.length - .5) / data[0].values.length ]);
+ else
+ x.range(xRange || [0, availableWidth]);
- wrap.select('#nv-edge-clip-' + id + ' rect')
- .attr('width', availableWidth)
- .attr('height', (availableHeight > 0) ? availableHeight : 0);
+ y .domain(yDomain || d3.extent(seriesData.map(function(d) { return d.y }).concat(forceY)))
+ .range(yRange || [availableHeight, 0]);
- g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
+ z .domain(sizeDomain || d3.extent(seriesData.map(function(d) { return d.size }).concat(forceSize)))
+ .range(sizeRange || _sizeRange_def);
+ // If scale's domain don't have a range, slightly adjust to make one... so a chart can show a single data point
+ singlePoint = x.domain()[0] === x.domain()[1] || y.domain()[0] === y.domain()[1];
- function updateInteractiveLayer() {
+ if (x.domain()[0] === x.domain()[1])
+ x.domain()[0] ?
+ x.domain([x.domain()[0] - x.domain()[0] * 0.01, x.domain()[1] + x.domain()[1] * 0.01])
+ : x.domain([-1,1]);
- if (!interactive) return false;
+ 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])
+ : y.domain([-1,1]);
- var eventElements;
+ if ( isNaN(x.domain()[0])) {
+ x.domain([-1,1]);
+ }
- var vertices = d3.merge(data.map(function(group, groupIndex) {
- return group.values
- .map(function(point, pointIndex) {
- // *Adding noise to make duplicates very unlikely
- // *Injecting series and point index for reference
- /* *Adding a 'jitter' to the points, because there's an issue in d3.geom.voronoi.
- */
- var pX = getX(point,pointIndex);
- var pY = getY(point,pointIndex);
+ if ( isNaN(y.domain()[0])) {
+ y.domain([-1,1]);
+ }
- return [x(pX)+ Math.random() * 1e-7,
- y(pY)+ Math.random() * 1e-7,
- groupIndex,
- pointIndex, point]; //temp hack to add noise untill I think of a better way so there are no duplicates
- })
- .filter(function(pointArray, pointIndex) {
- return pointActive(pointArray[4], pointIndex); // Issue #237.. move filter to after map, so pointIndex is correct!
- })
- })
- );
-
-
-
- //inject series and point index for reference into voronoi
- if (useVoronoi === true) {
-
- if (clipVoronoi) {
- var pointClipsEnter = wrap.select('defs').selectAll('.nv-point-clips')
- .data([id])
- .enter();
-
- pointClipsEnter.append('clipPath')
- .attr('class', 'nv-point-clips')
- .attr('id', 'nv-points-clip-' + id);
-
- var pointClips = wrap.select('#nv-points-clip-' + id).selectAll('circle')
- .data(vertices);
- pointClips.enter().append('circle')
- .attr('r', clipRadius);
- pointClips.exit().remove();
- pointClips
- .attr('cx', function(d) { return d[0] })
- .attr('cy', function(d) { return d[1] });
-
- wrap.select('.nv-point-paths')
- .attr('clip-path', 'url(#nv-points-clip-' + id + ')');
- }
-
-
- if(vertices.length) {
- // Issue #283 - Adding 2 dummy points to the voronoi b/c voronoi requires min 3 points to work
- vertices.push([x.range()[0] - 20, y.range()[0] - 20, null, null]);
- vertices.push([x.range()[1] + 20, y.range()[1] + 20, null, null]);
- vertices.push([x.range()[0] - 20, y.range()[0] + 20, null, null]);
- vertices.push([x.range()[1] + 20, y.range()[1] - 20, null, null]);
- }
-
- var bounds = d3.geom.polygon([
- [-10,-10],
- [-10,height + 10],
- [width + 10,height + 10],
- [width + 10,-10]
- ]);
-
- var voronoi = d3.geom.voronoi(vertices).map(function(d, i) {
- return {
- 'data': bounds.clip(d),
- 'series': vertices[i][2],
- 'point': vertices[i][3]
- }
- });
+ x0 = x0 || x;
+ y0 = y0 || y;
+ z0 = z0 || z;
+
+ // Setup containers and skeleton of chart
+ 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);
+ var defsEnter = wrapEnter.append('defs');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
+
+ wrap.classed('nv-single-point', singlePoint);
+ gEnter.append('g').attr('class', 'nv-groups');
+ gEnter.append('g').attr('class', 'nv-point-paths');
+ wrapEnter.append('g').attr('class', 'nv-point-clips');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-edge-clip-' + id)
+ .append('rect');
+
+ wrap.select('#nv-edge-clip-' + id + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', (availableHeight > 0) ? availableHeight : 0);
+
+ g.attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
+
+ function updateInteractiveLayer() {
+ // Always clear needs-update flag regardless of whether or not
+ // we will actually do anything (avoids needless invocations).
+ needsUpdate = false;
+
+ if (!interactive) return false;
+
+ // inject series and point index for reference into voronoi
+ if (useVoronoi === true) {
+ var vertices = d3.merge(data.map(function(group, groupIndex) {
+ return group.values
+ .map(function(point, pointIndex) {
+ // *Adding noise to make duplicates very unlikely
+ // *Injecting series and point index for reference
+ /* *Adding a 'jitter' to the points, because there's an issue in d3.geom.voronoi.
+ */
+ var pX = getX(point,pointIndex);
+ var pY = getY(point,pointIndex);
+
+ return [x(pX)+ Math.random() * 1e-4,
+ y(pY)+ Math.random() * 1e-4,
+ groupIndex,
+ pointIndex, point]; //temp hack to add noise until I think of a better way so there are no duplicates
+ })
+ .filter(function(pointArray, pointIndex) {
+ return pointActive(pointArray[4], pointIndex); // Issue #237.. move filter to after map, so pointIndex is correct!
+ })
+ })
+ );
+
+ if (vertices.length == 0) return false; // No active points, we're done
+ if (vertices.length < 3) {
+ // Issue #283 - Adding 2 dummy points to the voronoi b/c voronoi requires min 3 points to work
+ vertices.push([x.range()[0] - 20, y.range()[0] - 20, null, null]);
+ vertices.push([x.range()[1] + 20, y.range()[1] + 20, null, null]);
+ vertices.push([x.range()[0] - 20, y.range()[0] + 20, null, null]);
+ vertices.push([x.range()[1] + 20, y.range()[1] - 20, null, null]);
+ }
+ // keep voronoi sections from going more than 10 outside of graph
+ // to avoid overlap with other things like legend etc
+ var bounds = d3.geom.polygon([
+ [-10,-10],
+ [-10,height + 10],
+ [width + 10,height + 10],
+ [width + 10,-10]
+ ]);
+
+ var voronoi = d3.geom.voronoi(vertices).map(function(d, i) {
+ return {
+ 'data': bounds.clip(d),
+ 'series': vertices[i][2],
+ 'point': vertices[i][3]
+ }
+ });
+
+ // nuke all voronoi paths on reload and recreate them
+ wrap.select('.nv-point-paths').selectAll('path').remove();
+ var pointPaths = wrap.select('.nv-point-paths').selectAll('path').data(voronoi);
+ var vPointPaths = pointPaths
+ .enter().append("svg:path")
+ .attr("d", function(d) {
+ if (!d || !d.data || d.data.length === 0)
+ return 'M 0 0';
+ else
+ return "M" + d.data.join(",") + "Z";
+ })
+ .attr("id", function(d,i) {
+ return "nv-path-"+i; })
+ .attr("clip-path", function(d,i) { return "url(#nv-clip-"+id+"-"+i+")"; })
+ ;
- var pointPaths = wrap.select('.nv-point-paths').selectAll('path')
- .data(voronoi);
- pointPaths.enter().append('path')
- .attr('class', function(d,i) { return 'nv-path-'+i; });
- pointPaths.exit().remove();
- pointPaths
- .attr('d', function(d) {
- if (d.data.length === 0)
- return 'M 0 0'
- else
- return 'M' + d.data.join('L') + 'Z';
- });
+ // good for debugging point hover issues
+ if (showVoronoi) {
+ vPointPaths.style("fill", d3.rgb(230, 230, 230))
+ .style('fill-opacity', 0.4)
+ .style('stroke-opacity', 1)
+ .style("stroke", d3.rgb(200,200,200));
+ }
- var mouseEventCallback = function(d,mDispatch) {
- if (needsUpdate) return 0;
- var series = data[d.series];
- if (typeof series === 'undefined') return;
+ if (clipVoronoi) {
+ // voronoi sections are already set to clip,
+ // just create the circles with the IDs they expect
+ wrap.select('.nv-point-clips').selectAll('*').remove(); // must do * since it has sub-dom
+ var pointClips = wrap.select('.nv-point-clips').selectAll('clipPath').data(vertices);
+ var vPointClips = pointClips
+ .enter().append("svg:clipPath")
+ .attr("id", function(d, i) { return "nv-clip-"+id+"-"+i;})
+ .append("svg:circle")
+ .attr('cx', function(d) { return d[0]; })
+ .attr('cy', function(d) { return d[1]; })
+ .attr('r', clipRadius);
+ }
- var point = series.values[d.point];
+ var mouseEventCallback = function(d, mDispatch) {
+ if (needsUpdate) return 0;
+ var series = data[d.series];
+ if (series === undefined) return;
+ var point = series.values[d.point];
+ point['color'] = color(series, d.series);
+
+ // standardize attributes for tooltip.
+ point['x'] = getX(point);
+ point['y'] = getY(point);
+
+ // can't just get box of event node since it's actually a voronoi polygon
+ var box = container.node().getBoundingClientRect();
+ var scrollTop = window.pageYOffset || document.documentElement.scrollTop;
+ var scrollLeft = window.pageXOffset || document.documentElement.scrollLeft;
+
+ var pos = {
+ left: x(getX(point, d.point)) + box.left + scrollLeft + margin.left + 10,
+ top: y(getY(point, d.point)) + box.top + scrollTop + margin.top + 10
+ };
+
+ mDispatch({
+ point: point,
+ series: series,
+ pos: pos,
+ relativePos: [x(getX(point, d.point)) + margin.left, y(getY(point, d.point)) + margin.top],
+ seriesIndex: d.series,
+ pointIndex: d.point
+ });
+ };
- mDispatch({
- point: point,
- series: series,
- pos: [x(getX(point, d.point)) + margin.left, y(getY(point, d.point)) + margin.top],
- seriesIndex: d.series,
- pointIndex: d.point
- });
- };
+ pointPaths
+ .on('click', function(d) {
+ mouseEventCallback(d, dispatch.elementClick);
+ })
+ .on('dblclick', function(d) {
+ mouseEventCallback(d, dispatch.elementDblClick);
+ })
+ .on('mouseover', function(d) {
+ mouseEventCallback(d, dispatch.elementMouseover);
+ })
+ .on('mouseout', function(d, i) {
+ mouseEventCallback(d, dispatch.elementMouseout);
+ });
- pointPaths
- .on('click', function(d) {
- mouseEventCallback(d, dispatch.elementClick);
- })
- .on('mouseover', function(d) {
- mouseEventCallback(d, dispatch.elementMouseover);
- })
- .on('mouseout', function(d, i) {
- mouseEventCallback(d, dispatch.elementMouseout);
- });
+ } else {
+ // add event handlers to points instead voronoi paths
+ wrap.select('.nv-groups').selectAll('.nv-group')
+ .selectAll('.nv-point')
+ //.data(dataWithPoints)
+ //.style('pointer-events', 'auto') // recativate events, disabled by css
+ .on('click', function(d,i) {
+ //nv.log('test', d, i);
+ if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
+ var series = data[d.series],
+ point = series.values[i];
+
+ dispatch.elementClick({
+ point: point,
+ series: series,
+ pos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top], //TODO: make this pos base on the page
+ relativePos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],
+ seriesIndex: d.series,
+ pointIndex: i
+ });
+ })
+ .on('dblclick', function(d,i) {
+ if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
+ var series = data[d.series],
+ point = series.values[i];
+
+ dispatch.elementDblClick({
+ point: point,
+ series: series,
+ pos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],//TODO: make this pos base on the page
+ relativePos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],
+ seriesIndex: d.series,
+ pointIndex: i
+ });
+ })
+ .on('mouseover', function(d,i) {
+ if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
+ var series = data[d.series],
+ point = series.values[i];
+
+ dispatch.elementMouseover({
+ point: point,
+ series: series,
+ pos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],//TODO: make this pos base on the page
+ relativePos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],
+ seriesIndex: d.series,
+ pointIndex: i,
+ color: color(d, i)
+ });
+ })
+ .on('mouseout', function(d,i) {
+ if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
+ var series = data[d.series],
+ point = series.values[i];
+ dispatch.elementMouseout({
+ point: point,
+ series: series,
+ pos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],//TODO: make this pos base on the page
+ relativePos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],
+ seriesIndex: d.series,
+ pointIndex: i,
+ color: color(d, i)
+ });
+ });
+ }
+ }
- } else {
- /*
- // bring data in form needed for click handlers
- var dataWithPoints = vertices.map(function(d, i) {
- return {
- 'data': d,
- 'series': vertices[i][2],
- 'point': vertices[i][3]
- }
+ needsUpdate = true;
+ 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)
+ .style('fill-opacity', 1e-6);
+ groups.exit()
+ .remove();
+ groups
+ .attr('class', function(d,i) { return 'nv-group nv-series-' + i })
+ .classed('hover', function(d) { return d.hover });
+ groups.watchTransition(renderWatch, 'scatter: groups')
+ .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);
+
+ // create the points, maintaining their IDs from the original data set
+ var points = groups.selectAll('path.nv-point')
+ .data(function(d) {
+ return d.values.map(
+ function (point, pointIndex) {
+ return [point, pointIndex]
+ }).filter(
+ function(pointArray, pointIndex) {
+ return pointActive(pointArray[0], pointIndex)
+ })
+ });
+ points.enter().append('path')
+ .style('fill', function (d) { return d.color })
+ .style('stroke', function (d) { return d.color })
+ .attr('transform', function(d) {
+ return 'translate(' + x0(getX(d[0],d[1])) + ',' + y0(getY(d[0],d[1])) + ')'
+ })
+ .attr('d',
+ nv.utils.symbol()
+ .type(function(d) { return getShape(d[0]); })
+ .size(function(d) { return z(getSize(d[0],d[1])) })
+ );
+ points.exit().remove();
+ groups.exit().selectAll('path.nv-point')
+ .watchTransition(renderWatch, 'scatter exit')
+ .attr('transform', function(d) {
+ return 'translate(' + x(getX(d[0],d[1])) + ',' + y(getY(d[0],d[1])) + ')'
+ })
+ .remove();
+ points.each(function(d) {
+ d3.select(this)
+ .classed('nv-point', true)
+ .classed('nv-point-' + d[1], true)
+ .classed('nv-noninteractive', !interactive)
+ .classed('hover',false)
+ ;
});
- */
-
- // add event handlers to points instead voronoi paths
- wrap.select('.nv-groups').selectAll('.nv-group')
- .selectAll('.nv-point')
- //.data(dataWithPoints)
- //.style('pointer-events', 'auto') // recativate events, disabled by css
- .on('click', function(d,i) {
- //nv.log('test', d, i);
- if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
- var series = data[d.series],
- point = series.values[i];
+ points
+ .watchTransition(renderWatch, 'scatter points')
+ .attr('transform', function(d) {
+ //nv.log(d, getX(d[0],d[1]), x(getX(d[0],d[1])));
+ return 'translate(' + x(getX(d[0],d[1])) + ',' + y(getY(d[0],d[1])) + ')'
+ })
+ .attr('d',
+ nv.utils.symbol()
+ .type(function(d) { return getShape(d[0]); })
+ .size(function(d) { return z(getSize(d[0],d[1])) })
+ );
- dispatch.elementClick({
- point: point,
- series: series,
- pos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],
- seriesIndex: d.series,
- pointIndex: i
- });
- })
- .on('mouseover', function(d,i) {
- if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
- var series = data[d.series],
- point = series.values[i];
+ // Delay updating the invisible interactive layer for smoother animation
+ clearTimeout(timeoutID); // stop repeat calls to updateInteractiveLayer
+ timeoutID = setTimeout(updateInteractiveLayer, 300);
+ //updateInteractiveLayer();
- dispatch.elementMouseover({
- point: point,
- series: series,
- pos: [x(getX(point, i)) + margin.left, y(getY(point, i)) + margin.top],
- seriesIndex: d.series,
- pointIndex: i
- });
- })
- .on('mouseout', function(d,i) {
- if (needsUpdate || !data[d.series]) return 0; //check if this is a dummy point
- var series = data[d.series],
- point = series.values[i];
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
+ z0 = z.copy();
- dispatch.elementMouseout({
- point: point,
- series: series,
- seriesIndex: d.series,
- pointIndex: i
- });
- });
- }
-
- needsUpdate = false;
- }
-
- needsUpdate = true;
-
- 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)
- .style('fill-opacity', 1e-6);
- groups.exit()
- .remove();
- groups
- .attr('class', function(d,i) { return 'nv-group nv-series-' + i })
- .classed('hover', function(d) { return d.hover });
- groups
- .transition()
- .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);
-
-
- if (onlyCircles) {
-
- var points = groups.selectAll('circle.nv-point')
- .data(function(d) { return d.values }, pointKey);
- points.enter().append('circle')
- .style('fill', function (d,i) { return d.color })
- .style('stroke', function (d,i) { return d.color })
- .attr('cx', function(d,i) { return nv.utils.NaNtoZero(x0(getX(d,i))) })
- .attr('cy', function(d,i) { return nv.utils.NaNtoZero(y0(getY(d,i))) })
- .attr('r', function(d,i) { return Math.sqrt(z(getSize(d,i))/Math.PI) });
- points.exit().remove();
- groups.exit().selectAll('path.nv-point').transition()
- .attr('cx', function(d,i) { return nv.utils.NaNtoZero(x(getX(d,i))) })
- .attr('cy', function(d,i) { return nv.utils.NaNtoZero(y(getY(d,i))) })
- .remove();
- points.each(function(d,i) {
- d3.select(this)
- .classed('nv-point', true)
- .classed('nv-point-' + i, true)
- .classed('hover',false)
- ;
});
- points.transition()
- .attr('cx', function(d,i) { return nv.utils.NaNtoZero(x(getX(d,i))) })
- .attr('cy', function(d,i) { return nv.utils.NaNtoZero(y(getY(d,i))) })
- .attr('r', function(d,i) { return Math.sqrt(z(getSize(d,i))/Math.PI) });
-
- } else {
-
- var points = groups.selectAll('path.nv-point')
- .data(function(d) { return d.values });
- points.enter().append('path')
- .style('fill', function (d,i) { return d.color })
- .style('stroke', function (d,i) { return d.color })
- .attr('transform', function(d,i) {
- return 'translate(' + x0(getX(d,i)) + ',' + y0(getY(d,i)) + ')'
- })
- .attr('d',
- d3.svg.symbol()
- .type(getShape)
- .size(function(d,i) { return z(getSize(d,i)) })
- );
- points.exit().remove();
- groups.exit().selectAll('path.nv-point')
- .transition()
- .attr('transform', function(d,i) {
- return 'translate(' + x(getX(d,i)) + ',' + y(getY(d,i)) + ')'
- })
- .remove();
- points.each(function(d,i) {
- d3.select(this)
- .classed('nv-point', true)
- .classed('nv-point-' + i, true)
- .classed('hover',false)
- ;
- });
- points.transition()
- .attr('transform', function(d,i) {
- //nv.log(d,i,getX(d,i), x(getX(d,i)));
- return 'translate(' + x(getX(d,i)) + ',' + y(getY(d,i)) + ')'
- })
- .attr('d',
- d3.svg.symbol()
- .type(getShape)
- .size(function(d,i) { return z(getSize(d,i)) })
- );
- }
+ renderWatch.renderEnd('scatter immediate');
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
- // Delay updating the invisible interactive layer for smoother animation
- clearTimeout(timeoutID); // stop repeat calls to updateInteractiveLayer
- timeoutID = setTimeout(updateInteractiveLayer, 300);
- //updateInteractiveLayer();
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
- z0 = z.copy();
+ // utility function calls provided by this chart
+ chart._calls = new function() {
+ this.clearHighlights = function () {
+ nv.dom.write(function() {
+ container.selectAll(".nv-point.hover").classed("hover", false);
+ });
+ return null;
+ };
+ this.highlightPoint = function (seriesIndex, pointIndex, isHoverOver) {
+ nv.dom.write(function() {
+ container.select('.nv-groups')
+ .selectAll(".nv-series-" + seriesIndex)
+ .selectAll(".nv-point-" + pointIndex)
+ .classed("hover", isHoverOver);
+ });
+ };
+ };
+ // trigger calls from events too
+ dispatch.on('elementMouseover.point', function(d) {
+ if (interactive) chart._calls.highlightPoint(d.seriesIndex,d.pointIndex,true);
});
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
- chart.clearHighlights = function() {
- //Remove the 'hover' class from all highlighted points.
- d3.selectAll(".nv-chart-" + id + " .nv-point.hover").classed("hover",false);
- };
-
- chart.highlightPoint = function(seriesIndex,pointIndex,isHoverOver) {
- d3.select(".nv-chart-" + id + " .nv-series-" + seriesIndex + " .nv-point-" + pointIndex)
- .classed("hover",isHoverOver);
- };
-
-
- dispatch.on('elementMouseover.point', function(d) {
- if (interactive) chart.highlightPoint(d.seriesIndex,d.pointIndex,true);
- });
-
- dispatch.on('elementMouseout.point', function(d) {
- if (interactive) chart.highlightPoint(d.seriesIndex,d.pointIndex,false);
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- chart.dispatch = dispatch;
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = d3.functor(_);
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = d3.functor(_);
- return chart;
- };
-
- chart.size = function(_) {
- if (!arguments.length) return getSize;
- getSize = d3.functor(_);
- return chart;
- };
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
-
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
-
- chart.zScale = function(_) {
- if (!arguments.length) return z;
- z = _;
- return chart;
- };
-
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
-
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
-
- chart.sizeDomain = function(_) {
- if (!arguments.length) return sizeDomain;
- sizeDomain = _;
- return chart;
- };
-
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
-
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
-
- chart.sizeRange = function(_) {
- if (!arguments.length) return sizeRange;
- sizeRange = _;
- return chart;
- };
-
- chart.forceX = function(_) {
- if (!arguments.length) return forceX;
- forceX = _;
- return chart;
- };
-
- chart.forceY = function(_) {
- if (!arguments.length) return forceY;
- forceY = _;
- return chart;
- };
-
- chart.forceSize = function(_) {
- if (!arguments.length) return forceSize;
- forceSize = _;
- return chart;
- };
-
- chart.interactive = function(_) {
- if (!arguments.length) return interactive;
- interactive = _;
- return chart;
- };
-
- chart.pointKey = function(_) {
- if (!arguments.length) return pointKey;
- pointKey = _;
- return chart;
- };
-
- chart.pointActive = function(_) {
- if (!arguments.length) return pointActive;
- pointActive = _;
- return chart;
- };
-
- chart.padData = function(_) {
- if (!arguments.length) return padData;
- padData = _;
- return chart;
- };
-
- chart.padDataOuter = function(_) {
- if (!arguments.length) return padDataOuter;
- padDataOuter = _;
- return chart;
- };
-
- chart.clipEdge = function(_) {
- if (!arguments.length) return clipEdge;
- clipEdge = _;
- return chart;
- };
-
- chart.clipVoronoi= function(_) {
- if (!arguments.length) return clipVoronoi;
- clipVoronoi = _;
- return chart;
- };
-
- chart.useVoronoi= function(_) {
- if (!arguments.length) return useVoronoi;
- useVoronoi = _;
- if (useVoronoi === false) {
- clipVoronoi = false;
- }
- return chart;
- };
-
- chart.clipRadius = function(_) {
- if (!arguments.length) return clipRadius;
- clipRadius = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
-
- chart.shape = function(_) {
- if (!arguments.length) return getShape;
- getShape = _;
- return chart;
- };
-
- chart.onlyCircles = function(_) {
- if (!arguments.length) return onlyCircles;
- onlyCircles = _;
- return chart;
- };
+ dispatch.on('elementMouseout.point', function(d) {
+ if (interactive) chart._calls.highlightPoint(d.seriesIndex,d.pointIndex,false);
+ });
- chart.id = function(_) {
- if (!arguments.length) return id;
- id = _;
- return chart;
- };
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ pointScale: {get: function(){return z;}, set: function(_){z=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ pointDomain: {get: function(){return sizeDomain;}, set: function(_){sizeDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ pointRange: {get: function(){return sizeRange;}, set: function(_){sizeRange=_;}},
+ forceX: {get: function(){return forceX;}, set: function(_){forceX=_;}},
+ forceY: {get: function(){return forceY;}, set: function(_){forceY=_;}},
+ forcePoint: {get: function(){return forceSize;}, set: function(_){forceSize=_;}},
+ interactive: {get: function(){return interactive;}, set: function(_){interactive=_;}},
+ pointActive: {get: function(){return pointActive;}, set: function(_){pointActive=_;}},
+ padDataOuter: {get: function(){return padDataOuter;}, set: function(_){padDataOuter=_;}},
+ padData: {get: function(){return padData;}, set: function(_){padData=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+ clipVoronoi: {get: function(){return clipVoronoi;}, set: function(_){clipVoronoi=_;}},
+ clipRadius: {get: function(){return clipRadius;}, set: function(_){clipRadius=_;}},
+ showVoronoi: {get: function(){return showVoronoi;}, set: function(_){showVoronoi=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+
+
+ // simple functor options
+ x: {get: function(){return getX;}, set: function(_){getX = d3.functor(_);}},
+ y: {get: function(){return getY;}, set: function(_){getY = d3.functor(_);}},
+ pointSize: {get: function(){return getSize;}, set: function(_){getSize = d3.functor(_);}},
+ pointShape: {get: function(){return getShape;}, set: function(_){getShape = d3.functor(_);}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ useVoronoi: {get: function(){return useVoronoi;}, set: function(_){
+ useVoronoi = _;
+ if (useVoronoi === false) {
+ clipVoronoi = false;
+ }
+ }}
+ });
- chart.singlePoint = function(_) {
- if (!arguments.length) return singlePoint;
- singlePoint = _;
+ nv.utils.initOptions(chart);
return chart;
- };
-
- //============================================================
-
+};
- return chart;
-}
nv.models.scatterChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var scatter = nv.models.scatter()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- , controls = nv.models.legend()
- , distX = nv.models.distribution()
- , distY = nv.models.distribution()
- ;
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var scatter = nv.models.scatter()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend()
+ , distX = nv.models.distribution()
+ , distY = nv.models.distribution()
+ , tooltip = nv.models.tooltip()
+ ;
- var margin = {top: 30, right: 20, bottom: 50, left: 75}
- , width = null
- , height = null
- , color = nv.utils.defaultColor()
- , x = d3.fisheye ? d3.fisheye.scale(d3.scale.linear).distortion(0) : scatter.xScale()
- , y = d3.fisheye ? d3.fisheye.scale(d3.scale.linear).distortion(0) : scatter.yScale()
- , xPadding = 0
- , yPadding = 0
- , showDistX = false
- , showDistY = false
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , showControls = !!d3.fisheye
- , fisheye = 0
- , pauseFisheye = false
- , tooltips = true
- , tooltipX = function(key, x, y) { return '<strong>' + x + '</strong>' }
- , tooltipY = function(key, x, y) { return '<strong>' + y + '</strong>' }
- , tooltip = null
- , state = {}
- , defaultState = null
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , noData = "No Data Available."
- , transitionDuration = 250
- ;
+ var margin = {top: 30, right: 20, bottom: 50, left: 75}
+ , width = null
+ , height = null
+ , container = null
+ , color = nv.utils.defaultColor()
+ , x = scatter.xScale()
+ , y = scatter.yScale()
+ , showDistX = false
+ , showDistY = false
+ , showLegend = true
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , state = nv.utils.state()
+ , defaultState = null
+ , dispatch = d3.dispatch('stateChange', 'changeState', 'renderEnd')
+ , noData = null
+ , duration = 250
+ ;
- scatter
- .xScale(x)
- .yScale(y)
+ scatter.xScale(x).yScale(y);
+ xAxis.orient('bottom').tickPadding(10);
+ yAxis
+ .orient((rightAlignYAxis) ? 'right' : 'left')
+ .tickPadding(10)
;
- xAxis
- .orient('bottom')
- .tickPadding(10)
- ;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- .tickPadding(10)
- ;
- distX
- .axis('x')
- ;
- distY
- .axis('y')
- ;
-
- controls.updateState(false);
-
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var x0, y0;
-
- var showTooltip = function(e, offsetElement) {
- //TODO: make tooltip style an option between single or dual on axes (maybe on all charts with axes?)
-
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- leftX = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- topX = y.range()[0] + margin.top + ( offsetElement.offsetTop || 0),
- leftY = x.range()[0] + margin.left + ( offsetElement.offsetLeft || 0 ),
- topY = e.pos[1] + ( offsetElement.offsetTop || 0),
- xVal = xAxis.tickFormat()(scatter.x()(e.point, e.pointIndex)),
- yVal = yAxis.tickFormat()(scatter.y()(e.point, e.pointIndex));
-
- if( tooltipX != null )
- nv.tooltip.show([leftX, topX], tooltipX(e.series.key, xVal, yVal, e, chart), 'n', 1, offsetElement, 'x-nvtooltip');
- if( tooltipY != null )
- nv.tooltip.show([leftY, topY], tooltipY(e.series.key, xVal, yVal, e, chart), 'e', 1, offsetElement, 'y-nvtooltip');
- if( tooltip != null )
- nv.tooltip.show([left, top], tooltip(e.series.key, xVal, yVal, e, chart), e.value < 0 ? 'n' : 's', null, offsetElement);
- };
-
- var controlsData = [
- { key: 'Magnify', disabled: true }
- ];
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
-
- chart.update = function() { container.transition().duration(transitionDuration).call(chart); };
- chart.container = this;
-
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
-
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
-
- //------------------------------------------------------------
- // Display noData message if there's nothing to show.
-
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x0 = x0 || x;
- y0 = y0 || y;
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- 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 nv-background');
-
- 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');
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Legend
-
- if (showLegend) {
- var legendWidth = (showControls) ? availableWidth / 2 : availableWidth;
- legend.width(legendWidth);
-
- wrap.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;
- }
-
- wrap.select('.nv-legendWrap')
- .attr('transform', 'translate(' + (availableWidth - legendWidth) + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Controls
-
- if (showControls) {
- controls.width(180).color(['#444']);
- g.select('.nv-controlsWrap')
- .datum(controlsData)
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- .call(controls);
- }
-
- //------------------------------------------------------------
-
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
-
- //------------------------------------------------------------
- // Main Chart Component(s)
-
- scatter
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
-
- if (xPadding !== 0)
- scatter.xDomain(null);
-
- if (yPadding !== 0)
- scatter.yDomain(null);
-
- wrap.select('.nv-scatterWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(scatter);
-
- //Adjust for x and y padding
- if (xPadding !== 0) {
- var xRange = x.domain()[1] - x.domain()[0];
- scatter.xDomain([x.domain()[0] - (xPadding * xRange), x.domain()[1] + (xPadding * xRange)]);
- }
-
- if (yPadding !== 0) {
- var yRange = y.domain()[1] - y.domain()[0];
- scatter.yDomain([y.domain()[0] - (yPadding * yRange), y.domain()[1] + (yPadding * yRange)]);
- }
-
- //Only need to update the scatter again if x/yPadding changed the domain.
- if (yPadding !== 0 || xPadding !== 0) {
- wrap.select('.nv-scatterWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(scatter);
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Axes
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( xAxis.ticks() && xAxis.ticks().length ? xAxis.ticks() : availableWidth / 100 )
- .tickSize( -availableHeight , 0);
-
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y.range()[0] + ')')
- .call(xAxis);
-
- }
-
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( yAxis.ticks() && yAxis.ticks().length ? yAxis.ticks() : availableHeight / 36 )
- .tickSize( -availableWidth, 0);
-
- g.select('.nv-y.nv-axis')
- .call(yAxis);
- }
-
-
- if (showDistX) {
- distX
- .getData(scatter.x())
- .scale(x)
- .width(availableWidth)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
- gEnter.select('.nv-distWrap').append('g')
- .attr('class', 'nv-distributionX');
- g.select('.nv-distributionX')
- .attr('transform', 'translate(0,' + y.range()[0] + ')')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distX);
- }
-
- if (showDistY) {
- distY
- .getData(scatter.y())
- .scale(y)
- .width(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
- gEnter.select('.nv-distWrap').append('g')
- .attr('class', 'nv-distributionY');
- g.select('.nv-distributionY')
- .attr('transform',
- 'translate(' + (rightAlignYAxis ? availableWidth : -distY.size() ) + ',0)')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distY);
- }
-
- //------------------------------------------------------------
-
-
-
-
- if (d3.fisheye) {
- g.select('.nv-background')
- .attr('width', availableWidth)
- .attr('height', availableHeight);
-
- g.select('.nv-background').on('mousemove', updateFisheye);
- g.select('.nv-background').on('click', function() { pauseFisheye = !pauseFisheye;});
- scatter.dispatch.on('elementClick.freezeFisheye', function() {
- pauseFisheye = !pauseFisheye;
+ distX.axis('x');
+ distY.axis('y');
+ tooltip
+ .headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ })
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
});
- }
-
-
- function updateFisheye() {
- if (pauseFisheye) {
- g.select('.nv-point-paths').style('pointer-events', 'all');
- return false;
- }
-
- 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('.nv-scatterWrap')
- .call(scatter);
- if (showXAxis)
- g.select('.nv-x.nv-axis').call(xAxis);
-
- if (showYAxis)
- g.select('.nv-y.nv-axis').call(yAxis);
-
- g.select('.nv-distributionX')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distX);
- g.select('.nv-distributionY')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distY);
- }
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
+ var x0, y0
+ , renderWatch = nv.utils.renderWatch(dispatch, duration);
-
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
-
- controls.dispatch.on('legendClick', function(d,i) {
- d.disabled = !d.disabled;
-
- fisheye = d.disabled ? 0 : 2.5;
- 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('.nv-scatterWrap').call(scatter);
- g.select('.nv-x.nv-axis').call(xAxis);
- g.select('.nv-y.nv-axis').call(yAxis);
- } else {
- pauseFisheye = false;
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled })
+ };
}
+ };
- chart.update();
- });
-
- legend.dispatch.on('stateChange', function(newState) {
- state.disabled = newState.disabled;
- dispatch.stateChange(state);
- chart.update();
- });
-
- scatter.dispatch.on('elementMouseover.tooltip', function(e) {
- d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distx-' + e.pointIndex)
- .attr('y1', function(d,i) { return e.pos[1] - availableHeight;});
- 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];
- dispatch.tooltipShow(e);
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
-
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
-
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
-
- state.disabled = e.disabled;
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
}
+ };
- chart.update();
- });
-
- //============================================================
-
-
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
-
-
- });
-
- return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- scatter.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
-
- d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distx-' + e.pointIndex)
- .attr('y1', 0);
- d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-disty-' + e.pointIndex)
- .attr('x2', distY.size());
- });
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.scatter = scatter;
- chart.legend = legend;
- chart.controls = controls;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
- chart.distX = distX;
- chart.distY = distY;
-
- d3.rebind(chart, scatter, 'id', 'interactive', 'pointActive', 'x', 'y', 'shape', 'size', 'xScale', 'yScale', 'zScale', 'xDomain', 'yDomain', 'xRange', 'yRange', 'sizeDomain', 'sizeRange', 'forceX', 'forceY', 'forceSize', 'clipVoronoi', 'clipRadius', 'useVoronoi');
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- distX.color(color);
- distY.color(color);
- return chart;
- };
-
- chart.showDistX = function(_) {
- if (!arguments.length) return showDistX;
- showDistX = _;
- return chart;
- };
-
- chart.showDistY = function(_) {
- if (!arguments.length) return showDistY;
- showDistY = _;
- return chart;
- };
-
- chart.showControls = function(_) {
- if (!arguments.length) return showControls;
- showControls = _;
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
-
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
-
- chart.fisheye = function(_) {
- if (!arguments.length) return fisheye;
- fisheye = _;
- return chart;
- };
-
- chart.xPadding = function(_) {
- if (!arguments.length) return xPadding;
- xPadding = _;
- return chart;
- };
-
- chart.yPadding = function(_) {
- if (!arguments.length) return yPadding;
- yPadding = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.tooltipXContent = function(_) {
- if (!arguments.length) return tooltipX;
- tooltipX = _;
- return chart;
- };
-
- chart.tooltipYContent = function(_) {
- if (!arguments.length) return tooltipY;
- tooltipY = _;
- return chart;
- };
-
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
-
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(scatter);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+ if (showDistX) renderWatch.models(distX);
+ if (showDistY) renderWatch.models(distY);
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
+ selection.each(function(data) {
+ var that = this;
- //============================================================
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- return chart;
-}
+ chart.update = function() {
+ if (duration === 0)
+ container.call(chart);
+ else
+ container.transition().duration(duration).call(chart);
+ };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disableddisabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
-nv.models.scatterPlusLineChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var scatter = nv.models.scatter()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- , controls = nv.models.legend()
- , distX = nv.models.distribution()
- , distY = nv.models.distribution()
- ;
+ // Display noData message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container);
+ renderWatch.renderEnd('scatter immediate');
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- var margin = {top: 30, right: 20, bottom: 50, left: 75}
- , width = null
- , height = null
- , color = nv.utils.defaultColor()
- , x = d3.fisheye ? d3.fisheye.scale(d3.scale.linear).distortion(0) : scatter.xScale()
- , y = d3.fisheye ? d3.fisheye.scale(d3.scale.linear).distortion(0) : scatter.yScale()
- , showDistX = false
- , showDistY = false
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , showControls = !!d3.fisheye
- , fisheye = 0
- , pauseFisheye = false
- , tooltips = true
- , tooltipX = function(key, x, y) { return '<strong>' + x + '</strong>' }
- , tooltipY = function(key, x, y) { return '<strong>' + y + '</strong>' }
- , tooltip = function(key, x, y, date) { return '<h3>' + key + '</h3>'
- + '<p>' + date + '</p>' }
- , state = {}
- , defaultState = null
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , noData = "No Data Available."
- , transitionDuration = 250
- ;
+ // Setup Scales
+ x = scatter.xScale();
+ y = scatter.yScale();
+
+ // Setup containers and skeleton of chart
+ 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 nv-background').style("pointer-events","none");
+
+ 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-regressionLinesWrap');
+ gEnter.append('g').attr('class', 'nv-distWrap');
+ gEnter.append('g').attr('class', 'nv-legendWrap');
+
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
- scatter
- .xScale(x)
- .yScale(y)
- ;
- xAxis
- .orient('bottom')
- .tickPadding(10)
- ;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- .tickPadding(10)
- ;
- distX
- .axis('x')
- ;
- distY
- .axis('y')
- ;
-
- controls.updateState(false);
- //============================================================
-
-
- //============================================================
- // Private Variables
- //------------------------------------------------------------
-
- var x0, y0;
-
- var showTooltip = function(e, offsetElement) {
- //TODO: make tooltip style an option between single or dual on axes (maybe on all charts with axes?)
-
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- leftX = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- topX = y.range()[0] + margin.top + ( offsetElement.offsetTop || 0),
- leftY = x.range()[0] + margin.left + ( offsetElement.offsetLeft || 0 ),
- topY = e.pos[1] + ( offsetElement.offsetTop || 0),
- xVal = xAxis.tickFormat()(scatter.x()(e.point, e.pointIndex)),
- yVal = yAxis.tickFormat()(scatter.y()(e.point, e.pointIndex));
-
- if( tooltipX != null )
- nv.tooltip.show([leftX, topX], tooltipX(e.series.key, xVal, yVal, e, chart), 'n', 1, offsetElement, 'x-nvtooltip');
- if( tooltipY != null )
- nv.tooltip.show([leftY, topY], tooltipY(e.series.key, xVal, yVal, e, chart), 'e', 1, offsetElement, 'y-nvtooltip');
- if( tooltip != null )
- nv.tooltip.show([left, top], tooltip(e.series.key, xVal, yVal, e.point.tooltip, e, chart), e.value < 0 ? 'n' : 's', null, offsetElement);
- };
-
- var controlsData = [
- { key: 'Magnify', disabled: true }
- ];
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
-
- chart.update = function() { container.transition().duration(transitionDuration).call(chart); };
- chart.container = this;
-
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
-
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
+ // Legend
+ if (showLegend) {
+ var legendWidth = availableWidth;
+ legend.width(legendWidth);
- //------------------------------------------------------------
- // Display noData message if there's nothing to show.
+ wrap.select('.nv-legendWrap')
+ .datum(data)
+ .call(legend);
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
+ wrap.select('.nv-legendWrap')
+ .attr('transform', 'translate(0' + ',' + (-margin.top) +')');
+ }
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
+ // Main Chart Component(s)
+ scatter
+ .width(availableWidth)
+ .height(availableHeight)
+ .color(data.map(function(d,i) {
+ d.color = d.color || color(d, i);
+ return d.color;
+ }).filter(function(d,i) { return !data[i].disabled }));
- //------------------------------------------------------------
+ wrap.select('.nv-scatterWrap')
+ .datum(data.filter(function(d) { return !d.disabled }))
+ .call(scatter);
- //------------------------------------------------------------
- // Setup Scales
+ wrap.select('.nv-regressionLinesWrap')
+ .attr('clip-path', 'url(#nv-edge-clip-' + scatter.id() + ')');
- x = scatter.xScale();
- y = scatter.yScale();
+ var regWrap = wrap.select('.nv-regressionLinesWrap').selectAll('.nv-regLines')
+ .data(function (d) {
+ return d;
+ });
- x0 = x0 || x;
- y0 = y0 || y;
+ regWrap.enter().append('g').attr('class', 'nv-regLines');
- //------------------------------------------------------------
+ var regLine = regWrap.selectAll('.nv-regLine')
+ .data(function (d) {
+ return [d]
+ });
+ regLine.enter()
+ .append('line').attr('class', 'nv-regLine')
+ .style('stroke-opacity', 0);
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ // don't add lines unless we have slope and intercept to use
+ regLine.filter(function(d) {
+ return d.intercept && d.slope;
+ })
+ .watchTransition(renderWatch, 'scatterPlusLineChart: regline')
+ .attr('x1', x.range()[0])
+ .attr('x2', x.range()[1])
+ .attr('y1', function (d, i) {
+ return y(x.domain()[0] * d.slope + d.intercept)
+ })
+ .attr('y2', function (d, i) {
+ return y(x.domain()[1] * d.slope + d.intercept)
+ })
+ .style('stroke', function (d, i, j) {
+ return color(d, j)
+ })
+ .style('stroke-opacity', function (d, i) {
+ return (d.disabled || typeof d.slope === 'undefined' || typeof d.intercept === 'undefined') ? 0 : 1
+ });
- 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')
+ // Setup Axes
+ if (showXAxis) {
+ xAxis
+ .scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize( -availableHeight , 0);
- // background for pointer events
- gEnter.append('rect').attr('class', 'nvd3 nv-background').style("pointer-events","none");
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + y.range()[0] + ')')
+ .call(xAxis);
+ }
- 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-regressionLinesWrap');
- gEnter.append('g').attr('class', 'nv-distWrap');
- gEnter.append('g').attr('class', 'nv-legendWrap');
- gEnter.append('g').attr('class', 'nv-controlsWrap');
+ if (showYAxis) {
+ yAxis
+ .scale(y)
+ ._ticks( nv.utils.calcTicksY(availableHeight/36, data) )
+ .tickSize( -availableWidth, 0);
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ g.select('.nv-y.nv-axis')
+ .call(yAxis);
+ }
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
+ // Setup Distribution
+ if (showDistX) {
+ distX
+ .getData(scatter.x())
+ .scale(x)
+ .width(availableWidth)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled }));
+ gEnter.select('.nv-distWrap').append('g')
+ .attr('class', 'nv-distributionX');
+ g.select('.nv-distributionX')
+ .attr('transform', 'translate(0,' + y.range()[0] + ')')
+ .datum(data.filter(function(d) { return !d.disabled }))
+ .call(distX);
+ }
- //------------------------------------------------------------
+ if (showDistY) {
+ distY
+ .getData(scatter.y())
+ .scale(y)
+ .width(availableHeight)
+ .color(data.map(function(d,i) {
+ return d.color || color(d, i);
+ }).filter(function(d,i) { return !data[i].disabled }));
+ gEnter.select('.nv-distWrap').append('g')
+ .attr('class', 'nv-distributionY');
+ g.select('.nv-distributionY')
+ .attr('transform', 'translate(' + (rightAlignYAxis ? availableWidth : -distY.size() ) + ',0)')
+ .datum(data.filter(function(d) { return !d.disabled }))
+ .call(distY);
+ }
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- //------------------------------------------------------------
- // Legend
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
- if (showLegend) {
- legend.width( availableWidth / 2 );
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
+ if (typeof e.disabled !== 'undefined') {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
+ state.disabled = e.disabled;
+ }
+ chart.update();
+ });
- wrap.select('.nv-legendWrap')
- .datum(data)
- .call(legend);
+ // mouseover needs availableHeight so we just keep scatter mouse events inside the chart block
+ scatter.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ container.select('.nv-chart-' + scatter.id() + ' .nv-series-' + evt.seriesIndex + ' .nv-distx-' + evt.pointIndex)
+ .attr('y1', 0);
+ container.select('.nv-chart-' + scatter.id() + ' .nv-series-' + evt.seriesIndex + ' .nv-disty-' + evt.pointIndex)
+ .attr('x2', distY.size());
+ });
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
- }
+ scatter.dispatch.on('elementMouseover.tooltip', function(evt) {
+ container.select('.nv-series-' + evt.seriesIndex + ' .nv-distx-' + evt.pointIndex)
+ .attr('y1', evt.relativePos[1] - availableHeight);
+ container.select('.nv-series-' + evt.seriesIndex + ' .nv-disty-' + evt.pointIndex)
+ .attr('x2', evt.relativePos[0] + distX.size());
+ tooltip.data(evt).hidden(false);
+ });
- wrap.select('.nv-legendWrap')
- .attr('transform', 'translate(' + (availableWidth / 2) + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Controls
-
- if (showControls) {
- controls.width(180).color(['#444']);
- g.select('.nv-controlsWrap')
- .datum(controlsData)
- .attr('transform', 'translate(0,' + (-margin.top) +')')
- .call(controls);
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Main Chart Component(s)
-
- scatter
- .width(availableWidth)
- .height(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }))
-
- wrap.select('.nv-scatterWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(scatter);
-
- wrap.select('.nv-regressionLinesWrap')
- .attr('clip-path', 'url(#nv-edge-clip-' + scatter.id() + ')');
-
- var regWrap = wrap.select('.nv-regressionLinesWrap').selectAll('.nv-regLines')
- .data(function(d) {return d });
-
- regWrap.enter().append('g').attr('class', 'nv-regLines');
-
- var regLine = regWrap.selectAll('.nv-regLine').data(function(d){return [d]});
- var regLineEnter = regLine.enter()
- .append('line').attr('class', 'nv-regLine')
- .style('stroke-opacity', 0);
-
- regLine
- .transition()
- .attr('x1', x.range()[0])
- .attr('x2', x.range()[1])
- .attr('y1', function(d,i) {return y(x.domain()[0] * d.slope + d.intercept) })
- .attr('y2', function(d,i) { return y(x.domain()[1] * d.slope + d.intercept) })
- .style('stroke', function(d,i,j) { return color(d,j) })
- .style('stroke-opacity', function(d,i) {
- return (d.disabled || typeof d.slope === 'undefined' || typeof d.intercept === 'undefined') ? 0 : 1
- });
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup Axes
-
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( xAxis.ticks() ? xAxis.ticks() : availableWidth / 100 )
- .tickSize( -availableHeight , 0);
-
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + y.range()[0] + ')')
- .call(xAxis);
- }
-
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks( yAxis.ticks() ? yAxis.ticks() : availableHeight / 36 )
- .tickSize( -availableWidth, 0);
-
- g.select('.nv-y.nv-axis')
- .call(yAxis);
- }
-
-
- if (showDistX) {
- distX
- .getData(scatter.x())
- .scale(x)
- .width(availableWidth)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
- gEnter.select('.nv-distWrap').append('g')
- .attr('class', 'nv-distributionX');
- g.select('.nv-distributionX')
- .attr('transform', 'translate(0,' + y.range()[0] + ')')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distX);
- }
-
- if (showDistY) {
- distY
- .getData(scatter.y())
- .scale(y)
- .width(availableHeight)
- .color(data.map(function(d,i) {
- return d.color || color(d, i);
- }).filter(function(d,i) { return !data[i].disabled }));
- gEnter.select('.nv-distWrap').append('g')
- .attr('class', 'nv-distributionY');
- g.select('.nv-distributionY')
- .attr('transform', 'translate(' + (rightAlignYAxis ? availableWidth : -distY.size() ) + ',0)')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distY);
- }
-
- //------------------------------------------------------------
-
-
-
-
- if (d3.fisheye) {
- g.select('.nv-background')
- .attr('width', availableWidth)
- .attr('height', availableHeight)
- ;
+ //store old scales for use in transitions on update
+ x0 = x.copy();
+ y0 = y.copy();
- g.select('.nv-background').on('mousemove', updateFisheye);
- g.select('.nv-background').on('click', function() { pauseFisheye = !pauseFisheye;});
- scatter.dispatch.on('elementClick.freezeFisheye', function() {
- pauseFisheye = !pauseFisheye;
});
- }
-
-
- function updateFisheye() {
- if (pauseFisheye) {
- g.select('.nv-point-paths').style('pointer-events', 'all');
- return false;
- }
-
- 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('.nv-scatterWrap')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(scatter);
-
- if (showXAxis)
- g.select('.nv-x.nv-axis').call(xAxis);
-
- if (showYAxis)
- g.select('.nv-y.nv-axis').call(yAxis);
-
- g.select('.nv-distributionX')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distX);
- g.select('.nv-distributionY')
- .datum(data.filter(function(d) { return !d.disabled }))
- .call(distY);
- }
-
-
-
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
-
- controls.dispatch.on('legendClick', function(d,i) {
- d.disabled = !d.disabled;
-
- fisheye = d.disabled ? 0 : 2.5;
- 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('.nv-scatterWrap').call(scatter);
- g.select('.nv-x.nv-axis').call(xAxis);
- g.select('.nv-y.nv-axis').call(yAxis);
- } else {
- pauseFisheye = false;
- }
-
- chart.update();
- });
-
- legend.dispatch.on('stateChange', function(newState) {
- state = newState;
- dispatch.stateChange(state);
- chart.update();
- });
-
-
- scatter.dispatch.on('elementMouseover.tooltip', function(e) {
- d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distx-' + e.pointIndex)
- .attr('y1', e.pos[1] - availableHeight);
- 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];
- dispatch.tooltipShow(e);
- });
-
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
-
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
-
- if (typeof e.disabled !== 'undefined') {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
-
- state.disabled = e.disabled;
- }
-
- chart.update();
- });
-
- //============================================================
-
-
- //store old scales for use in transitions on update
- x0 = x.copy();
- y0 = y.copy();
+ renderWatch.renderEnd('scatter with line immediate');
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.scatter = scatter;
+ chart.legend = legend;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.distX = distX;
+ chart.distY = distY;
+ chart.tooltip = tooltip;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ container: {get: function(){return container;}, set: function(_){container=_;}},
+ showDistX: {get: function(){return showDistX;}, set: function(_){showDistX=_;}},
+ showDistY: {get: function(){return showDistY;}, set: function(_){showDistY=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ duration: {get: function(){return duration;}, set: function(_){duration=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( (_) ? 'right' : 'left');
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ distX.color(color);
+ distY.color(color);
+ }}
});
+ nv.utils.inheritOptions(chart, scatter);
+ nv.utils.initOptions(chart);
return chart;
- }
-
-
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
-
- scatter.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
-
- d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-distx-' + e.pointIndex)
- .attr('y1', 0);
- d3.select('.nv-chart-' + scatter.id() + ' .nv-series-' + e.seriesIndex + ' .nv-disty-' + e.pointIndex)
- .attr('x2', distY.size());
- });
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
-
- //============================================================
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.scatter = scatter;
- chart.legend = legend;
- chart.controls = controls;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
- chart.distX = distX;
- chart.distY = distY;
-
- d3.rebind(chart, scatter, 'id', 'interactive', 'pointActive', 'x', 'y', 'shape', 'size', 'xScale', 'yScale', 'zScale', 'xDomain', 'yDomain', 'xRange', 'yRange', 'sizeDomain', 'sizeRange', 'forceX', 'forceY', 'forceSize', 'clipVoronoi', 'clipRadius', 'useVoronoi');
-
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- distX.color(color);
- distY.color(color);
- return chart;
- };
-
- chart.showDistX = function(_) {
- if (!arguments.length) return showDistX;
- showDistX = _;
- return chart;
- };
-
- chart.showDistY = function(_) {
- if (!arguments.length) return showDistY;
- showDistY = _;
- return chart;
- };
-
- chart.showControls = function(_) {
- if (!arguments.length) return showControls;
- showControls = _;
- return chart;
- };
-
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
-
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
-
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
-
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.fisheye = function(_) {
- if (!arguments.length) return fisheye;
- fisheye = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.tooltipXContent = function(_) {
- if (!arguments.length) return tooltipX;
- tooltipX = _;
- return chart;
- };
-
- chart.tooltipYContent = function(_) {
- if (!arguments.length) return tooltipY;
- tooltipY = _;
- return chart;
- };
-
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
-
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
-
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
+};
nv.models.sparkline = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 2, right: 0, bottom: 2, left: 0}
- , width = 400
- , height = 32
- , animate = true
- , x = d3.scale.linear()
- , y = d3.scale.linear()
- , getX = function(d) { return d.x }
- , getY = function(d) { return d.y }
- , color = nv.utils.getColor(['#000'])
- , xDomain
- , yDomain
- , xRange
- , yRange
- ;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x .domain(xDomain || d3.extent(data, getX ))
- .range(xRange || [0, availableWidth]);
-
- y .domain(yDomain || d3.extent(data, getY ))
- .range(yRange || [availableHeight, 0]);
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.selectAll('g.nv-wrap.nv-sparkline').data([data]);
- var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sparkline');
- var gEnter = wrapEnter.append('g');
- var g = wrap.select('g');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
-
- //------------------------------------------------------------
-
-
- var paths = wrap.selectAll('path')
- .data(function(d) { return [d] });
- paths.enter().append('path');
- paths.exit().remove();
- paths
- .style('stroke', function(d,i) { return d.color || color(d, i) })
- .attr('d', d3.svg.line()
- .x(function(d,i) { return x(getX(d,i)) })
- .y(function(d,i) { return y(getY(d,i)) })
- );
-
-
- // TODO: Add CURRENT data point (Need Min, Mac, Current / Most recent)
- var points = wrap.selectAll('circle.nv-point')
- .data(function(data) {
- var yValues = data.map(function(d, i) { return getY(d,i); });
- function pointIndex(index) {
- if (index != -1) {
- var result = data[index];
- result.pointIndex = index;
- return result;
- } else {
- return null;
- }
- }
- var maxPoint = pointIndex(yValues.lastIndexOf(y.domain()[1])),
- minPoint = pointIndex(yValues.indexOf(y.domain()[0])),
- currentPoint = pointIndex(yValues.length - 1);
- return [minPoint, maxPoint, currentPoint].filter(function (d) {return d != null;});
- });
- points.enter().append('circle');
- points.exit().remove();
- points
- .attr('cx', function(d,i) { return x(getX(d,d.pointIndex)) })
- .attr('cy', function(d,i) { return y(getY(d,d.pointIndex)) })
- .attr('r', 2)
- .attr('class', function(d,i) {
- return getX(d, d.pointIndex) == x.domain()[1] ? 'nv-point nv-currentValue' :
- getY(d, d.pointIndex) == y.domain()[0] ? 'nv-point nv-minValue' : 'nv-point nv-maxValue'
- });
- });
-
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = d3.functor(_);
- return chart;
- };
-
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = d3.functor(_);
- return chart;
- };
-
- chart.xScale = function(_) {
- if (!arguments.length) return x;
- x = _;
- return chart;
- };
-
- chart.yScale = function(_) {
- if (!arguments.length) return y;
- y = _;
- return chart;
- };
-
- chart.xDomain = function(_) {
- if (!arguments.length) return xDomain;
- xDomain = _;
- return chart;
- };
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 2, right: 0, bottom: 2, left: 0}
+ , width = 400
+ , height = 32
+ , container = null
+ , animate = true
+ , x = d3.scale.linear()
+ , y = d3.scale.linear()
+ , getX = function(d) { return d.x }
+ , getY = function(d) { return d.y }
+ , color = nv.utils.getColor(['#000'])
+ , xDomain
+ , yDomain
+ , xRange
+ , yRange
+ ;
- chart.yDomain = function(_) {
- if (!arguments.length) return yDomain;
- yDomain = _;
- return chart;
- };
+ function chart(selection) {
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
+
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+
+ // Setup Scales
+ x .domain(xDomain || d3.extent(data, getX ))
+ .range(xRange || [0, availableWidth]);
+
+ y .domain(yDomain || d3.extent(data, getY ))
+ .range(yRange || [availableHeight, 0]);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-sparkline').data([data]);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sparkline');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')
+
+ var paths = wrap.selectAll('path')
+ .data(function(d) { return [d] });
+ paths.enter().append('path');
+ paths.exit().remove();
+ paths
+ .style('stroke', function(d,i) { return d.color || color(d, i) })
+ .attr('d', d3.svg.line()
+ .x(function(d,i) { return x(getX(d,i)) })
+ .y(function(d,i) { return y(getY(d,i)) })
+ );
- chart.xRange = function(_) {
- if (!arguments.length) return xRange;
- xRange = _;
- return chart;
- };
+ // TODO: Add CURRENT data point (Need Min, Mac, Current / Most recent)
+ var points = wrap.selectAll('circle.nv-point')
+ .data(function(data) {
+ var yValues = data.map(function(d, i) { return getY(d,i); });
+ function pointIndex(index) {
+ if (index != -1) {
+ var result = data[index];
+ result.pointIndex = index;
+ return result;
+ } else {
+ return null;
+ }
+ }
+ var maxPoint = pointIndex(yValues.lastIndexOf(y.domain()[1])),
+ minPoint = pointIndex(yValues.indexOf(y.domain()[0])),
+ currentPoint = pointIndex(yValues.length - 1);
+ return [minPoint, maxPoint, currentPoint].filter(function (d) {return d != null;});
+ });
+ points.enter().append('circle');
+ points.exit().remove();
+ points
+ .attr('cx', function(d,i) { return x(getX(d,d.pointIndex)) })
+ .attr('cy', function(d,i) { return y(getY(d,d.pointIndex)) })
+ .attr('r', 2)
+ .attr('class', function(d,i) {
+ return getX(d, d.pointIndex) == x.domain()[1] ? 'nv-point nv-currentValue' :
+ getY(d, d.pointIndex) == y.domain()[0] ? 'nv-point nv-minValue' : 'nv-point nv-maxValue'
+ });
+ });
- chart.yRange = function(_) {
- if (!arguments.length) return yRange;
- yRange = _;
- return chart;
- };
+ return chart;
+ }
- chart.animate = function(_) {
- if (!arguments.length) return animate;
- animate = _;
- return chart;
- };
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ xDomain: {get: function(){return xDomain;}, set: function(_){xDomain=_;}},
+ yDomain: {get: function(){return yDomain;}, set: function(_){yDomain=_;}},
+ xRange: {get: function(){return xRange;}, set: function(_){xRange=_;}},
+ yRange: {get: function(){return yRange;}, set: function(_){yRange=_;}},
+ xScale: {get: function(){return x;}, set: function(_){x=_;}},
+ yScale: {get: function(){return y;}, set: function(_){y=_;}},
+ animate: {get: function(){return animate;}, set: function(_){animate=_;}},
+
+ //functor options
+ x: {get: function(){return getX;}, set: function(_){getX=d3.functor(_);}},
+ y: {get: function(){return getY;}, set: function(_){getY=d3.functor(_);}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }}
+ });
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
+ nv.utils.initOptions(chart);
return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
+};
nv.models.sparklinePlus = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var sparkline = nv.models.sparkline();
-
- var margin = {top: 15, right: 100, bottom: 10, left: 50}
- , width = null
- , height = null
- , x
- , y
- , index = []
- , paused = false
- , xTickFormat = d3.format(',r')
- , yTickFormat = d3.format(',.2f')
- , showValue = true
- , alignValue = true
- , rightAlignValue = false
- , noData = "No Data Available."
- ;
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this);
-
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
-
-
-
- chart.update = function() { chart(selection) };
- chart.container = this;
-
-
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
-
- if (!data || !data.length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
-
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
-
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
-
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
-
- var currentValue = sparkline.y()(data[data.length-1], data.length-1);
-
- //------------------------------------------------------------
-
-
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = sparkline.xScale();
- y = sparkline.yScale();
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.selectAll('g.nv-wrap.nv-sparklineplus').data([data]);
- var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sparklineplus');
- var gEnter = wrapEnter.append('g');
- var g = wrap.select('g');
-
- gEnter.append('g').attr('class', 'nv-sparklineWrap');
- gEnter.append('g').attr('class', 'nv-valueWrap');
- gEnter.append('g').attr('class', 'nv-hoverArea');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Main Chart Component(s)
-
- var sparklineWrap = g.select('.nv-sparklineWrap');
-
- sparkline
- .width(availableWidth)
- .height(availableHeight);
-
- sparklineWrap
- .call(sparkline);
-
- //------------------------------------------------------------
-
-
- var valueWrap = g.select('.nv-valueWrap');
-
- var value = valueWrap.selectAll('.nv-currentValue')
- .data([currentValue]);
-
- value.enter().append('text').attr('class', 'nv-currentValue')
- .attr('dx', rightAlignValue ? -8 : 8)
- .attr('dy', '.9em')
- .style('text-anchor', rightAlignValue ? 'end' : 'start');
-
- value
- .attr('x', availableWidth + (rightAlignValue ? margin.right : 0))
- .attr('y', alignValue ? function(d) { return y(d) } : 0)
- .style('fill', sparkline.color()(data[data.length-1], data.length-1))
- .text(yTickFormat(currentValue));
-
-
-
- gEnter.select('.nv-hoverArea').append('rect')
- .on('mousemove', sparklineHover)
- .on('click', function() { paused = !paused })
- .on('mouseout', function() { index = []; updateValueLine(); });
- //.on('mouseout', function() { index = null; updateValueLine(); });
-
- g.select('.nv-hoverArea rect')
- .attr('transform', function(d) { return 'translate(' + -margin.left + ',' + -margin.top + ')' })
- .attr('width', availableWidth + margin.left + margin.right)
- .attr('height', availableHeight + margin.top);
-
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var sparkline = nv.models.sparkline();
+
+ var margin = {top: 15, right: 100, bottom: 10, left: 50}
+ , width = null
+ , height = null
+ , x
+ , y
+ , index = []
+ , paused = false
+ , xTickFormat = d3.format(',r')
+ , yTickFormat = d3.format(',.2f')
+ , showLastValue = true
+ , alignValue = true
+ , rightAlignValue = false
+ , noData = null
+ ;
+ function chart(selection) {
+ selection.each(function(data) {
+ var container = d3.select(this);
+ nv.utils.initSVG(container);
- function updateValueLine() { //index is currently global (within the chart), may or may not keep it that way
- if (paused) return;
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- var hoverValue = g.selectAll('.nv-hoverValue').data(index)
+ chart.update = function() { container.call(chart); };
+ chart.container = this;
- var hoverEnter = hoverValue.enter()
- .append('g').attr('class', 'nv-hoverValue')
- .style('stroke-opacity', 0)
- .style('fill-opacity', 0);
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- hoverValue.exit()
- .transition().duration(250)
- .style('stroke-opacity', 0)
- .style('fill-opacity', 0)
- .remove();
+ var currentValue = sparkline.y()(data[data.length-1], data.length-1);
- hoverValue
- .attr('transform', function(d) { return 'translate(' + x(sparkline.x()(data[d],d)) + ',0)' })
- .transition().duration(250)
- .style('stroke-opacity', 1)
- .style('fill-opacity', 1);
+ // Setup Scales
+ x = sparkline.xScale();
+ y = sparkline.yScale();
- if (!index.length) return;
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-sparklineplus').data([data]);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sparklineplus');
+ var gEnter = wrapEnter.append('g');
+ var g = wrap.select('g');
- hoverEnter.append('line')
- .attr('x1', 0)
- .attr('y1', -margin.top)
- .attr('x2', 0)
- .attr('y2', availableHeight);
+ gEnter.append('g').attr('class', 'nv-sparklineWrap');
+ gEnter.append('g').attr('class', 'nv-valueWrap');
+ gEnter.append('g').attr('class', 'nv-hoverArea');
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- hoverEnter.append('text').attr('class', 'nv-xValue')
- .attr('x', -6)
- .attr('y', -margin.top)
- .attr('text-anchor', 'end')
- .attr('dy', '.9em')
+ // Main Chart Component(s)
+ var sparklineWrap = g.select('.nv-sparklineWrap');
+ sparkline.width(availableWidth).height(availableHeight);
+ sparklineWrap.call(sparkline);
- g.select('.nv-hoverValue .nv-xValue')
- .text(xTickFormat(sparkline.x()(data[index[0]], index[0])));
+ if (showLastValue) {
+ var valueWrap = g.select('.nv-valueWrap');
+ var value = valueWrap.selectAll('.nv-currentValue')
+ .data([currentValue]);
- hoverEnter.append('text').attr('class', 'nv-yValue')
- .attr('x', 6)
- .attr('y', -margin.top)
- .attr('text-anchor', 'start')
- .attr('dy', '.9em')
+ value.enter().append('text').attr('class', 'nv-currentValue')
+ .attr('dx', rightAlignValue ? -8 : 8)
+ .attr('dy', '.9em')
+ .style('text-anchor', rightAlignValue ? 'end' : 'start');
- g.select('.nv-hoverValue .nv-yValue')
- .text(yTickFormat(sparkline.y()(data[index[0]], index[0])));
+ value
+ .attr('x', availableWidth + (rightAlignValue ? margin.right : 0))
+ .attr('y', alignValue ? function (d) {
+ return y(d)
+ } : 0)
+ .style('fill', sparkline.color()(data[data.length - 1], data.length - 1))
+ .text(yTickFormat(currentValue));
+ }
- }
+ gEnter.select('.nv-hoverArea').append('rect')
+ .on('mousemove', sparklineHover)
+ .on('click', function() { paused = !paused })
+ .on('mouseout', function() { index = []; updateValueLine(); });
+
+ g.select('.nv-hoverArea rect')
+ .attr('transform', function(d) { return 'translate(' + -margin.left + ',' + -margin.top + ')' })
+ .attr('width', availableWidth + margin.left + margin.right)
+ .attr('height', availableHeight + margin.top);
+
+ //index is currently global (within the chart), may or may not keep it that way
+ function updateValueLine() {
+ if (paused) return;
+
+ var hoverValue = g.selectAll('.nv-hoverValue').data(index);
+
+ var hoverEnter = hoverValue.enter()
+ .append('g').attr('class', 'nv-hoverValue')
+ .style('stroke-opacity', 0)
+ .style('fill-opacity', 0);
+
+ hoverValue.exit()
+ .transition().duration(250)
+ .style('stroke-opacity', 0)
+ .style('fill-opacity', 0)
+ .remove();
+
+ hoverValue
+ .attr('transform', function(d) { return 'translate(' + x(sparkline.x()(data[d],d)) + ',0)' })
+ .transition().duration(250)
+ .style('stroke-opacity', 1)
+ .style('fill-opacity', 1);
+
+ if (!index.length) return;
+
+ hoverEnter.append('line')
+ .attr('x1', 0)
+ .attr('y1', -margin.top)
+ .attr('x2', 0)
+ .attr('y2', availableHeight);
+
+ hoverEnter.append('text').attr('class', 'nv-xValue')
+ .attr('x', -6)
+ .attr('y', -margin.top)
+ .attr('text-anchor', 'end')
+ .attr('dy', '.9em');
+
+ g.select('.nv-hoverValue .nv-xValue')
+ .text(xTickFormat(sparkline.x()(data[index[0]], index[0])));
+
+ hoverEnter.append('text').attr('class', 'nv-yValue')
+ .attr('x', 6)
+ .attr('y', -margin.top)
+ .attr('text-anchor', 'start')
+ .attr('dy', '.9em');
+
+ g.select('.nv-hoverValue .nv-yValue')
+ .text(yTickFormat(sparkline.y()(data[index[0]], index[0])));
+ }
+ function sparklineHover() {
+ if (paused) return;
- function sparklineHover() {
- if (paused) return;
+ var pos = d3.mouse(this)[0] - margin.left;
- var pos = d3.mouse(this)[0] - margin.left;
+ function getClosestIndex(data, x) {
+ var distance = Math.abs(sparkline.x()(data[0], 0) - x);
+ var closestIndex = 0;
+ for (var i = 0; i < data.length; i++){
+ if (Math.abs(sparkline.x()(data[i], i) - x) < distance) {
+ distance = Math.abs(sparkline.x()(data[i], i) - x);
+ closestIndex = i;
+ }
+ }
+ return closestIndex;
+ }
- function getClosestIndex(data, x) {
- var distance = Math.abs(sparkline.x()(data[0], 0) - x);
- var closestIndex = 0;
- for (var i = 0; i < data.length; i++){
- if (Math.abs(sparkline.x()(data[i], i) - x) < distance) {
- distance = Math.abs(sparkline.x()(data[i], i) - x);
- closestIndex = i;
+ index = [getClosestIndex(data, Math.round(x.invert(pos)))];
+ updateValueLine();
}
- }
- return closestIndex;
- }
- index = [getClosestIndex(data, Math.round(x.invert(pos)))];
+ });
- updateValueLine();
- }
+ return chart;
+ }
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.sparkline = sparkline;
+
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ xTickFormat: {get: function(){return xTickFormat;}, set: function(_){xTickFormat=_;}},
+ yTickFormat: {get: function(){return yTickFormat;}, set: function(_){yTickFormat=_;}},
+ showLastValue: {get: function(){return showLastValue;}, set: function(_){showLastValue=_;}},
+ alignValue: {get: function(){return alignValue;}, set: function(_){alignValue=_;}},
+ rightAlignValue: {get: function(){return rightAlignValue;}, set: function(_){rightAlignValue=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }}
});
- return chart;
- }
-
-
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
-
- // expose chart's sub-components
- chart.sparkline = sparkline;
-
- d3.rebind(chart, sparkline, 'x', 'y', 'xScale', 'yScale', 'color');
+ nv.utils.inheritOptions(chart, sparkline);
+ nv.utils.initOptions(chart);
- chart.options = nv.utils.optionsFunc.bind(chart);
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
return chart;
- };
-
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
-
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
-
- chart.xTickFormat = function(_) {
- if (!arguments.length) return xTickFormat;
- xTickFormat = _;
- return chart;
- };
-
- chart.yTickFormat = function(_) {
- if (!arguments.length) return yTickFormat;
- yTickFormat = _;
- return chart;
- };
-
- chart.showValue = function(_) {
- if (!arguments.length) return showValue;
- showValue = _;
- return chart;
- };
-
- chart.alignValue = function(_) {
- if (!arguments.length) return alignValue;
- alignValue = _;
- return chart;
- };
-
- chart.rightAlignValue = function(_) {
- if (!arguments.length) return rightAlignValue;
- rightAlignValue = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
-
- //============================================================
-
-
- return chart;
-}
+};
nv.models.stackedArea = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var margin = {top: 0, right: 0, bottom: 0, left: 0}
- , width = 960
- , height = 500
- , 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
- , style = 'stack'
- , offset = 'zero'
- , order = 'default'
- , interpolate = 'linear' // controls the line interpolation
- , clipEdge = false // if true, masks lines within x and y scale
- , x //can be accessed via chart.xScale()
- , y //can be accessed via chart.yScale()
- , scatter = nv.models.scatter()
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'areaClick', 'areaMouseover', 'areaMouseout')
- ;
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = 960
+ , height = 500
+ , 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
+ , container = null
+ , 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
+ , style = 'stack'
+ , offset = 'zero'
+ , order = 'default'
+ , interpolate = 'linear' // controls the line interpolation
+ , clipEdge = false // if true, masks lines within x and y scale
+ , x //can be accessed via chart.xScale()
+ , y //can be accessed via chart.yScale()
+ , scatter = nv.models.scatter()
+ , duration = 250
+ , dispatch = d3.dispatch('areaClick', 'areaMouseover', 'areaMouseout','renderEnd', 'elementClick', 'elementMouseover', 'elementMouseout')
+ ;
- scatter
- .size(2.2) // default size
- .sizeDomain([2.2,2.2]) // all the same size by default
+ scatter
+ .pointSize(2.2) // default size
+ .pointDomain([2.2, 2.2]) // all the same size by default
;
- /************************************
- * offset:
- * 'wiggle' (stream)
- * 'zero' (stacked)
- * 'expand' (normalize to 100%)
- * 'silhouette' (simple centered)
- *
- * order:
- * 'inside-out' (stream)
- * 'default' (input order)
- ************************************/
-
- //============================================================
-
-
- function chart(selection) {
- selection.each(function(data) {
- var availableWidth = width - margin.left - margin.right,
- availableHeight = height - margin.top - margin.bottom,
- container = d3.select(this);
-
- //------------------------------------------------------------
- // Setup Scales
-
- x = scatter.xScale();
- y = scatter.yScale();
-
- //------------------------------------------------------------
-
- var dataRaw = data;
- // Injecting point index into each point because d3.layout.stack().out does not give index
- data.forEach(function(aseries, i) {
- aseries.seriesIndex = i;
- aseries.values = aseries.values.map(function(d, j) {
- d.index = j;
- d.seriesIndex = i;
- return d;
- });
- });
+ /************************************
+ * offset:
+ * 'wiggle' (stream)
+ * 'zero' (stacked)
+ * 'expand' (normalize to 100%)
+ * 'silhouette' (simple centered)
+ *
+ * order:
+ * 'inside-out' (stream)
+ * 'default' (input order)
+ ************************************/
+
+ var renderWatch = nv.utils.renderWatch(dispatch, duration);
+
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(scatter);
+ selection.each(function(data) {
+ var availableWidth = width - margin.left - margin.right,
+ availableHeight = height - margin.top - margin.bottom;
+
+ container = d3.select(this);
+ nv.utils.initSVG(container);
+
+ // Setup Scales
+ x = scatter.xScale();
+ y = scatter.yScale();
+
+ var dataRaw = data;
+ // Injecting point index into each point because d3.layout.stack().out does not give index
+ data.forEach(function(aseries, i) {
+ aseries.seriesIndex = i;
+ aseries.values = aseries.values.map(function(d, j) {
+ d.index = j;
+ d.seriesIndex = i;
+ return d;
+ });
+ });
- var dataFiltered = data.filter(function(series) {
- return !series.disabled;
- });
+ var dataFiltered = data.filter(function(series) {
+ return !series.disabled;
+ });
- data = d3.layout.stack()
- .order(order)
- .offset(offset)
- .values(function(d) { return d.values }) //TODO: make values customizeable in EVERY model in this fashion
- .x(getX)
- .y(getY)
- .out(function(d, y0, y) {
- var yHeight = (getY(d) === 0) ? 0 : y;
+ data = d3.layout.stack()
+ .order(order)
+ .offset(offset)
+ .values(function(d) { return d.values }) //TODO: make values customizeable in EVERY model in this fashion
+ .x(getX)
+ .y(getY)
+ .out(function(d, y0, y) {
d.display = {
- y: yHeight,
- y0: y0
+ y: y,
+ y0: y0
};
})
- (dataFiltered);
-
-
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
-
- var wrap = container.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', 'nv-areaWrap');
- gEnter.append('g').attr('class', 'nv-scatterWrap');
-
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
-
- //------------------------------------------------------------
-
+ (dataFiltered);
+
+ // Setup containers and skeleton of chart
+ var wrap = container.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', 'nv-areaWrap');
+ gEnter.append('g').attr('class', 'nv-scatterWrap');
+
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+
+ // If the user has not specified forceY, make sure 0 is included in the domain
+ // Otherwise, use user-specified values for forceY
+ if (scatter.forceY().length == 0) {
+ scatter.forceY().push(0);
+ }
+
+ scatter
+ .width(availableWidth)
+ .height(availableHeight)
+ .x(getX)
+ .y(function(d) {
+ if (d.display !== undefined) { return d.display.y + d.display.y0; }
+ })
+ .forceY([0])
+ .color(data.map(function(d,i) {
+ return d.color || color(d, d.seriesIndex);
+ }));
- scatter
- .width(availableWidth)
- .height(availableHeight)
- .x(getX)
- .y(function(d) { return d.display.y + d.display.y0 })
- .forceY([0])
- .color(data.map(function(d,i) {
- return d.color || color(d, d.seriesIndex);
- }));
+ var scatterWrap = g.select('.nv-scatterWrap')
+ .datum(data);
+ scatterWrap.call(scatter);
- var scatterWrap = g.select('.nv-scatterWrap')
- .datum(data);
+ defsEnter.append('clipPath')
+ .attr('id', 'nv-edge-clip-' + id)
+ .append('rect');
- scatterWrap.call(scatter);
+ wrap.select('#nv-edge-clip-' + id + ' rect')
+ .attr('width', availableWidth)
+ .attr('height', availableHeight);
- defsEnter.append('clipPath')
- .attr('id', 'nv-edge-clip-' + id)
- .append('rect');
+ g.attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
- wrap.select('#nv-edge-clip-' + id + ' rect')
- .attr('width', availableWidth)
- .attr('height', availableHeight);
+ var area = d3.svg.area()
+ .x(function(d,i) { return x(getX(d,i)) })
+ .y0(function(d) {
+ return y(d.display.y0)
+ })
+ .y1(function(d) {
+ return y(d.display.y + d.display.y0)
+ })
+ .interpolate(interpolate);
- g .attr('clip-path', clipEdge ? 'url(#nv-edge-clip-' + id + ')' : '');
+ var zeroArea = d3.svg.area()
+ .x(function(d,i) { return x(getX(d,i)) })
+ .y0(function(d) { return y(d.display.y0) })
+ .y1(function(d) { return y(d.display.y0) });
- var area = d3.svg.area()
- .x(function(d,i) { return x(getX(d,i)) })
- .y0(function(d) {
- return y(d.display.y0)
- })
- .y1(function(d) {
- return y(d.display.y + d.display.y0)
- })
- .interpolate(interpolate);
+ var path = g.select('.nv-areaWrap').selectAll('path.nv-area')
+ .data(function(d) { return d });
- var zeroArea = d3.svg.area()
- .x(function(d,i) { return x(getX(d,i)) })
- .y0(function(d) { return y(d.display.y0) })
- .y1(function(d) { return y(d.display.y0) });
+ path.enter().append('path').attr('class', function(d,i) { return 'nv-area nv-area-' + i })
+ .attr('d', function(d,i){
+ return zeroArea(d.values, d.seriesIndex);
+ })
+ .on('mouseover', function(d,i) {
+ d3.select(this).classed('hover', true);
+ dispatch.areaMouseover({
+ point: d,
+ series: d.key,
+ pos: [d3.event.pageX, d3.event.pageY],
+ seriesIndex: d.seriesIndex
+ });
+ })
+ .on('mouseout', function(d,i) {
+ d3.select(this).classed('hover', false);
+ dispatch.areaMouseout({
+ point: d,
+ series: d.key,
+ pos: [d3.event.pageX, d3.event.pageY],
+ seriesIndex: d.seriesIndex
+ });
+ })
+ .on('click', function(d,i) {
+ d3.select(this).classed('hover', false);
+ dispatch.areaClick({
+ point: d,
+ series: d.key,
+ pos: [d3.event.pageX, d3.event.pageY],
+ seriesIndex: d.seriesIndex
+ });
+ });
+ path.exit().remove();
+ path.style('fill', function(d,i){
+ return d.color || color(d, d.seriesIndex)
+ })
+ .style('stroke', function(d,i){ return d.color || color(d, d.seriesIndex) });
+ path.watchTransition(renderWatch,'stackedArea path')
+ .attr('d', function(d,i) {
+ return area(d.values,i)
+ });
- var path = g.select('.nv-areaWrap').selectAll('path.nv-area')
- .data(function(d) { return d });
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- path.enter().append('path').attr('class', function(d,i) { return 'nv-area nv-area-' + i })
- .attr('d', function(d,i){
- return zeroArea(d.values, d.seriesIndex);
- })
- .on('mouseover', function(d,i) {
- d3.select(this).classed('hover', true);
- dispatch.areaMouseover({
- point: d,
- series: d.key,
- pos: [d3.event.pageX, d3.event.pageY],
- seriesIndex: d.seriesIndex
+ scatter.dispatch.on('elementMouseover.area', function(e) {
+ g.select('.nv-chart-' + id + ' .nv-area-' + e.seriesIndex).classed('hover', true);
});
- })
- .on('mouseout', function(d,i) {
- d3.select(this).classed('hover', false);
- dispatch.areaMouseout({
- point: d,
- series: d.key,
- pos: [d3.event.pageX, d3.event.pageY],
- seriesIndex: d.seriesIndex
+ scatter.dispatch.on('elementMouseout.area', function(e) {
+ g.select('.nv-chart-' + id + ' .nv-area-' + e.seriesIndex).classed('hover', false);
});
- })
- .on('click', function(d,i) {
- d3.select(this).classed('hover', false);
- dispatch.areaClick({
- point: d,
- series: d.key,
- pos: [d3.event.pageX, d3.event.pageY],
- seriesIndex: d.seriesIndex
- });
- })
-
- path.exit().remove();
-
- path
- .style('fill', function(d,i){
- return d.color || color(d, d.seriesIndex)
- })
- .style('stroke', function(d,i){ return d.color || color(d, d.seriesIndex) });
- path.transition()
- .attr('d', function(d,i) {
- return area(d.values,i)
- });
-
-
-
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
-
- scatter.dispatch.on('elementMouseover.area', function(e) {
- g.select('.nv-chart-' + id + ' .nv-area-' + e.seriesIndex).classed('hover', true);
- });
- scatter.dispatch.on('elementMouseout.area', function(e) {
- g.select('.nv-chart-' + id + ' .nv-area-' + e.seriesIndex).classed('hover', false);
- });
-
- //============================================================
- //Special offset functions
- chart.d3_stackedOffset_stackPercent = function(stackData) {
- var n = stackData.length, //How many series
- m = stackData[0].length, //how many points per series
- k = 1 / n,
- i,
- j,
- o,
- y0 = [];
-
- for (j = 0; j < m; ++j) { //Looping through all points
- for (i = 0, o = 0; i < dataRaw.length; i++) //looping through series'
- o += getY(dataRaw[i].values[j]) //total value of all points at a certian point in time.
-
- if (o) for (i = 0; i < n; i++)
- stackData[i][j][1] /= o;
- else
- for (i = 0; i < n; i++)
- stackData[i][j][1] = k;
- }
- for (j = 0; j < m; ++j) y0[j] = 0;
- return y0;
- };
-
- });
-
- return chart;
- }
+ //Special offset functions
+ chart.d3_stackedOffset_stackPercent = function(stackData) {
+ var n = stackData.length, //How many series
+ m = stackData[0].length, //how many points per series
+ i,
+ j,
+ o,
+ y0 = [];
+
+ for (j = 0; j < m; ++j) { //Looping through all points
+ for (i = 0, o = 0; i < dataRaw.length; i++) { //looping through all series
+ o += getY(dataRaw[i].values[j]); //total y value of all series at a certian point in time.
+ }
+ if (o) for (i = 0; i < n; i++) { //(total y value of all series at point in time i) != 0
+ stackData[i][j][1] /= o;
+ } else { //(total y value of all series at point in time i) == 0
+ for (i = 0; i < n; i++) {
+ stackData[i][j][1] = 0;
+ }
+ }
+ }
+ for (j = 0; j < m; ++j) y0[j] = 0;
+ return y0;
+ };
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
+ });
- scatter.dispatch.on('elementClick.area', function(e) {
- dispatch.areaClick(e);
- })
- scatter.dispatch.on('elementMouseover.tooltip', function(e) {
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top],
- dispatch.tooltipShow(e);
- });
- scatter.dispatch.on('elementMouseout.tooltip', function(e) {
- dispatch.tooltipHide(e);
- });
+ renderWatch.renderEnd('stackedArea immediate');
+ return chart;
+ }
- //============================================================
+ //============================================================
+ // Global getters and setters
+ //------------------------------------------------------------
- //============================================================
- // Global getters and setters
- //------------------------------------------------------------
+ chart.dispatch = dispatch;
+ chart.scatter = scatter;
- chart.dispatch = dispatch;
- chart.scatter = scatter;
+ scatter.dispatch.on('elementClick', function(){ dispatch.elementClick.apply(this, arguments); });
+ scatter.dispatch.on('elementMouseover', function(){ dispatch.elementMouseover.apply(this, arguments); });
+ scatter.dispatch.on('elementMouseout', function(){ dispatch.elementMouseout.apply(this, arguments); });
- d3.rebind(chart, scatter, 'interactive', 'size', 'xScale', 'yScale', 'zScale', 'xDomain', 'yDomain', 'xRange', 'yRange',
- 'sizeDomain', 'forceX', 'forceY', 'forceSize', 'clipVoronoi', 'useVoronoi','clipRadius','highlightPoint','clearHighlights');
+ chart.interpolate = function(_) {
+ if (!arguments.length) return interpolate;
+ interpolate = _;
+ return chart;
+ };
- chart.options = nv.utils.optionsFunc.bind(chart);
+ chart.duration = function(_) {
+ if (!arguments.length) return duration;
+ duration = _;
+ renderWatch.reset(duration);
+ scatter.duration(duration);
+ return chart;
+ };
- chart.x = function(_) {
- if (!arguments.length) return getX;
- getX = d3.functor(_);
- return chart;
- };
+ chart.dispatch = dispatch;
+ chart.scatter = scatter;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ clipEdge: {get: function(){return clipEdge;}, set: function(_){clipEdge=_;}},
+ offset: {get: function(){return offset;}, set: function(_){offset=_;}},
+ order: {get: function(){return order;}, set: function(_){order=_;}},
+ interpolate: {get: function(){return interpolate;}, set: function(_){interpolate=_;}},
+
+ // simple functor options
+ x: {get: function(){return getX;}, set: function(_){getX = d3.functor(_);}},
+ y: {get: function(){return getY;}, set: function(_){getY = d3.functor(_);}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ }},
+ style: {get: function(){return style;}, set: function(_){
+ style = _;
+ switch (style) {
+ case 'stack':
+ chart.offset('zero');
+ chart.order('default');
+ break;
+ case 'stream':
+ chart.offset('wiggle');
+ chart.order('inside-out');
+ break;
+ case 'stream-center':
+ chart.offset('silhouette');
+ chart.order('inside-out');
+ break;
+ case 'expand':
+ chart.offset('expand');
+ chart.order('default');
+ break;
+ case 'stack_percent':
+ chart.offset(chart.d3_stackedOffset_stackPercent);
+ chart.order('default');
+ break;
+ }
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ scatter.duration(duration);
+ }}
+ });
- chart.y = function(_) {
- if (!arguments.length) return getY;
- getY = d3.functor(_);
- return chart;
- }
-
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ nv.utils.inheritOptions(chart, scatter);
+ nv.utils.initOptions(chart);
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
return chart;
- };
+};
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+nv.models.stackedAreaChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var stacked = nv.models.stackedArea()
+ , xAxis = nv.models.axis()
+ , yAxis = nv.models.axis()
+ , legend = nv.models.legend()
+ , controls = nv.models.legend()
+ , interactiveLayer = nv.interactiveGuideline()
+ , tooltip = nv.models.tooltip()
+ ;
- chart.clipEdge = function(_) {
- if (!arguments.length) return clipEdge;
- clipEdge = _;
- return chart;
- };
+ var margin = {top: 30, right: 25, bottom: 50, left: 60}
+ , width = null
+ , height = null
+ , color = nv.utils.defaultColor()
+ , showControls = true
+ , showLegend = true
+ , showXAxis = true
+ , showYAxis = true
+ , rightAlignYAxis = false
+ , useInteractiveGuideline = false
+ , showTotalInTooltip = true
+ , totalLabel = 'TOTAL'
+ , x //can be accessed via chart.xScale()
+ , y //can be accessed via chart.yScale()
+ , state = nv.utils.state()
+ , defaultState = null
+ , noData = null
+ , dispatch = d3.dispatch('stateChange', 'changeState','renderEnd')
+ , controlWidth = 250
+ , controlOptions = ['Stacked','Stream','Expanded']
+ , controlLabels = {}
+ , duration = 250
+ ;
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- return chart;
- };
+ state.style = stacked.style();
+ xAxis.orient('bottom').tickPadding(7);
+ yAxis.orient((rightAlignYAxis) ? 'right' : 'left');
- chart.offset = function(_) {
- if (!arguments.length) return offset;
- offset = _;
- return chart;
- };
+ tooltip
+ .headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ })
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ });
- chart.order = function(_) {
- if (!arguments.length) return order;
- order = _;
- return chart;
- };
-
- //shortcut for offset + order
- chart.style = function(_) {
- if (!arguments.length) return style;
- style = _;
-
- switch (style) {
- case 'stack':
- chart.offset('zero');
- chart.order('default');
- break;
- case 'stream':
- chart.offset('wiggle');
- chart.order('inside-out');
- break;
- case 'stream-center':
- chart.offset('silhouette');
- chart.order('inside-out');
- break;
- case 'expand':
- chart.offset('expand');
- chart.order('default');
- break;
- case 'stack_percent':
- chart.offset(chart.d3_stackedOffset_stackPercent);
- chart.order('default');
- break;
- }
+ interactiveLayer.tooltip
+ .headerFormatter(function(d, i) {
+ return xAxis.tickFormat()(d, i);
+ })
+ .valueFormatter(function(d, i) {
+ return yAxis.tickFormat()(d, i);
+ });
- return chart;
- };
+ var oldYTickFormat = null,
+ oldValueFormatter = null;
- chart.interpolate = function(_) {
- if (!arguments.length) return interpolate;
- interpolate = _;
- return chart;
- };
- //============================================================
+ controls.updateState(false);
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- return chart;
-}
+ var renderWatch = nv.utils.renderWatch(dispatch);
+ var style = stacked.style();
-nv.models.stackedAreaChart = function() {
- "use strict";
- //============================================================
- // Public Variables with Default Settings
- //------------------------------------------------------------
-
- var stacked = nv.models.stackedArea()
- , xAxis = nv.models.axis()
- , yAxis = nv.models.axis()
- , legend = nv.models.legend()
- , controls = nv.models.legend()
- , interactiveLayer = nv.interactiveGuideline()
- ;
+ var stateGetter = function(data) {
+ return function(){
+ return {
+ active: data.map(function(d) { return !d.disabled }),
+ style: stacked.style()
+ };
+ }
+ };
- var margin = {top: 30, right: 25, bottom: 50, left: 60}
- , width = null
- , height = null
- , color = nv.utils.defaultColor() // a function that takes in d, i and returns color
- , showControls = true
- , showLegend = true
- , showXAxis = true
- , showYAxis = true
- , rightAlignYAxis = false
- , useInteractiveGuideline = false
- , tooltips = true
- , tooltip = function(key, x, y, e, graph) {
- return '<h3>' + key + '</h3>' +
- '<p>' + y + ' on ' + x + '</p>'
- }
- , x //can be accessed via chart.xScale()
- , y //can be accessed via chart.yScale()
- , yAxisTickFormat = d3.format(',.2f')
- , state = { style: stacked.style() }
- , defaultState = null
- , noData = 'No Data Available.'
- , dispatch = d3.dispatch('tooltipShow', 'tooltipHide', 'stateChange', 'changeState')
- , controlWidth = 250
- , cData = ['Stacked','Stream','Expanded']
- , controlLabels = {}
- , transitionDuration = 250
- ;
+ var stateSetter = function(data) {
+ return function(state) {
+ if (state.style !== undefined)
+ style = state.style;
+ if (state.active !== undefined)
+ data.forEach(function(series,i) {
+ series.disabled = !state.active[i];
+ });
+ }
+ };
- xAxis
- .orient('bottom')
- .tickPadding(7)
- ;
- yAxis
- .orient((rightAlignYAxis) ? 'right' : 'left')
- ;
+ var percentFormatter = d3.format('%');
+
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(stacked);
+ if (showXAxis) renderWatch.models(xAxis);
+ if (showYAxis) renderWatch.models(yAxis);
+
+ selection.each(function(data) {
+ var container = d3.select(this),
+ that = this;
+ nv.utils.initSVG(container);
+
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+
+ chart.update = function() { container.transition().duration(duration).call(chart); };
+ chart.container = this;
+
+ state
+ .setter(stateSetter(data), chart.update)
+ .getter(stateGetter(data))
+ .update();
+
+ // DEPRECATED set state.disabled
+ state.disabled = data.map(function(d) { return !!d.disabled });
+
+ if (!defaultState) {
+ var key;
+ defaultState = {};
+ for (key in state) {
+ if (state[key] instanceof Array)
+ defaultState[key] = state[key].slice(0);
+ else
+ defaultState[key] = state[key];
+ }
+ }
- controls.updateState(false);
- //============================================================
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
+ nv.utils.noData(chart, container)
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
+ // Setup Scales
+ x = stacked.xScale();
+ y = stacked.yScale();
- //============================================================
- // Private Variables
- //------------------------------------------------------------
+ // Setup containers and skeleton of chart
+ 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');
+ var g = wrap.select('g');
- var showTooltip = function(e, offsetElement) {
- var left = e.pos[0] + ( offsetElement.offsetLeft || 0 ),
- top = e.pos[1] + ( offsetElement.offsetTop || 0),
- x = xAxis.tickFormat()(stacked.x()(e.point, e.pointIndex)),
- y = yAxis.tickFormat()(stacked.y()(e.point, e.pointIndex)),
- content = tooltip(e.series.key, x, y, e, chart);
+ gEnter.append("rect").style("opacity",0);
+ 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');
+ gEnter.append('g').attr('class', 'nv-interactive');
- nv.tooltip.show([left, top], content, e.value < 0 ? 'n' : 's', null, offsetElement);
- };
+ g.select("rect").attr("width",availableWidth).attr("height",availableHeight);
- //============================================================
+ // Legend
+ if (showLegend) {
+ var legendWidth = (showControls) ? availableWidth - controlWidth : availableWidth;
+ legend.width(legendWidth);
+ g.select('.nv-legendWrap').datum(data).call(legend);
- function chart(selection) {
- selection.each(function(data) {
- var container = d3.select(this),
- that = this;
+ if ( margin.top != legend.height()) {
+ margin.top = legend.height();
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- var availableWidth = (width || parseInt(container.style('width')) || 960)
- - margin.left - margin.right,
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
+ g.select('.nv-legendWrap')
+ .attr('transform', 'translate(' + (availableWidth-legendWidth) + ',' + (-margin.top) +')');
+ }
- chart.update = function() { container.transition().duration(transitionDuration).call(chart); };
- chart.container = this;
+ // Controls
+ if (showControls) {
+ var controlsData = [
+ {
+ key: controlLabels.stacked || 'Stacked',
+ metaKey: 'Stacked',
+ disabled: stacked.style() != 'stack',
+ style: 'stack'
+ },
+ {
+ key: controlLabels.stream || 'Stream',
+ metaKey: 'Stream',
+ disabled: stacked.style() != 'stream',
+ style: 'stream'
+ },
+ {
+ key: controlLabels.expanded || 'Expanded',
+ metaKey: 'Expanded',
+ disabled: stacked.style() != 'expand',
+ style: 'expand'
+ },
+ {
+ key: controlLabels.stack_percent || 'Stack %',
+ metaKey: 'Stack_Percent',
+ disabled: stacked.style() != 'stack_percent',
+ style: 'stack_percent'
+ }
+ ];
- //set state.disabled
- state.disabled = data.map(function(d) { return !!d.disabled });
+ controlWidth = (controlOptions.length/3) * 260;
+ controlsData = controlsData.filter(function(d) {
+ return controlOptions.indexOf(d.metaKey) !== -1;
+ });
- if (!defaultState) {
- var key;
- defaultState = {};
- for (key in state) {
- if (state[key] instanceof Array)
- defaultState[key] = state[key].slice(0);
- else
- defaultState[key] = state[key];
- }
- }
+ controls
+ .width( controlWidth )
+ .color(['#444', '#444', '#444']);
- //------------------------------------------------------------
- // Display No Data message if there's nothing to show.
+ g.select('.nv-controlsWrap')
+ .datum(controlsData)
+ .call(controls);
- if (!data || !data.length || !data.filter(function(d) { return d.values.length }).length) {
- var noDataText = container.selectAll('.nv-noData').data([noData]);
+ if ( margin.top != Math.max(controls.height(), legend.height()) ) {
+ margin.top = Math.max(controls.height(), legend.height());
+ availableHeight = nv.utils.availableHeight(height, container, margin);
+ }
- noDataText.enter().append('text')
- .attr('class', 'nvd3 nv-noData')
- .attr('dy', '-.7em')
- .style('text-anchor', 'middle');
+ g.select('.nv-controlsWrap')
+ .attr('transform', 'translate(0,' + (-margin.top) +')');
+ }
- noDataText
- .attr('x', margin.left + availableWidth / 2)
- .attr('y', margin.top + availableHeight / 2)
- .text(function(d) { return d });
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- return chart;
- } else {
- container.selectAll('.nv-noData').remove();
- }
+ if (rightAlignYAxis) {
+ g.select(".nv-y.nv-axis")
+ .attr("transform", "translate(" + availableWidth + ",0)");
+ }
- //------------------------------------------------------------
+ //Set up interactive layer
+ if (useInteractiveGuideline) {
+ interactiveLayer
+ .width(availableWidth)
+ .height(availableHeight)
+ .margin({left: margin.left, top: margin.top})
+ .svgContainer(container)
+ .xScale(x);
+ wrap.select(".nv-interactive").call(interactiveLayer);
+ }
+ stacked
+ .width(availableWidth)
+ .height(availableHeight);
- //------------------------------------------------------------
- // Setup Scales
+ var stackedWrap = g.select('.nv-stackedWrap')
+ .datum(data);
- x = stacked.xScale();
- y = stacked.yScale();
+ stackedWrap.transition().call(stacked);
- //------------------------------------------------------------
+ // Setup Axes
+ if (showXAxis) {
+ xAxis.scale(x)
+ ._ticks( nv.utils.calcTicksX(availableWidth/100, data) )
+ .tickSize( -availableHeight, 0);
+ g.select('.nv-x.nv-axis')
+ .attr('transform', 'translate(0,' + availableHeight + ')');
- //------------------------------------------------------------
- // Setup containers and skeleton of chart
+ g.select('.nv-x.nv-axis')
+ .transition().duration(0)
+ .call(xAxis);
+ }
- 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');
- var g = wrap.select('g');
+ if (showYAxis) {
+ var ticks;
+ if (stacked.offset() === 'wiggle') {
+ ticks = 0;
+ }
+ else {
+ ticks = nv.utils.calcTicksY(availableHeight/36, data);
+ }
+ yAxis.scale(y)
+ ._ticks(ticks)
+ .tickSize(-availableWidth, 0);
- gEnter.append("rect").style("opacity",0);
- 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');
- gEnter.append('g').attr('class', 'nv-interactive');
+ if (stacked.style() === 'expand' || stacked.style() === 'stack_percent') {
+ var currentFormat = yAxis.tickFormat();
- g.select("rect").attr("width",availableWidth).attr("height",availableHeight);
- //------------------------------------------------------------
- // Legend
+ if ( !oldYTickFormat || currentFormat !== percentFormatter )
+ oldYTickFormat = currentFormat;
- if (showLegend) {
- var legendWidth = (showControls) ? availableWidth - controlWidth : availableWidth;
- legend
- .width(legendWidth);
+ //Forces the yAxis to use percentage in 'expand' mode.
+ yAxis.tickFormat(percentFormatter);
+ }
+ else {
+ if (oldYTickFormat) {
+ yAxis.tickFormat(oldYTickFormat);
+ oldYTickFormat = null;
+ }
+ }
- g.select('.nv-legendWrap')
- .datum(data)
- .call(legend);
+ g.select('.nv-y.nv-axis')
+ .transition().duration(0)
+ .call(yAxis);
+ }
- if ( margin.top != legend.height()) {
- margin.top = legend.height();
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
- }
+ //============================================================
+ // Event Handling/Dispatching (in chart's scope)
+ //------------------------------------------------------------
- g.select('.nv-legendWrap')
- .attr('transform', 'translate(' + (availableWidth-legendWidth) + ',' + (-margin.top) +')');
- }
-
- //------------------------------------------------------------
-
-
- //------------------------------------------------------------
- // Controls
-
- if (showControls) {
- var controlsData = [
- {
- key: controlLabels.stacked || 'Stacked',
- metaKey: 'Stacked',
- disabled: stacked.style() != 'stack',
- style: 'stack'
- },
- {
- key: controlLabels.stream || 'Stream',
- metaKey: 'Stream',
- disabled: stacked.style() != 'stream',
- style: 'stream'
- },
- {
- key: controlLabels.expanded || 'Expanded',
- metaKey: 'Expanded',
- disabled: stacked.style() != 'expand',
- style: 'expand'
- },
- {
- key: controlLabels.stack_percent || 'Stack %',
- metaKey: 'Stack_Percent',
- disabled: stacked.style() != 'stack_percent',
- style: 'stack_percent'
- }
- ];
-
- controlWidth = (cData.length/3) * 260;
-
- controlsData = controlsData.filter(function(d) {
- return cData.indexOf(d.metaKey) !== -1;
- })
+ stacked.dispatch.on('areaClick.toggle', function(e) {
+ if (data.filter(function(d) { return !d.disabled }).length === 1)
+ data.forEach(function(d) {
+ d.disabled = false;
+ });
+ else
+ data.forEach(function(d,i) {
+ d.disabled = (i != e.seriesIndex);
+ });
- controls
- .width( controlWidth )
- .color(['#444', '#444', '#444']);
+ state.disabled = data.map(function(d) { return !!d.disabled });
+ dispatch.stateChange(state);
- g.select('.nv-controlsWrap')
- .datum(controlsData)
- .call(controls);
+ chart.update();
+ });
+ legend.dispatch.on('stateChange', function(newState) {
+ for (var key in newState)
+ state[key] = newState[key];
+ dispatch.stateChange(state);
+ chart.update();
+ });
- if ( margin.top != Math.max(controls.height(), legend.height()) ) {
- margin.top = Math.max(controls.height(), legend.height());
- availableHeight = (height || parseInt(container.style('height')) || 400)
- - margin.top - margin.bottom;
- }
+ controls.dispatch.on('legendClick', function(d,i) {
+ if (!d.disabled) return;
+ controlsData = controlsData.map(function(s) {
+ s.disabled = true;
+ return s;
+ });
+ d.disabled = false;
- g.select('.nv-controlsWrap')
- .attr('transform', 'translate(0,' + (-margin.top) +')');
- }
+ stacked.style(d.style);
- //------------------------------------------------------------
+ state.style = stacked.style();
+ dispatch.stateChange(state);
- wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
+ chart.update();
+ });
- if (rightAlignYAxis) {
- g.select(".nv-y.nv-axis")
- .attr("transform", "translate(" + availableWidth + ",0)");
- }
+ interactiveLayer.dispatch.on('elementMousemove', function(e) {
+ stacked.clearHighlights();
+ var singlePoint, pointIndex, pointXLocation, allData = [], valueSum = 0;
+ data
+ .filter(function(series, i) {
+ series.seriesIndex = i;
+ return !series.disabled;
+ })
+ .forEach(function(series,i) {
+ pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
+ var point = series.values[pointIndex];
+ var pointYValue = chart.y()(point, pointIndex);
+ if (pointYValue != null) {
+ stacked.highlightPoint(i, pointIndex, true);
+ }
+ if (typeof point === 'undefined') return;
+ if (typeof singlePoint === 'undefined') singlePoint = point;
+ if (typeof pointXLocation === 'undefined') pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
+
+ //If we are in 'expand' mode, use the stacked percent value instead of raw value.
+ var tooltipValue = (stacked.style() == 'expand') ? point.display.y : chart.y()(point,pointIndex);
+ allData.push({
+ key: series.key,
+ value: tooltipValue,
+ color: color(series,series.seriesIndex),
+ stackedValue: point.display
+ });
- //------------------------------------------------------------
- // Main Chart Component(s)
+ if (showTotalInTooltip && stacked.style() != 'expand') {
+ valueSum += tooltipValue;
+ };
+ });
+
+ allData.reverse();
+
+ //Highlight the tooltip entry based on which stack the mouse is closest to.
+ if (allData.length > 2) {
+ var yValue = chart.yScale().invert(e.mouseY);
+ var yDistMax = Infinity, indexToHighlight = null;
+ allData.forEach(function(series,i) {
+
+ //To handle situation where the stacked area chart is negative, we need to use absolute values
+ //when checking if the mouse Y value is within the stack area.
+ yValue = Math.abs(yValue);
+ var stackedY0 = Math.abs(series.stackedValue.y0);
+ var stackedY = Math.abs(series.stackedValue.y);
+ if ( yValue >= stackedY0 && yValue <= (stackedY + stackedY0))
+ {
+ indexToHighlight = i;
+ return;
+ }
+ });
+ if (indexToHighlight != null)
+ allData[indexToHighlight].highlight = true;
+ }
- //------------------------------------------------------------
- //Set up interactive layer
- if (useInteractiveGuideline) {
- interactiveLayer
- .width(availableWidth)
- .height(availableHeight)
- .margin({left: margin.left, top: margin.top})
- .svgContainer(container)
- .xScale(x);
- wrap.select(".nv-interactive").call(interactiveLayer);
- }
+ //If we are not in 'expand' mode, add a 'Total' row to the tooltip.
+ if (showTotalInTooltip && stacked.style() != 'expand' && allData.length >= 2) {
+ allData.push({
+ key: totalLabel,
+ value: valueSum,
+ total: true
+ });
+ }
- stacked
- .width(availableWidth)
- .height(availableHeight)
+ var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex));
- var stackedWrap = g.select('.nv-stackedWrap')
- .datum(data);
+ var valueFormatter = interactiveLayer.tooltip.valueFormatter();
+ // Keeps track of the tooltip valueFormatter if the chart changes to expanded view
+ if (stacked.style() === 'expand' || stacked.style() === 'stack_percent') {
+ if ( !oldValueFormatter ) {
+ oldValueFormatter = valueFormatter;
+ }
+ //Forces the tooltip to use percentage in 'expand' mode.
+ valueFormatter = d3.format(".1%");
+ }
+ else {
+ if (oldValueFormatter) {
+ valueFormatter = oldValueFormatter;
+ oldValueFormatter = null;
+ }
+ }
- stackedWrap.transition().call(stacked);
+ interactiveLayer.tooltip
+ .chartContainer(that.parentNode)
+ .valueFormatter(valueFormatter)
+ .data(
+ {
+ value: xValue,
+ series: allData
+ }
+ )();
- //------------------------------------------------------------
+ interactiveLayer.renderGuideLine(pointXLocation);
+ });
- //------------------------------------------------------------
- // Setup Axes
+ interactiveLayer.dispatch.on("elementMouseout",function(e) {
+ stacked.clearHighlights();
+ });
- if (showXAxis) {
- xAxis
- .scale(x)
- .ticks( availableWidth / 100 )
- .tickSize( -availableHeight, 0);
+ // Update chart from a state object passed to event handler
+ dispatch.on('changeState', function(e) {
- g.select('.nv-x.nv-axis')
- .attr('transform', 'translate(0,' + availableHeight + ')');
+ if (typeof e.disabled !== 'undefined' && data.length === e.disabled.length) {
+ data.forEach(function(series,i) {
+ series.disabled = e.disabled[i];
+ });
- g.select('.nv-x.nv-axis')
- .transition().duration(0)
- .call(xAxis);
- }
+ state.disabled = e.disabled;
+ }
- if (showYAxis) {
- yAxis
- .scale(y)
- .ticks(stacked.offset() == 'wiggle' ? 0 : availableHeight / 36)
- .tickSize(-availableWidth, 0)
- .setTickFormat( (stacked.style() == 'expand' || stacked.style() == 'stack_percent')
- ? d3.format('%') : yAxisTickFormat);
+ if (typeof e.style !== 'undefined') {
+ stacked.style(e.style);
+ style = e.style;
+ }
- g.select('.nv-y.nv-axis')
- .transition().duration(0)
- .call(yAxis);
- }
+ chart.update();
+ });
- //------------------------------------------------------------
+ });
+ renderWatch.renderEnd('stacked Area chart immediate');
+ return chart;
+ }
- //============================================================
- // Event Handling/Dispatching (in chart's scope)
- //------------------------------------------------------------
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
- stacked.dispatch.on('areaClick.toggle', function(e) {
- if (data.filter(function(d) { return !d.disabled }).length === 1)
- data.forEach(function(d) {
- d.disabled = false;
- });
- else
- data.forEach(function(d,i) {
- d.disabled = (i != e.seriesIndex);
- });
+ stacked.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt.point['x'] = stacked.x()(evt.point);
+ evt.point['y'] = stacked.y()(evt.point);
+ tooltip.data(evt).hidden(false);
+ });
- state.disabled = data.map(function(d) { return !!d.disabled });
- dispatch.stateChange(state);
+ stacked.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true)
+ });
- chart.update();
- });
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.stacked = stacked;
+ chart.legend = legend;
+ chart.controls = controls;
+ chart.xAxis = xAxis;
+ chart.yAxis = yAxis;
+ chart.interactiveLayer = interactiveLayer;
+ chart.tooltip = tooltip;
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ showLegend: {get: function(){return showLegend;}, set: function(_){showLegend=_;}},
+ showXAxis: {get: function(){return showXAxis;}, set: function(_){showXAxis=_;}},
+ showYAxis: {get: function(){return showYAxis;}, set: function(_){showYAxis=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ showControls: {get: function(){return showControls;}, set: function(_){showControls=_;}},
+ controlLabels: {get: function(){return controlLabels;}, set: function(_){controlLabels=_;}},
+ controlOptions: {get: function(){return controlOptions;}, set: function(_){controlOptions=_;}},
+ showTotalInTooltip: {get: function(){return showTotalInTooltip;}, set: function(_){showTotalInTooltip=_;}},
+ totalLabel: {get: function(){return totalLabel;}, set: function(_){totalLabel=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ stacked.duration(duration);
+ xAxis.duration(duration);
+ yAxis.duration(duration);
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color = nv.utils.getColor(_);
+ legend.color(color);
+ stacked.color(color);
+ }},
+ rightAlignYAxis: {get: function(){return rightAlignYAxis;}, set: function(_){
+ rightAlignYAxis = _;
+ yAxis.orient( rightAlignYAxis ? 'right' : 'left');
+ }},
+ useInteractiveGuideline: {get: function(){return useInteractiveGuideline;}, set: function(_){
+ useInteractiveGuideline = !!_;
+ chart.interactive(!_);
+ chart.useVoronoi(!_);
+ stacked.scatter.interactive(!_);
+ }}
+ });
- legend.dispatch.on('stateChange', function(newState) {
- state.disabled = newState.disabled;
- dispatch.stateChange(state);
- chart.update();
- });
+ nv.utils.inheritOptions(chart, stacked);
+ nv.utils.initOptions(chart);
- controls.dispatch.on('legendClick', function(d,i) {
- if (!d.disabled) return;
+ return chart;
+};
+// based on http://bl.ocks.org/kerryrodden/477c1bfb081b783f80ad
+nv.models.sunburst = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var margin = {top: 0, right: 0, bottom: 0, left: 0}
+ , width = null
+ , height = null
+ , mode = "count"
+ , modes = {count: function(d) { return 1; }, size: function(d) { return d.size }}
+ , id = Math.floor(Math.random() * 10000) //Create semi-unique ID in case user doesn't select one
+ , container = null
+ , color = nv.utils.defaultColor()
+ , duration = 500
+ , dispatch = d3.dispatch('chartClick', 'elementClick', 'elementDblClick', 'elementMousemove', 'elementMouseover', 'elementMouseout', 'renderEnd')
+ ;
- controlsData = controlsData.map(function(s) {
- s.disabled = true;
- return s;
- });
- d.disabled = false;
+ var x = d3.scale.linear().range([0, 2 * Math.PI]);
+ var y = d3.scale.sqrt();
- stacked.style(d.style);
+ var partition = d3.layout.partition()
+ .sort(null)
+ .value(function(d) { return 1; });
+ var arc = d3.svg.arc()
+ .startAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x))); })
+ .endAngle(function(d) { return Math.max(0, Math.min(2 * Math.PI, x(d.x + d.dx))); })
+ .innerRadius(function(d) { return Math.max(0, y(d.y)); })
+ .outerRadius(function(d) { return Math.max(0, y(d.y + d.dy)); });
- state.style = stacked.style();
- dispatch.stateChange(state);
+ // Keep track of the current and previous node being displayed as the root.
+ var node, prevNode;
+ // Keep track of the root node
+ var rootNode;
- chart.update();
- });
+ //============================================================
+ // chart function
+ //------------------------------------------------------------
+ var renderWatch = nv.utils.renderWatch(dispatch);
- interactiveLayer.dispatch.on('elementMousemove', function(e) {
- stacked.clearHighlights();
- var singlePoint, pointIndex, pointXLocation, allData = [];
- data
- .filter(function(series, i) {
- series.seriesIndex = i;
- return !series.disabled;
- })
- .forEach(function(series,i) {
- pointIndex = nv.interactiveBisect(series.values, e.pointXValue, chart.x());
- stacked.highlightPoint(i, pointIndex, true);
- var point = series.values[pointIndex];
- if (typeof point === 'undefined') return;
- if (typeof singlePoint === 'undefined') singlePoint = point;
- if (typeof pointXLocation === 'undefined') pointXLocation = chart.xScale()(chart.x()(point,pointIndex));
-
- //If we are in 'expand' mode, use the stacked percent value instead of raw value.
- var tooltipValue = (stacked.style() == 'expand') ? point.display.y : chart.y()(point,pointIndex);
- allData.push({
- key: series.key,
- value: tooltipValue,
- color: color(series,series.seriesIndex),
- stackedValue: point.display
- });
- });
-
- allData.reverse();
-
- //Highlight the tooltip entry based on which stack the mouse is closest to.
- if (allData.length > 2) {
- var yValue = chart.yScale().invert(e.mouseY);
- var yDistMax = Infinity, indexToHighlight = null;
- allData.forEach(function(series,i) {
-
- //To handle situation where the stacked area chart is negative, we need to use absolute values
- //when checking if the mouse Y value is within the stack area.
- yValue = Math.abs(yValue);
- var stackedY0 = Math.abs(series.stackedValue.y0);
- var stackedY = Math.abs(series.stackedValue.y);
- if ( yValue >= stackedY0 && yValue <= (stackedY + stackedY0))
- {
- indexToHighlight = i;
- return;
- }
- });
- if (indexToHighlight != null)
- allData[indexToHighlight].highlight = true;
- }
-
- var xValue = xAxis.tickFormat()(chart.x()(singlePoint,pointIndex));
-
- //If we are in 'expand' mode, force the format to be a percentage.
- var valueFormatter = (stacked.style() == 'expand') ?
- function(d,i) {return d3.format(".1%")(d);} :
- function(d,i) {return yAxis.tickFormat()(d); };
- interactiveLayer.tooltip
- .position({left: pointXLocation + margin.left, top: e.mouseY + margin.top})
- .chartContainer(that.parentNode)
- .enabled(tooltips)
- .valueFormatter(valueFormatter)
- .data(
- {
- value: xValue,
- series: allData
- }
- )();
+ function chart(selection) {
+ renderWatch.reset();
+ selection.each(function(data) {
+ container = d3.select(this);
+ var availableWidth = nv.utils.availableWidth(width, container, margin);
+ var availableHeight = nv.utils.availableHeight(height, container, margin);
+ var radius = Math.min(availableWidth, availableHeight) / 2;
+ var path;
- interactiveLayer.renderGuideLine(pointXLocation);
+ nv.utils.initSVG(container);
- });
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('.nv-wrap.nv-sunburst').data(data);
+ var wrapEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sunburst nv-chart-' + id);
- interactiveLayer.dispatch.on("elementMouseout",function(e) {
- dispatch.tooltipHide();
- stacked.clearHighlights();
- });
+ var g = wrapEnter.selectAll('nv-sunburst');
+ wrap.attr('transform', 'translate(' + availableWidth / 2 + ',' + availableHeight / 2 + ')');
- dispatch.on('tooltipShow', function(e) {
- if (tooltips) showTooltip(e, that.parentNode);
- });
+ container.on('click', function (d, i) {
+ dispatch.chartClick({
+ data: d,
+ index: i,
+ pos: d3.event,
+ id: id
+ });
+ });
- // Update chart from a state object passed to event handler
- dispatch.on('changeState', function(e) {
+ y.range([0, radius]);
- if (typeof e.disabled !== 'undefined' && data.length === e.disabled.length) {
- data.forEach(function(series,i) {
- series.disabled = e.disabled[i];
- });
+ node = node || data;
+ rootNode = data[0];
+ partition.value(modes[mode] || modes["count"]);
+ path = g.data(partition.nodes).enter()
+ .append("path")
+ .attr("d", arc)
+ .style("fill", function (d) {
+ return color((d.children ? d : d.parent).name);
+ })
+ .style("stroke", "#FFF")
+ .on("click", function(d) {
+ if (prevNode !== node && node !== d) prevNode = node;
+ node = d;
+ path.transition()
+ .duration(duration)
+ .attrTween("d", arcTweenZoom(d));
+ })
+ .each(stash)
+ .on("dblclick", function(d) {
+ if (prevNode.parent == d) {
+ path.transition()
+ .duration(duration)
+ .attrTween("d", arcTweenZoom(rootNode));
+ }
+ })
+ .each(stash)
+ .on('mouseover', function(d,i){
+ d3.select(this).classed('hover', true).style('opacity', 0.8);
+ dispatch.elementMouseover({
+ data: d,
+ color: d3.select(this).style("fill")
+ });
+ })
+ .on('mouseout', function(d,i){
+ d3.select(this).classed('hover', false).style('opacity', 1);
+ dispatch.elementMouseout({
+ data: d
+ });
+ })
+ .on('mousemove', function(d,i){
+ dispatch.elementMousemove({
+ data: d
+ });
+ });
- state.disabled = e.disabled;
- }
- if (typeof e.style !== 'undefined') {
- stacked.style(e.style);
- }
- chart.update();
- });
+ // Setup for switching data: stash the old values for transition.
+ function stash(d) {
+ d.x0 = d.x;
+ d.dx0 = d.dx;
+ }
- });
+ // When switching data: interpolate the arcs in data space.
+ function arcTweenData(a, i) {
+ var oi = d3.interpolate({x: a.x0, dx: a.dx0}, a);
+ function tween(t) {
+ var b = oi(t);
+ a.x0 = b.x;
+ a.dx0 = b.dx;
+ return arc(b);
+ }
- return chart;
- }
+ if (i == 0) {
+ // If we are on the first arc, adjust the x domain to match the root node
+ // at the current zoom level. (We only need to do this once.)
+ var xd = d3.interpolate(x.domain(), [node.x, node.x + node.dx]);
+ return function (t) {
+ x.domain(xd(t));
+ return tween(t);
+ };
+ } else {
+ return tween;
+ }
+ }
+ // When zooming: interpolate the scales.
+ function arcTweenZoom(d) {
+ var xd = d3.interpolate(x.domain(), [d.x, d.x + d.dx]),
+ yd = d3.interpolate(y.domain(), [d.y, 1]),
+ yr = d3.interpolate(y.range(), [d.y ? 20 : 0, radius]);
+ return function (d, i) {
+ return i
+ ? function (t) {
+ return arc(d);
+ }
+ : function (t) {
+ x.domain(xd(t));
+ y.domain(yd(t)).range(yr(t));
+ return arc(d);
+ };
+ };
+ }
- //============================================================
- // Event Handling/Dispatching (out of chart's scope)
- //------------------------------------------------------------
+ });
- stacked.dispatch.on('tooltipShow', function(e) {
- //disable tooltips when value ~= 0
- //// TODO: consider removing points from voronoi that have 0 value instead of this hack
- /*
- if (!Math.round(stacked.y()(e.point) * 100)) { // 100 will not be good for very small numbers... will have to think about making this valu dynamic, based on data range
- setTimeout(function() { d3.selectAll('.point.hover').classed('hover', false) }, 0);
- return false;
+ renderWatch.renderEnd('sunburst immediate');
+ return chart;
}
- */
-
- e.pos = [e.pos[0] + margin.left, e.pos[1] + margin.top],
- dispatch.tooltipShow(e);
- });
-
- stacked.dispatch.on('tooltipHide', function(e) {
- dispatch.tooltipHide(e);
- });
- dispatch.on('tooltipHide', function() {
- if (tooltips) nv.tooltip.cleanup();
- });
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ chart.dispatch = dispatch;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ width: {get: function(){return width;}, set: function(_){width=_;}},
+ height: {get: function(){return height;}, set: function(_){height=_;}},
+ mode: {get: function(){return mode;}, set: function(_){mode=_;}},
+ id: {get: function(){return id;}, set: function(_){id=_;}},
+ duration: {get: function(){return duration;}, set: function(_){duration=_;}},
+
+ // options that require extra logic in the setter
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top != undefined ? _.top : margin.top;
+ margin.right = _.right != undefined ? _.right : margin.right;
+ margin.bottom = _.bottom != undefined ? _.bottom : margin.bottom;
+ margin.left = _.left != undefined ? _.left : margin.left;
+ }},
+ color: {get: function(){return color;}, set: function(_){
+ color=nv.utils.getColor(_);
+ }}
+ });
- //============================================================
+ nv.utils.initOptions(chart);
+ return chart;
+};
+nv.models.sunburstChart = function() {
+ "use strict";
+
+ //============================================================
+ // Public Variables with Default Settings
+ //------------------------------------------------------------
+
+ var sunburst = nv.models.sunburst();
+ var tooltip = nv.models.tooltip();
+
+ var margin = {top: 30, right: 20, bottom: 20, left: 20}
+ , width = null
+ , height = null
+ , color = nv.utils.defaultColor()
+ , id = Math.round(Math.random() * 100000)
+ , defaultState = null
+ , noData = null
+ , duration = 250
+ , dispatch = d3.dispatch('stateChange', 'changeState','renderEnd')
+ ;
+ tooltip.duration(0);
- //============================================================
- // Expose Public Variables
- //------------------------------------------------------------
+ //============================================================
+ // Private Variables
+ //------------------------------------------------------------
- // expose chart's sub-components
- chart.dispatch = dispatch;
- chart.stacked = stacked;
- chart.legend = legend;
- chart.controls = controls;
- chart.xAxis = xAxis;
- chart.yAxis = yAxis;
- chart.interactiveLayer = interactiveLayer;
+ var renderWatch = nv.utils.renderWatch(dispatch);
+ tooltip
+ .headerEnabled(false)
+ .valueFormatter(function(d, i) {
+ return d;
+ });
- d3.rebind(chart, stacked, 'x', 'y', 'size', 'xScale', 'yScale', 'xDomain', 'yDomain', 'xRange', 'yRange', 'sizeDomain', 'interactive', 'useVoronoi', 'offset', 'order', 'style', 'clipEdge', 'forceX', 'forceY', 'forceSize', 'interpolate');
+ //============================================================
+ // Chart function
+ //------------------------------------------------------------
- chart.options = nv.utils.optionsFunc.bind(chart);
+ function chart(selection) {
+ renderWatch.reset();
+ renderWatch.models(sunburst);
- chart.margin = function(_) {
- if (!arguments.length) return margin;
- margin.top = typeof _.top != 'undefined' ? _.top : margin.top;
- margin.right = typeof _.right != 'undefined' ? _.right : margin.right;
- margin.bottom = typeof _.bottom != 'undefined' ? _.bottom : margin.bottom;
- margin.left = typeof _.left != 'undefined' ? _.left : margin.left;
- return chart;
- };
+ selection.each(function(data) {
+ var container = d3.select(this);
+ nv.utils.initSVG(container);
- chart.width = function(_) {
- if (!arguments.length) return width;
- width = _;
- return chart;
- };
+ var that = this;
+ var availableWidth = nv.utils.availableWidth(width, container, margin),
+ availableHeight = nv.utils.availableHeight(height, container, margin);
- chart.height = function(_) {
- if (!arguments.length) return height;
- height = _;
- return chart;
- };
+ chart.update = function() {
+ if (duration === 0)
+ container.call(chart);
+ else
+ container.transition().duration(duration).call(chart)
+ };
+ chart.container = this;
+
+ // Display No Data message if there's nothing to show.
+ if (!data || !data.length) {
+ nv.utils.noData(chart, container);
+ return chart;
+ } else {
+ container.selectAll('.nv-noData').remove();
+ }
- chart.color = function(_) {
- if (!arguments.length) return color;
- color = nv.utils.getColor(_);
- legend.color(color);
- stacked.color(color);
- return chart;
- };
+ // Setup containers and skeleton of chart
+ var wrap = container.selectAll('g.nv-wrap.nv-sunburstChart').data(data);
+ var gEnter = wrap.enter().append('g').attr('class', 'nvd3 nv-wrap nv-sunburstChart').append('g');
+ var g = wrap.select('g');
- chart.showControls = function(_) {
- if (!arguments.length) return showControls;
- showControls = _;
- return chart;
- };
+ gEnter.append('g').attr('class', 'nv-sunburstWrap');
- chart.showLegend = function(_) {
- if (!arguments.length) return showLegend;
- showLegend = _;
- return chart;
- };
+ wrap.attr('transform', 'translate(' + margin.left + ',' + margin.top + ')');
- chart.showXAxis = function(_) {
- if (!arguments.length) return showXAxis;
- showXAxis = _;
- return chart;
- };
+ // Main Chart Component(s)
+ sunburst.width(availableWidth).height(availableHeight);
+ var sunWrap = g.select('.nv-sunburstWrap').datum(data);
+ d3.transition(sunWrap).call(sunburst);
- chart.showYAxis = function(_) {
- if (!arguments.length) return showYAxis;
- showYAxis = _;
- return chart;
- };
+ });
- chart.rightAlignYAxis = function(_) {
- if(!arguments.length) return rightAlignYAxis;
- rightAlignYAxis = _;
- yAxis.orient( (_) ? 'right' : 'left');
- return chart;
- };
-
- chart.useInteractiveGuideline = function(_) {
- if(!arguments.length) return useInteractiveGuideline;
- useInteractiveGuideline = _;
- if (_ === true) {
- chart.interactive(false);
- chart.useVoronoi(false);
+ renderWatch.renderEnd('sunburstChart immediate');
+ return chart;
}
- return chart;
- };
-
- chart.tooltip = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
-
- chart.tooltips = function(_) {
- if (!arguments.length) return tooltips;
- tooltips = _;
- return chart;
- };
-
- chart.tooltipContent = function(_) {
- if (!arguments.length) return tooltip;
- tooltip = _;
- return chart;
- };
- chart.state = function(_) {
- if (!arguments.length) return state;
- state = _;
- return chart;
- };
+ //============================================================
+ // Event Handling/Dispatching (out of chart's scope)
+ //------------------------------------------------------------
- chart.defaultState = function(_) {
- if (!arguments.length) return defaultState;
- defaultState = _;
- return chart;
- };
-
- chart.noData = function(_) {
- if (!arguments.length) return noData;
- noData = _;
- return chart;
- };
+ sunburst.dispatch.on('elementMouseover.tooltip', function(evt) {
+ evt['series'] = {
+ key: evt.data.name,
+ value: evt.data.size,
+ color: evt.color
+ };
+ tooltip.data(evt).hidden(false);
+ });
- chart.transitionDuration = function(_) {
- if (!arguments.length) return transitionDuration;
- transitionDuration = _;
- return chart;
- };
+ sunburst.dispatch.on('elementMouseout.tooltip', function(evt) {
+ tooltip.hidden(true);
+ });
- chart.controlsData = function(_) {
- if (!arguments.length) return cData;
- cData = _;
- return chart;
- };
+ sunburst.dispatch.on('elementMousemove.tooltip', function(evt) {
+ tooltip();
+ });
- chart.controlLabels = function(_) {
- if (!arguments.length) return controlLabels;
- if (typeof _ !== 'object') return controlLabels;
- controlLabels = _;
+ //============================================================
+ // Expose Public Variables
+ //------------------------------------------------------------
+
+ // expose chart's sub-components
+ chart.dispatch = dispatch;
+ chart.sunburst = sunburst;
+ chart.tooltip = tooltip;
+ chart.options = nv.utils.optionsFunc.bind(chart);
+
+ // use Object get/set functionality to map between vars and chart functions
+ chart._options = Object.create({}, {
+ // simple options, just get/set the necessary values
+ noData: {get: function(){return noData;}, set: function(_){noData=_;}},
+ defaultState: {get: function(){return defaultState;}, set: function(_){defaultState=_;}},
+
+ // options that require extra logic in the setter
+ color: {get: function(){return color;}, set: function(_){
+ color = _;
+ sunburst.color(color);
+ }},
+ duration: {get: function(){return duration;}, set: function(_){
+ duration = _;
+ renderWatch.reset(duration);
+ sunburst.duration(duration);
+ }},
+ margin: {get: function(){return margin;}, set: function(_){
+ margin.top = _.top !== undefined ? _.top : margin.top;
+ margin.right = _.right !== undefined ? _.right : margin.right;
+ margin.bottom = _.bottom !== undefined ? _.bottom : margin.bottom;
+ margin.left = _.left !== undefined ? _.left : margin.left;
+ }}
+ });
+ nv.utils.inheritOptions(chart, sunburst);
+ nv.utils.initOptions(chart);
return chart;
- };
-
- yAxis.setTickFormat = yAxis.tickFormat;
-
- yAxis.tickFormat = function(_) {
- if (!arguments.length) return yAxisTickFormat;
- yAxisTickFormat = _;
- return yAxis;
- };
-
-
- //============================================================
+};
- return chart;
-}
-})();
+nv.version = "1.8.1-dev";
+})(); \ No newline at end of file
diff --git a/addons/web/static/src/js/framework/data.js b/addons/web/static/src/js/framework/data.js
index 6aee8f06391..8dd34cd4b93 100644
--- a/addons/web/static/src/js/framework/data.js
+++ b/addons/web/static/src/js/framework/data.js
@@ -812,7 +812,7 @@ var BufferedDataSet = DataSetStatic.extend({
_.each(ids, function (id) {
self.get_cache(id).to_delete = true;
});
- this.set_ids(_.without(this.ids, _.pluck(_.filter(this.cache, function (c) {return c.to_delete;}), 'id')));
+ this.set_ids(_.difference(this.ids, _.pluck(_.filter(this.cache, function (c) {return c.to_delete;}), 'id')));
this.trigger("dataset_changed", ids, callback, error_callback);
return $.async_when({result: true}).done(callback);
},
diff --git a/addons/web/static/src/js/views/form_widgets.js b/addons/web/static/src/js/views/form_widgets.js
index 53e49c4d905..c27c5982cbb 100644
--- a/addons/web/static/src/js/views/form_widgets.js
+++ b/addons/web/static/src/js/views/form_widgets.js
@@ -780,7 +780,7 @@ var FieldBarChart = common.AbstractField.extend({
.margin({top: 0, right: 0, bottom: 0, left: 0})
.tooltips(false)
.showValues(false)
- .transitionDuration(350)
+ .transition(350)
.showXAxis(false)
.showYAxis(false);
diff --git a/addons/web/static/src/js/views/graph_widget.js b/addons/web/static/src/js/views/graph_widget.js
index aaeb8404f94..989db33c289 100644
--- a/addons/web/static/src/js/views/graph_widget.js
+++ b/addons/web/static/src/js/views/graph_widget.js
@@ -158,7 +158,7 @@ return Widget.extend({
var chart = nv.models.multiBarChart();
chart.options({
delay: 250,
- transitionDuration: 10,
+ transition: 10,
showLegend: true,
showXAxis: true,
showYAxis: true,
@@ -212,7 +212,7 @@ return Widget.extend({
var chart = nv.models.pieChart();
chart.options({
delay: 250,
- transitionDuration: 100,
+ transition: 100,
color: d3.scale.category10().range(),
});
diff --git a/addons/web/static/src/js/widgets/progress_bar.js b/addons/web/static/src/js/widgets/progress_bar.js
index abe1009b1fa..6ccd1e74f28 100644
--- a/addons/web/static/src/js/widgets/progress_bar.js
+++ b/addons/web/static/src/js/widgets/progress_bar.js
@@ -72,6 +72,9 @@ var ProgressBar = Widget.extend({
on_change_input: function(e) {
var $input = $(e.target);
+ if(e.type === 'change' && !$input.is(':focus')) {
+ return;
+ }
if(isNaN($input.val())) {
this.do_warn(_t("Wrong value entered!"), _t("Only Integer Value should be valid."));
} else {
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 67f14dba8dd..82197ef6efe 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -216,8 +216,13 @@
<t t-raw="0"/>
</div>
<div class="btn-group btn-group-sm oe-pager-buttons" style="display: inline-block">
- <a class="fa fa-chevron-left btn btn-default oe-pager-button" accesskey="O" type="button" data-pager-action="previous"></a>
- <a class="fa fa-chevron-right btn btn-default oe-pager-button" accesskey="P" type="button" data-pager-action="next"></a>
+ <!-- accesskeys not wanted in X2Many widgets -->
+ <t t-if="!widget.x2m">
+ <t t-set="att_prev" t-value="{'accesskey': 'O'}" />
+ <t t-set="att_next" t-value="{'accesskey': 'P'}" />
+ </t>
+ <a class="fa fa-chevron-left btn btn-default oe-pager-button" t-att="att_prev" type="button" data-pager-action="previous"></a>
+ <a class="fa fa-chevron-right btn btn-default oe-pager-button" t-att="att_next" type="button" data-pager-action="next"></a>
</div>
</span>
@@ -361,7 +366,7 @@
<t t-name="ListView.buttons">
<t t-if="!widget.no_leaf and widget.options.action_buttons !== false and widget.options.addable and widget.is_action_enabled('create')">
<div class="oe_list_buttons">
- <button type="button" class="btn btn-sm btn-primary o_list_button_add">
+ <button type="button" class="btn btn-sm btn-primary o_list_button_add" accesskey="C">
<t t-esc="widget.options.addable"/>
</button>
</div>
@@ -402,10 +407,10 @@
</tr>
<t t-extend="ListView.buttons">
<t t-jquery="button.o_list_button_add" t-operation="after">
- <button type="button" class="btn btn-primary btn-sm o_list_button_save">
+ <button type="button" class="btn btn-primary btn-sm o_list_button_save" accesskey="S">
Save
</button>
- <button type="button" class="btn btn-default btn-sm o_list_button_discard">
+ <button type="button" class="btn btn-default btn-sm o_list_button_discard" accesskey="D">
Discard
</button>
</t>
@@ -1425,8 +1430,13 @@
<div t-name="Pager">
<span class="o_pager_value"></span> / <span class="o_pager_limit"></span>
<span class="btn-group btn-group-sm">
- <button type="button" class="fa fa-chevron-left btn btn-icon o_pager_previous" accesskey="O"/>
- <button type="button" class="fa fa-chevron-right btn btn-icon o_pager_next" accesskey="P"/>
+ <!-- accesskeys not wanted in X2Many widgets -->
+ <t t-if="!widget.getParent().x2m">
+ <t t-set="att_prev" t-value="{'accesskey': 'O'}" />
+ <t t-set="att_next" t-value="{'accesskey': 'P'}" />
+ </t>
+ <button type="button" class="fa fa-chevron-left btn btn-icon o_pager_previous" t-att="att_prev"/>
+ <button type="button" class="fa fa-chevron-right btn btn-icon o_pager_next" t-att="att_next"/>
</span>
</div>
diff --git a/addons/web_editor/static/src/js/snippets.editor.js b/addons/web_editor/static/src/js/snippets.editor.js
index 37f80a95da4..79db510bf6a 100644
--- a/addons/web_editor/static/src/js/snippets.editor.js
+++ b/addons/web_editor/static/src/js/snippets.editor.js
@@ -248,8 +248,7 @@ var BuildingBlock = Widget.extend({
});
$styles.addClass("hidden");
- globalSelector = {
- closest: function ($from) {
+ globalSelector.closest = function ($from) {
var $temp;
var $target;
var len = selector.length;
@@ -260,8 +259,8 @@ var BuildingBlock = Widget.extend({
}
}
return $target;
- },
- all: function ($from) {
+ };
+ globalSelector.all = function ($from) {
var $target;
var len = selector.length;
for (var i = 0; i<len; i++) {
@@ -269,8 +268,8 @@ var BuildingBlock = Widget.extend({
else $target = $target.add(selector[i].all($from));
}
return $target;
- },
- is: function ($from) {
+ };
+ globalSelector.is = function ($from) {
var len = selector.length;
for (var i = 0; i<len; i++) {
if (selector[i].is($from)) {
@@ -278,7 +277,6 @@ var BuildingBlock = Widget.extend({
}
}
return false;
- },
};
var number = 0;
@@ -318,11 +316,11 @@ var BuildingBlock = Widget.extend({
$("body").toggleClass("editor_has_snippets", !!number);
// select all default text to edit (if snippet default text)
- /*self.$snippets.find('.oe_snippet_body, .oe_snippet_body *')
+ self.$snippets.find('.oe_snippet_body, .oe_snippet_body *')
.contents()
.filter(function() {
return this.nodeType === 3 && this.textContent.match(/\S/);
- }).parent().addClass("o_default_snippet_text");*/
+ }).parent().addClass("o_default_snippet_text");
$(document).on("mouseup", ".o_default_snippet_text", function (event) {
$(event.target).selectContent();
});
@@ -1149,8 +1147,9 @@ var Editor = Class.extend({
});
var data = {
- 'Class': BuildingBlock,
- 'globalSelector': globalSelector,
+ Class: BuildingBlock,
+ Editor: Editor,
+ globalSelector: globalSelector,
};
return data;
diff --git a/addons/web_editor/static/src/js/summernote.js b/addons/web_editor/static/src/js/summernote.js
index 6cec7ff18bd..ab170a45935 100644
--- a/addons/web_editor/static/src/js/summernote.js
+++ b/addons/web_editor/static/src/js/summernote.js
@@ -814,17 +814,6 @@ range.WrappedRange.prototype.reRange = function (keep_end, isNotBreakable) {
return new range.WrappedRange(sc, so, ec, eo);
};
-range.WrappedRange.prototype.deleteContents = function (towrite) {
- var prevBP = dom.removeBetween(this.sc, this.so, this.ec, this.eo, towrite);
-
- $(dom.node(prevBP.sc)).trigger("click"); // trigger click to disable and reanable editor and image handler
- return new range.WrappedRange(
- prevBP.sc,
- prevBP.so,
- prevBP.ec,
- prevBP.eo
- );
-};
// isOnImg: judge whether range is an image node or not
range.WrappedRange.prototype.isOnImg = function () {
var nb = 0;
@@ -1242,10 +1231,13 @@ $.summernote.pluginEvents.delete = function (event, editor, layoutInfo) {
if (!r.isCollapsed()) {
if (dom.isCell(dom.node(r.sc)) || dom.isCell(dom.node(r.ec))) {
remove_table_content(r);
- return range.create(r.ec, 0).select();
+ range.create(r.ec, 0).select();
+ } else {
+ r = r.deleteContents();
+ r.select();
}
- r = r.deleteContents();
- r.select();
+ event.preventDefault();
+ return false;
}
var target = r.ec;
@@ -1378,10 +1370,13 @@ $.summernote.pluginEvents.backspace = function (event, editor, layoutInfo) {
if (!r.isCollapsed()) {
if (dom.isCell(dom.node(r.sc)) || dom.isCell(dom.node(r.ec))) {
remove_table_content(r);
- return range.create(r.sc, dom.nodeLength(r.sc)).select();
+ range.create(r.sc, dom.nodeLength(r.sc)).select();
+ } else {
+ r = r.deleteContents();
+ r.select();
}
- r = r.deleteContents();
- r.select();
+ event.preventDefault();
+ return false;
}
var target = r.sc;
diff --git a/addons/web_editor/static/src/js/tour.rte.js b/addons/web_editor/static/src/js/tour.rte.js
index 6dcd5009d88..5205e60eef8 100644
--- a/addons/web_editor/static/src/js/tour.rte.js
+++ b/addons/web_editor/static/src/js/tour.rte.js
@@ -132,7 +132,7 @@ Tour.register({
},
{
waitFor: '#editable_area > section .row > div:first:has( font:last:containsExact(Bat) )',
- element: '.note-air-popover button[data-event="undo"]',
+ element: '.note-image-popover button[data-event="undo"]',
title: "undo",
},
{
diff --git a/addons/web_editor/static/src/js/widgets.js b/addons/web_editor/static/src/js/widgets.js
index 71bd31eaaca..7508ce1c392 100644
--- a/addons/web_editor/static/src/js/widgets.js
+++ b/addons/web_editor/static/src/js/widgets.js
@@ -285,6 +285,9 @@ var ImageDialog = Widget.extend({
o.id = +o.url.match(/\/web\/content\/([0-9]*)/, '')[1];
}
this.parent.$(".pager > li").click(function (e) {
+ if(!self.$el.is(':visible')) {
+ return;
+ }
e.preventDefault();
var $target = $(e.currentTarget);
if ($target.hasClass('disabled')) {
@@ -303,7 +306,6 @@ var ImageDialog = Widget.extend({
var img = _.select(this.images, function (v) { return v.id == attachment.id;});
if (img.length) {
this.images.splice(this.images.indexOf(img[0]),1);
- return;
}
} else {
this.images = [];
@@ -421,11 +423,11 @@ var ImageDialog = Widget.extend({
var $button = this.$('button.filepicker');
if (!error) {
$button.addClass('btn-success');
+ this.set_image(attachment);
} else {
this.$('form').addClass('has-error')
.find('.help-block').text(error);
$button.addClass('btn-danger');
- this.set_image(attachment, error);
}
if (!this.options.select_images) {
diff --git a/addons/web_editor/static/src/less/web_editor.less b/addons/web_editor/static/src/less/web_editor.less
index 8cc69271afa..760108b9e61 100644
--- a/addons/web_editor/static/src/less/web_editor.less
+++ b/addons/web_editor/static/src/less/web_editor.less
@@ -24,10 +24,10 @@
// Generate all margins for one size, given
// the name of the margin and intended size
.o-margins-define(@name, @size: @name) {
- .mt@{name} {margin-top: ~"@{size}px";}
- .mb@{name} {margin-bottom: ~"@{size}px";}
- .ml@{name} {margin-left: ~"@{size}px";}
- .mr@{name} {margin-right: ~"@{size}px";}
+ .mt@{name} {margin-top: ~"@{size}px"!important;}
+ .mb@{name} {margin-bottom: ~"@{size}px"!important;}
+ .ml@{name} {margin-left: ~"@{size}px"!important;}
+ .mr@{name} {margin-right: ~"@{size}px"!important;}
}
// Generate all margins
diff --git a/addons/web_kanban/static/src/xml/web_kanban.xml b/addons/web_kanban/static/src/xml/web_kanban.xml
index 07663caa85b..abca23cfec0 100644
--- a/addons/web_kanban/static/src/xml/web_kanban.xml
+++ b/addons/web_kanban/static/src/xml/web_kanban.xml
@@ -3,7 +3,7 @@
<t t-name="KanbanView.buttons">
<t t-if="display">
<div>
- <button type="button" class="btn btn-primary btn-sm o-kanban-button-new">
+ <button type="button" class="btn btn-primary btn-sm o-kanban-button-new" accesskey="C">
<t t-esc="widget.options.create_text || _t('Create')"/>
</button>
</div>
diff --git a/addons/website/controllers/main.py b/addons/website/controllers/main.py
index 6a9005fe42f..a501b7be8b7 100644
--- a/addons/website/controllers/main.py
+++ b/addons/website/controllers/main.py
@@ -12,8 +12,8 @@ import urllib2
import werkzeug.wrappers
import openerp
-from openerp.addons.web.controllers.main import WebClient
-from openerp.addons.web_editor.controllers.main import Web_Editor
+from openerp.addons.base.ir.ir_qweb import AssetsBundle
+from openerp.addons.web.controllers.main import WebClient, Binary
from openerp.addons.web import http
from openerp.http import request
@@ -303,7 +303,7 @@ class Website(openerp.addons.web.controllers.main.Home):
return [enable, disable]
@http.route(['/website/theme_customize'], type='json', auth="public", website=True)
- def theme_customize(self, enable, disable):
+ def theme_customize(self, enable, disable, get_bundle=False):
""" enable or Disable lists of ``xml_id`` of the inherit templates
"""
cr, uid, context, pool = request.cr, request.uid, request.context, request.registry
@@ -317,6 +317,10 @@ class Website(openerp.addons.web.controllers.main.Home):
set_active(disable, False)
set_active(enable, True)
+ if get_bundle:
+ bundle = AssetsBundle('website.assets_frontend', cr=http.request.cr, uid=http.request.uid, context={}, registry=http.request.registry)
+ return bundle.to_html()
+
return True
@http.route(['/website/theme_customize_reload'], type='http', auth="public", website=True)
@@ -369,3 +373,29 @@ class Website(openerp.addons.web.controllers.main.Home):
if res:
return res
return request.redirect('/')
+
+
+#------------------------------------------------------
+# Retrocompatibility routes
+#------------------------------------------------------
+class WebsiteBinary(openerp.http.Controller):
+ @http.route([
+ '/website/image',
+ '/website/image/<xmlid>',
+ '/website/image/<xmlid>/<int:width>x<int:height>',
+ '/website/image/<xmlid>/<field>',
+ '/website/image/<xmlid>/<field>/<int:width>x<int:height>',
+ '/website/image/<model>/<id>/<field>',
+ '/website/image/<model>/<id>/<field>/<int:width>x<int:height>'
+ ], type='http', auth="public", website=False, multilang=False)
+ def content_image(self, id=None, max_width=0, max_height=0, **kw):
+ if max_width:
+ kw['width'] = max_width
+ if max_height:
+ kw['height'] = max_height
+ if id:
+ id, _, unique = id.partition('_')
+ kw['id'] = int(id)
+ if unique:
+ kw['unique'] = unique
+ return Binary().content_image(**kw)
diff --git a/addons/website/models/website.py b/addons/website/models/website.py
index 1f24bbdf559..dfec85cb3e5 100644
--- a/addons/website/models/website.py
+++ b/addons/website/models/website.py
@@ -125,6 +125,8 @@ DEFAULT_CDN_FILTERS = [
"^/web/(css|js)/",
"^/web/image",
"^/web/content",
+ # retrocompatibility
+ "^/website/image/",
]
def unslug(s):
diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css
index 7551c531b67..4d946d1b7fa 100644
--- a/addons/website/static/src/css/editor.css
+++ b/addons/website/static/src/css/editor.css
@@ -589,7 +589,7 @@ ul.oe_menu_editor .disclose {
}
#theme_customize_modal {
- overflow: visible;
+ overflow: auto;
z-index: 1020;
background: transparent;
display: block;
@@ -655,11 +655,3 @@ ul.oe_menu_editor .disclose {
position: absolute;
z-index: 1;
}
-
-/* ---- force the browse to re-compute the stylesheets ---- */
-body.theme_customize_css_loading {
- magin-top: 1px;
-}
-body.theme_customize_css_loading #wrapwrap {
- magin-top: -1px;
-}
diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass
index df617c7aa24..e4bc4631ad7 100644
--- a/addons/website/static/src/css/editor.sass
+++ b/addons/website/static/src/css/editor.sass
@@ -508,7 +508,7 @@ $infobar_height: 20px
#theme_error
background: #ffc
#theme_customize_modal
- overflow: visible
+ overflow: auto
z-index: 1020
background: transparent
display: block
@@ -565,11 +565,3 @@ $infobar_height: 20px
opacity: 0.3
position: absolute
z-index: 1
-
-/* ---- force the browse to re-compute the stylesheets ---- */
-body.theme_customize_css_loading
- magin-top: 1px
- #wrapwrap
- magin-top: -1px
-
-// }}}
diff --git a/addons/website/static/src/css/website.editor.css b/addons/website/static/src/css/website.editor.css
index 69e6e451d6b..f1436929da1 100644
--- a/addons/website/static/src/css/website.editor.css
+++ b/addons/website/static/src/css/website.editor.css
@@ -187,7 +187,7 @@
}
#theme_customize_modal {
- overflow: visible;
+ overflow: auto;
z-index: 1020;
background: transparent;
display: block;
@@ -253,11 +253,3 @@
position: absolute;
z-index: 1;
}
-
-/* ---- force the browse to re-compute the stylesheets ---- */
-body.theme_customize_css_loading {
- magin-top: 1px;
-}
-body.theme_customize_css_loading #wrapwrap {
- magin-top: -1px;
-}
diff --git a/addons/website/static/src/css/website.editor.sass b/addons/website/static/src/css/website.editor.sass
index 911631bb8ee..b7d2d28edda 100644
--- a/addons/website/static/src/css/website.editor.sass
+++ b/addons/website/static/src/css/website.editor.sass
@@ -167,7 +167,7 @@ $infobar_height: 20px
#theme_error
background: #ffc
#theme_customize_modal
- overflow: visible
+ overflow: auto
z-index: 1020
background: transparent
display: block
@@ -224,11 +224,3 @@ $infobar_height: 20px
opacity: 0.3
position: absolute
z-index: 1
-
-/* ---- force the browse to re-compute the stylesheets ---- */
-body.theme_customize_css_loading
- magin-top: 1px
- #wrapwrap
- magin-top: -1px
-
-// }}}
diff --git a/addons/website/static/src/js/website.snippets.gallery.js b/addons/website/static/src/js/website.snippets.gallery.js
index fd6005456e2..a729b8a0c81 100644
--- a/addons/website/static/src/js/website.snippets.gallery.js
+++ b/addons/website/static/src/js/website.snippets.gallery.js
@@ -232,7 +232,7 @@ options.registry.gallery = options.Class.extend({
editor.on('saved', this, function (attachments) {
for (var i = 0 ; i < attachments.length; i++) {
var img = $('<img class="img img-responsive mb8 mt8"/>')
- .attr("src", attachments[i].url)
+ .attr("src", attachments[i].src)
.attr('data-index', index+i)
.data('index', index+i)
.appendTo($container);
diff --git a/addons/website/static/src/js/website.theme.js b/addons/website/static/src/js/website.theme.js
index f31ce42941e..394c8afe843 100644
--- a/addons/website/static/src/js/website.theme.js
+++ b/addons/website/static/src/js/website.theme.js
@@ -3,6 +3,7 @@ odoo.define('website.theme', function (require) {
var ajax = require('web.ajax');
var core = require('web.core');
+var session = require('web.session');
var Widget = require('web.Widget');
var base = require('web_editor.base');
var website = require('website.website');
@@ -121,57 +122,41 @@ var Theme = Widget.extend({
});
return xml_ids;
},
- compute_stylesheets: function () {
- var self = this;
- self.has_error = false;
- $('link[href*=".assets_"]').attr('data-loading', true);
- function theme_customize_css_onload() {
- if ($('link[data-loading]').size()) {
- $('body').toggleClass('theme_customize_css_loading');
- setTimeout(theme_customize_css_onload, 50);
- } else {
- $('body').removeClass('theme_customize_css_loading');
- self.$el.removeClass("loading");
-
- if (window.getComputedStyle($('button[data-toggle="collapse"]:first')[0]).getPropertyValue('position') === 'static' ||
- window.getComputedStyle($('#theme_customize_modal')[0]).getPropertyValue('display') === 'none') {
- if (self.has_error) {
- window.location.hash = "theme=true";
- window.location.reload();
- } else {
- self.has_error = true;
- $('link[href*=".assets_"][data-error]').removeAttr('data-error').attr('data-loading', true);
- self.update_stylesheets();
- setTimeout(theme_customize_css_onload, 50);
- }
- }
- }
- }
- theme_customize_css_onload();
- },
- update_stylesheets: function () {
- $('link[href*=".assets_"]').each(function update () {
- var $style = $(this);
- var href = $style.attr("href").replace(/[^\/]+$/, new Date().getTime());
- var $asset = $('<link rel="stylesheet" href="'+href+'"/>');
- $asset.attr("onload", "$(this).prev().attr('disable', true).remove(); $(this).removeAttr('onload').removeAttr('onerror');");
- $asset.attr("onerror", "$(this).prev().removeAttr('data-loading').attr('data-error','loading'); $(this).attr('disable', true).remove();");
- $style.after($asset);
- });
- },
update_style: function (enable, disable, reload) {
- var self = this;
- if (this.$el.hasClass("loading")) return;
- this.$el.addClass("loading");
+ if (this.$el.hasClass("loading")) {
+ return;
+ }
+ this.$el.addClass('loading');
- if (!reload && $('link[href*=".assets_"]').size()) {
- this.compute_stylesheets();
+ if (!reload && !session.debug) {
+ var self = this;
return ajax.jsonRpc('/website/theme_customize', 'call', {
- 'enable': enable,
- 'disable': disable
- }).then(function () {
- self.update_stylesheets();
+ enable: enable,
+ disable: disable,
+ get_bundle: true,
+ }).then(function (bundleHTML) {
+ var $links = $('link[href*=".assets_frontend"]');
+ var $newLinks = $(bundleHTML).filter('link');
+
+ var linksLoaded = $.Deferred();
+ var nbLoaded = 0;
+ $newLinks.on('load', function (e) {
+ if (++nbLoaded >= $newLinks.length) {
+ linksLoaded.resolve();
+ }
+ });
+ $newLinks.on('error', function (e) {
+ linksLoaded.reject();
+ window.location.hash = "theme=true";
+ window.location.reload();
});
+
+ $links.last().after($newLinks);
+ return linksLoaded.then(function () {
+ $links.remove();
+ self.$el.removeClass('loading');
+ });
+ });
} else {
var href = '/website/theme_customize_reload'+
'?href='+encodeURIComponent(window.location.href)+
@@ -325,4 +310,6 @@ website.TopBar.include({
}
});
+return Theme;
+
});
diff --git a/addons/website_forum/models/forum.py b/addons/website_forum/models/forum.py
index 49ae38704ba..0a32498b8ba 100644
--- a/addons/website_forum/models/forum.py
+++ b/addons/website_forum/models/forum.py
@@ -827,7 +827,7 @@ class Tags(models.Model):
posts_count = fields.Integer('Number of Posts', compute='_get_posts_count', store=True)
_sql_constraints = [
- ('name_uniq', 'unique (name)', "Tag name already exists !"),
+ ('name_uniq', 'unique (name, forum_id)', "Tag name already exists !"),
]
@api.multi
diff --git a/addons/website_links/static/src/js/website_links_charts.js b/addons/website_links/static/src/js/website_links_charts.js
index e73b625dadc..8011fa9ec2a 100644
--- a/addons/website_links/static/src/js/website_links_charts.js
+++ b/addons/website_links/static/src/js/website_links_charts.js
@@ -60,7 +60,7 @@ if(!$('.o_website_links_chart').length) {
.x(function(d) { return getDate(d); })
.y(function(d) { return getNbClicks(d); })
.tooltips(true)
- .transitionDuration(0)
+ .transition(0)
.showYAxis(true)
.showXAxis(true);
diff --git a/addons/website_membership/controllers/main.py b/addons/website_membership/controllers/main.py
index ebd38f94139..7fc325bdbbb 100644
--- a/addons/website_membership/controllers/main.py
+++ b/addons/website_membership/controllers/main.py
@@ -37,16 +37,16 @@ class WebsiteMembership(http.Controller):
partner_obj = request.registry['res.partner']
post_name = post.get('search') or post.get('name', '')
current_country = None
+ today = time.strftime(DEFAULT_SERVER_DATE_FORMAT)
# base domain for groupby / searches
- base_line_domain = [("partner.website_published", "=", True), ('state', 'in', ['free', 'paid'])]
+ base_line_domain = [
+ ("partner.website_published", "=", True), ('state', '=', 'paid'),
+ ('date_to', '>=', today), ('date_from', '<=', today)
+ ]
if membership_id and membership_id != 'free':
membership_id = int(membership_id)
- today = time.strftime(DEFAULT_SERVER_DATE_FORMAT)
- base_line_domain += [
- ('membership_id', '=', membership_id), ('date_to', '>=', today),
- ('date_from', '<=', today), ('state', '=', 'paid')
- ]
+ base_line_domain.append(('membership_id', '=', membership_id))
membership = product_obj.browse(cr, uid, membership_id, context=context)
else:
membership = None
@@ -58,12 +58,14 @@ class WebsiteMembership(http.Controller):
if membership_id != 'free':
membership_line_ids = membership_line_obj.search(cr, SUPERUSER_ID, base_line_domain, context=context)
country_domain = [('member_lines', 'in', membership_line_ids)]
+ if not membership_id:
+ country_domain = ['|', country_domain[0], ('membership_state', '=', 'free')]
else:
membership_line_ids = []
country_domain = [('membership_state', '=', 'free')]
- if post_name:
- country_domain += ['|', ('name', 'ilike', post_name),
- ('website_description', 'ilike', post_name)]
+ if post_name:
+ country_domain += ['|', ('name', 'ilike', post_name),
+ ('website_description', 'ilike', post_name)]
countries = partner_obj.read_group(
cr, SUPERUSER_ID, country_domain + [("website_published", "=", True)], ["id", "country_id"],
groupby="country_id", orderby="country_id", context=request.context)
diff --git a/addons/website_payment/views/website_payment_templates.xml b/addons/website_payment/views/website_payment_templates.xml
index 9eb3bafa872..0395b6ccfaf 100644
--- a/addons/website_payment/views/website_payment_templates.xml
+++ b/addons/website_payment/views/website_payment_templates.xml
@@ -36,8 +36,8 @@
</div>
</div>
<h1>Payment Methods</h1>
- <h4>Add a new payment method:</h4>
- <div class="row">
+ <h4 t-if="acquirers">Add a new payment method:</h4>
+ <div t-if="acquirers" class="row">
<div class="col-md-6">
<div t-if="error_message" class="alert alert-danger">
<t t-foreach="error_message" t-as="err"><t t-esc="err"/><br /></t>
diff --git a/addons/website_quote/controllers/main.py b/addons/website_quote/controllers/main.py
index c3cbe74c74c..2a282855813 100644
--- a/addons/website_quote/controllers/main.py
+++ b/addons/website_quote/controllers/main.py
@@ -77,7 +77,7 @@ class sale_quote(http.Controller):
context=render_ctx)
return request.website.render('website_quote.so_quotation', values)
- @http.route(['/quote/accept/<int:order_id>'], type='http', auth="public", website=True, methods=['POST'])
+ @http.route(['/quote/accept'], type='json', auth="public", website=True)
def accept(self, order_id, token=None, signer=None, sign=None, **post):
order_obj = request.registry.get('sale.order')
order = order_obj.browse(request.cr, SUPERUSER_ID, order_id)
@@ -85,6 +85,8 @@ class sale_quote(http.Controller):
return request.website.render('website.404')
if order.require_payment:
return request.website.render('website.404')
+ if order.state != 'sent':
+ return False
attachments=sign and [('signature.png', sign.decode('base64'))] or []
order_obj.action_confirm(request.cr, SUPERUSER_ID, [order_id], context=request.context)
message = _('Order signed by %s') % (signer,)
@@ -97,6 +99,8 @@ class sale_quote(http.Controller):
order = order_obj.browse(request.cr, SUPERUSER_ID, order_id)
if token != order.access_token:
return request.website.render('website.404')
+ if order.state != 'sent':
+ return werkzeug.utils.redirect("/quote/%s/%s?message=4" % (order_id, token))
request.registry.get('sale.order').action_cancel(request.cr, SUPERUSER_ID, [order_id])
message = post.get('decline_message')
if message:
diff --git a/addons/website_quote/static/src/js/website_quotation.js b/addons/website_quote/static/src/js/website_quotation.js
index 88948908295..2539dc79365 100644
--- a/addons/website_quote/static/src/js/website_quotation.js
+++ b/addons/website_quote/static/src/js/website_quotation.js
@@ -62,15 +62,25 @@ if(!$('.o_website_quote').length) {
submitForm: function(ev){
// extract data
var self = this;
+ var $confirm_btn = self.$el.find('button[type="submit"]');
+
+ // Support 2 routes:
+ // - <form id="accept" method="POST" t-attf-action="/quote/accept/#{quotation.id}/?token=#{quotation.access_token}" ...>
+ // - <form id="accept" method="POST" t-att-data-order-id="quotation.id" t-att-data-token="quotation.access_token" ...>
+ // The first route is deprecated but might still be used if the template is not updated
var href = self.$el.find('form').attr("action");
- var action = href.match(/quote\/([a-z]+)/);
- var order_id = href.match(/quote\/[a-z]+\/([0-9]+)/);
- var token = href.match(/token=(.*)/);
- if (token){
- token = token[1];
+ if (href) {
+ var action = href.match(/quote\/([a-z]+)/)[1];
+ var order_id = parseInt(href.match(/quote\/[a-z]+\/([0-9]+)/)[1]);
+ var token = href.match(/token=(.*)/) && href.match(/token=(.*)/)[1];
+ }
+ else {
+ var action = 'accept';
+ var order_id = self.$el.find('form').data("order-id");
+ var token = self.$el.find('form').data("token");
}
- if (action[1]=='accept') {
+ if (action == 'accept') {
ev.preventDefault();
// process : display errors, or submit
var signer_name = self.$("#name").val();
@@ -84,14 +94,16 @@ if(!$('.o_website_quote').length) {
})
return false;
}
- ajax.jsonRpc("/quote/"+action[1], 'call', {
- 'order_id': parseInt(order_id[1]),
+ $confirm_btn.prepend('<i class="fa fa-spinner fa-spin"></i> ');
+ $confirm_btn.attr('disabled', true);
+ ajax.jsonRpc("/quote/"+action, 'call', {
+ 'order_id': order_id,
'token': token,
'signer': signer_name,
'sign': signature?JSON.stringify(signature[1]):false,
}).then(function (data) {
self.$el.modal('hide');
- window.location.href = '/quote/'+order_id[1]+'/'+token+'?message=3';
+ window.location.href = '/quote/'+order_id.toString()+'/'+token+'?message=3';
});
return false;
}
diff --git a/addons/website_quote/views/website_quotation.xml b/addons/website_quote/views/website_quotation.xml
index 7d1a454e6d7..24538a1dafc 100644
--- a/addons/website_quote/views/website_quotation.xml
+++ b/addons/website_quote/views/website_quotation.xml
@@ -225,11 +225,19 @@
Your transaction is waiting confirmation.
<span t-if='tx_post_msg' t-raw="tx_post_msg"/>
</div>
+ <div class="alert alert-warning alert-dismissable" t-if="message==4 and quotation.state != 'sent'">
+ <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&amp;times;</button>
+ This order has already been
+ <t t-if="quotation.state=='cancel'">cancelled</t>
+ <t t-if="quotation.state not in ('cancel','draft')">validated</t>
+ ! You can <a href="#discussion">contact us</a> for
+ any question.
+ </div>
<!-- modal relative to the actions Accept/Reject/Cancel -->
<div class="modal fade" id="modalaccept" role="dialog" aria-hidden="true">
<div class="modal-dialog" t-if="not quotation.require_payment and not need_payment">
- <form id="accept" method="POST" t-attf-action="/quote/accept/#{quotation.id}/?token=#{quotation.access_token}" class="js_accept_json modal-content js_website_submit_form">
+ <form id="accept" method="POST" t-att-data-order-id="quotation.id" t-att-data-token="quotation.access_token" class="js_accept_json modal-content js_website_submit_form">
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&amp;times;</button>
diff --git a/addons/website_sale/models/sale_order.py b/addons/website_sale/models/sale_order.py
index 8be8ea51548..b9625be9347 100644
--- a/addons/website_sale/models/sale_order.py
+++ b/addons/website_sale/models/sale_order.py
@@ -123,10 +123,16 @@ class sale_order(osv.Model):
class website(orm.Model):
_inherit = 'website'
+ def _get_pricelist_id(self, cr, uid, ids, name, args, context=None):
+ res = {}
+ pricelist = self.get_current_pricelist(cr, uid, context=context)
+ for data in self.browse(cr, uid, ids, context=context):
+ res[data.id] = pricelist.id
+ return res
+
_columns = {
- 'pricelist_id': fields.related(
- 'user_id', 'partner_id', 'property_product_pricelist',
- type='many2one', relation='product.pricelist', string='Default Pricelist'),
+ 'pricelist_id': fields.function(_get_pricelist_id,\
+ type='many2one', relation="product.pricelist", string='Default Pricelist'),
'currency_id': fields.related(
'pricelist_id', 'currency_id',
type='many2one', relation='res.currency', string='Default Currency'),
@@ -180,7 +186,7 @@ class website(orm.Model):
"""
isocountry = request.session.geoip and request.session.geoip.get('country_code') or False
pl_ids = self._get_pl(cr, uid, isocountry, show_visible,
- request.website.pricelist_id.id,
+ request.website.user_id.partner_id.property_product_pricelist.id,
request.session.get('website_sale_current_pl'),
request.website.website_pricelist_ids)
return self.pool['product.pricelist'].browse(cr, uid, pl_ids, context=context)
@@ -229,6 +235,11 @@ class website(orm.Model):
sale_order_id = request.session.get('sale_order_id') or (partner.last_website_so_id.id if partner.last_website_so_id and partner.last_website_so_id.state == 'draft' else False)
sale_order = None
+ # Test validity of the sale_order_id
+ if sale_order_id and sale_order_obj.exists(cr, SUPERUSER_ID, sale_order_id, context=context):
+ sale_order = sale_order_obj.browse(cr, SUPERUSER_ID, sale_order_id, context=context)
+ else:
+ sale_order_id = None
pricelist_id = request.session.get('website_sale_current_pl')
if force_pricelist and self.pool['product.pricelist'].search_count(cr, uid, [('id', '=', force_pricelist)], context=context):
@@ -243,26 +254,24 @@ class website(orm.Model):
affiliate_id = request.session.get('affiliate_id')
salesperson_id = affiliate_id if user_obj.exists(cr, SUPERUSER_ID, affiliate_id, context=context) else request.website.salesperson_id.id
for w in self.browse(cr, uid, ids):
+ addr = partner.address_get(['delivery', 'invoice'])
values = {
'partner_id': partner.id,
'pricelist_id': pricelist_id,
+ 'payment_term_id': partner.property_payment_term_id.id if partner.property_payment_term_id else False,
'team_id': w.salesteam_id.id,
+ 'partner_invoice_id': addr['invoice'],
+ 'partner_shipping_id': addr['delivery'],
+ 'user_id': salesperson_id or w.salesperson_id.id,
}
sale_order_id = sale_order_obj.create(cr, SUPERUSER_ID, values, context=context)
- sale_order_obj.onchange_partner_id(cr, SUPERUSER_ID, [sale_order_id], context=context)
- values = {'user_id': salesperson_id or w.salesperson_id.id}
-
- sale_order_obj.write(cr, SUPERUSER_ID, [sale_order_id], values, context=context)
request.session['sale_order_id'] = sale_order_id
+ sale_order = sale_order_obj.browse(cr, SUPERUSER_ID, sale_order_id, context=context)
if request.website.partner_id.id != partner.id:
self.pool['res.partner'].write(cr, SUPERUSER_ID, partner.id, {'last_website_so_id': sale_order_id})
if sale_order_id:
- sale_order = sale_order_obj.browse(cr, SUPERUSER_ID, sale_order_id, context=context)
- if not sale_order.exists():
- request.session['sale_order_id'] = None
- return None
# check for change of pricelist with a coupon
pricelist_id = pricelist_id or partner.property_product_pricelist.id
@@ -321,6 +330,10 @@ class website(orm.Model):
if (code and code != sale_order.pricelist_id.code) or sale_order.partner_id.id != partner.id or force_pricelist:
sale_order = sale_order_obj.browse(cr, SUPERUSER_ID, sale_order.id, context=context)
+ else:
+ request.session['sale_order_id'] = None
+ return None
+
return sale_order
def sale_get_transaction(self, cr, uid, ids, context=None):
diff --git a/addons/website_sale/tests/test_website_sale_pricelist.py b/addons/website_sale/tests/test_website_sale_pricelist.py
index 9981544f68f..159d8f599e5 100644
--- a/addons/website_sale/tests/test_website_sale_pricelist.py
+++ b/addons/website_sale/tests/test_website_sale_pricelist.py
@@ -11,6 +11,7 @@ class TestWebsitePriceList(TransactionCase):
def setUp(self):
super(TestWebsitePriceList, self).setUp()
self.website = self.registry('website').browse(self.cr, self.uid, 1)
+ self.website.pricelist_id = self.registry('ir.model.data').xmlid_to_res_id(self.cr, self.uid, 'product.list0')
self.patcher = patch('openerp.addons.website_sale.models.sale_order.website.get_pricelist_available', wraps=self._get_pricelist_available)
self.mock_get_pricelist_available = self.patcher.start()
diff --git a/addons/website_sale/views/templates.xml b/addons/website_sale/views/templates.xml
index d2d3ea81367..68e2910fc81 100644
--- a/addons/website_sale/views/templates.xml
+++ b/addons/website_sale/views/templates.xml
@@ -93,16 +93,16 @@
<del class="text-danger mr8" style="white-space: nowrap;" t-field="product.lst_price" t-field-options='{
"widget": "monetary",
"from_currency": "product.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</t>
<span t-field="product.price" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'>
</span>
<span itemprop="price" style="display:none;" t-esc="product.price"/>
- <span itemprop="priceCurrency" style="display:none;" t-esc="user_id.partner_id.property_product_pricelist.currency_id.name"/>
+ <span itemprop="priceCurrency" style="display:none;" t-esc="website.currency_id.name"/>
</b>
</div>
</section>
@@ -423,16 +423,16 @@
t-field-options='{
"widget": "monetary",
"from_currency": "product.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
<b class="oe_price" style="white-space: nowrap;"
t-field="product.price"
t-field-options='{
"widget": "monetary",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
<span itemprop="price" style="display:none;" t-esc="product.price"/>
- <span itemprop="priceCurrency" style="display:none;" t-esc="user_id.partner_id.property_product_pricelist.currency_id.name"/>
+ <span itemprop="priceCurrency" style="display:none;" t-esc="website.currency_id.name"/>
</h4>
<h4 class="css_non_editable_mode_hidden">
<span t-field="product.lst_price"
@@ -456,7 +456,7 @@
<t t-esc="variant_id.price_extra > 0 and '+' or ''"/><span t-field="variant_id.price_extra" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "product.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</span>
</label>
@@ -481,7 +481,7 @@
<t t-esc="value_id.price_extra > 0 and '+' or ''"/><span t-field="value_id.price_extra" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "product.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</span>
</option>
@@ -501,7 +501,7 @@
<t t-esc="value_id.price_extra > 0 and '+' or ''"/><span t-field="value_id.price_extra" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "product.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</span>
</label>
@@ -776,12 +776,12 @@
t-field="line.product_id.lst_price" t-field-options='{
"widget": "monetary",
"from_currency": "line.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
<span t-field="line.price_reduce" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "website_sale_order.pricelist_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</td>
</tr>
@@ -898,12 +898,12 @@
t-field="product.lst_price" t-field-options='{
"widget": "monetary",
"from_currency": "product.company_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</t>
<span t-field="product.price" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</td>
<td class="text-center">
@@ -1153,7 +1153,7 @@
<span t-field="line.price_unit" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "website_sale_order.pricelist_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</td>
</tr>
@@ -1394,7 +1394,7 @@
<span t-field="website_sale_order.amount_untaxed" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "website_sale_order.pricelist_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</span>
</div>
@@ -1404,7 +1404,7 @@
<span t-field="website_sale_order.amount_tax" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "website_sale_order.pricelist_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</span>
</div>
@@ -1414,7 +1414,7 @@
<span t-field="website_sale_order.amount_total" style="white-space: nowrap;" t-field-options='{
"widget": "monetary",
"from_currency": "website_sale_order.pricelist_id.currency_id",
- "display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
+ "display_currency": "website.currency_id"
}'/>
</span>
</div>
diff --git a/addons/website_sale_options/views/templates.xml b/addons/website_sale_options/views/templates.xml
index ef35041cb1d..590fa78f2b3 100644
--- a/addons/website_sale_options/views/templates.xml
+++ b/addons/website_sale_options/views/templates.xml
@@ -59,7 +59,7 @@
t-field="product.lst_price"
t-field-options='{
"widget": "monetary",
- "from_currency": "website.currency_id",
+ "from_currency": "product.company_id.currency_id",
"display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
}'/>
<span class="oe_price" style="white-space: nowrap;"
@@ -67,7 +67,7 @@
t-field="product.price"
t-field-options='{
"widget": "monetary",
- "from_currency": "website.currency_id",
+ "from_currency": "product.company_id.currency_id",
"display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
}'/>
</td>
@@ -107,7 +107,7 @@
t-field="product.lst_price"
t-field-options='{
"widget": "monetary",
- "from_currency": "website.currency_id",
+ "from_currency": "product.company_id.currency_id",
"display_currency": "user_id.partner_id.property_product_pricelist.currency_id"
}'/><br/>
<span class="oe_price" style="white-space: nowrap;"
diff --git a/doc/cla/individual/barsi.md b/doc/cla/individual/barsi.md
new file mode 100644
index 00000000000..5d09cf05bc5
--- /dev/null
+++ b/doc/cla/individual/barsi.md
@@ -0,0 +1,11 @@
+Saudi Arabia, 2015-10-13
+
+I hereby agree to the terms of the Odoo Individual Contributor License
+Agreement v1.0.
+
+I declare that I am authorized and able to make this agreement and sign this
+declaration.
+
+Signed,
+
+Mohammed Barsi barsintod@gmail.com
diff --git a/doc/howtos/web.rst b/doc/howtos/web.rst
index b7c6a546d2e..a2641cbfdef 100644
--- a/doc/howtos/web.rst
+++ b/doc/howtos/web.rst
@@ -1973,7 +1973,7 @@ Read-Write Field
Read-only fields, which only display content and don't allow the
user to modify it can be useful, but most fields in Odoo also allow editing.
This makes the field classes more complicated, mostly because fields are
-supposed to handle both and editable and non-editable mode, those modes are
+supposed to handle both editable and non-editable mode, those modes are
often completely different (for design and usability purpose) and the fields
must be able to switch between modes at any moment.
diff --git a/openerp/addons/base/ir/ir_ui_view.py b/openerp/addons/base/ir/ir_ui_view.py
index 5a324fdd8e1..2e8f71f234f 100644
--- a/openerp/addons/base/ir/ir_ui_view.py
+++ b/openerp/addons/base/ir/ir_ui_view.py
@@ -552,7 +552,7 @@ class view(osv.osv):
separator = child.get('separator', ',')
if separator == ' ':
separator = None # squash spaces
- to_add = map(str.strip, child.get('add', '').split(separator))
+ to_add = filter(bool, map(str.strip, child.get('add', '').split(separator)))
to_remove = map(str.strip, child.get('remove', '').split(separator))
values = map(str.strip, node.get(attribute, '').split(separator))
value = (separator or ' ').join(filter(lambda s: s not in to_remove, values) + to_add)
diff --git a/openerp/addons/base/res/res_company_view.xml b/openerp/addons/base/res/res_company_view.xml
index 72b1b10646e..76180b9b6d4 100644
--- a/openerp/addons/base/res/res_company_view.xml
+++ b/openerp/addons/base/res/res_company_view.xml
@@ -20,9 +20,6 @@
<field name="rml_header1" placeholder="e.g. Global Business Solutions"/>
</h3>
</div>
- <group col="4">
- <field name="parent_id" groups="base.group_multi_company"/>
- </group>
<notebook colspan="4">
<page string="General Information">
<group>
@@ -45,6 +42,7 @@
<field name="email"/>
<field name="vat"/>
<field name="company_registry"/>
+ <field name="parent_id" groups="base.group_multi_company"/>
</group>
</group>
</page>
diff --git a/openerp/addons/base/res/res_currency_data.xml b/openerp/addons/base/res/res_currency_data.xml
index 8b1ff4e5895..46477b74919 100644
--- a/openerp/addons/base/res/res_currency_data.xml
+++ b/openerp/addons/base/res/res_currency_data.xml
@@ -36,6 +36,7 @@
<field name="symbol">R$</field>
<field name="rounding">0.01</field>
<field name="active" eval="False"/>
+ <field name="position">before</field>
</record>
<record id="CNY" model="res.currency">
@@ -229,6 +230,7 @@
<field name="symbol">$</field>
<field name="rounding">0.01</field>
<field name="active" eval="False"/>
+ <field name="position">before</field>
</record>
<record id="MYR" model="res.currency">
diff --git a/openerp/addons/base/tests/test_ir_filters.py b/openerp/addons/base/tests/test_ir_filters.py
index d3f7809456c..2132fdb946b 100644
--- a/openerp/addons/base/tests/test_ir_filters.py
+++ b/openerp/addons/base/tests/test_ir_filters.py
@@ -275,3 +275,27 @@ class TestGlobalDefaults(FiltersCase):
dict(name='a', user_id=False, is_default=False, domain='[]', context='{}', sort='[]'),
dict(name='b', user_id=False, is_default=True, domain='[]', context=context_value, sort='[]'),
])
+
+from openerp.tests.common import TransactionCase
+
+class TestReadGroup(TransactionCase):
+ """Test function read_group with groupby on a many2one field to a model
+ (in test, "user_id" to "res.users") which is ordered by an inherited not stored field (in
+ test, "name" inherited from "res.partners").
+ """
+
+ def setUp(self):
+ super(TestReadGroup, self).setUp()
+ self.ir_filters_model = self.env['ir.filters']
+ self.res_partner_model = self.env['res.partner']
+ self.res_users_model = self.env['res.users']
+
+ def test_read_group_1(self):
+ self.assertEqual(self.res_users_model._order, "name, login", "Model res.users must be ordered by name, login")
+ self.assertFalse(self.res_users_model._fields['name'].store, "Field name is not stored in res.users")
+
+ filter_a = self.ir_filters_model.create(dict(name="Filter_A", model_id="ir.filters"))
+ filter_b = self.ir_filters_model.create(dict(name="Filter_B", model_id="ir.filters"))
+ filter_b.write(dict(user_id=False))
+ res = self.ir_filters_model.read_group([], ['name', 'user_id'], ['user_id'])
+ self.assertTrue(any(val['user_id'] == False for val in res), "At least one group must contain val['user_id'] == False.")
diff --git a/openerp/addons/base/tests/test_views.py b/openerp/addons/base/tests/test_views.py
index bc7b5edf11c..74d36e0ad00 100644
--- a/openerp/addons/base/tests/test_views.py
+++ b/openerp/addons/base/tests/test_views.py
@@ -748,7 +748,7 @@ class test_views(ViewCase):
<attribute name="thing">bob tata lolo</attribute>
<attribute name="thing" add="bibi and co" remove="tata" separator=" " />
<attribute name="otherthing">bob, tata,lolo</attribute>
- <attribute name="otherthing" add="bibi" remove="tata, bob"/>
+ <attribute name="otherthing" remove="tata, bob"/>
</footer>
"""
})
@@ -768,7 +768,7 @@ class test_views(ViewCase):
E.p("Replacement data"),
E.footer(
E.button(name="action_next", type="object", string="New button"),
- thing="bob lolo bibi and co", otherthing="lolo,bibi"
+ thing="bob lolo bibi and co", otherthing="lolo"
),
string="Replacement title", version="7.0"))
diff --git a/openerp/models.py b/openerp/models.py
index 78f56ebce40..6aeba7ac87e 100644
--- a/openerp/models.py
+++ b/openerp/models.py
@@ -2152,7 +2152,7 @@ class BaseModel(object):
return parent_alias
@api.model
- def _inherits_join_calc(self, alias, field, query):
+ def _inherits_join_calc(self, alias, field, query, implicit=True, outer=False):
"""
Adds missing table select and join clause(s) to ``query`` for reaching
the field coming from an '_inherits' parent table (no duplicates).
@@ -2172,7 +2172,7 @@ class BaseModel(object):
# JOIN parent_model._table AS parent_alias ON alias.parent_field = parent_alias.id
parent_alias, _ = query.add_join(
(alias, parent_model._table, parent_field, 'id', parent_field),
- implicit=True,
+ implicit=implicit, outer=outer,
)
model, alias = parent_model, parent_alias
# handle the case where the field is translated
@@ -2225,7 +2225,7 @@ class BaseModel(object):
# if val is a many2one, just write the ID
if type(val) == tuple:
val = val[0]
- if val is not False:
+ if f._type == 'boolean' or val is not False:
cr.execute(update_query, (ss[1](val), key))
@api.model
@@ -4682,7 +4682,7 @@ class BaseModel(object):
parent_obj = self.pool[self._inherit_fields[order_field][3]]
order_column = parent_obj._columns[order_field]
if order_column._classic_read:
- inner_clauses = [self._inherits_join_calc(alias, order_field, query)]
+ inner_clauses = [self._inherits_join_calc(alias, order_field, query, implicit=False, outer=True)]
add_dir = True
elif order_column._type == 'many2one':
key = (parent_obj._name, order_column._obj, order_field)
diff --git a/openerp/service/model.py b/openerp/service/model.py
index decfd5d8ba1..6cc4a3fbde9 100644
--- a/openerp/service/model.py
+++ b/openerp/service/model.py
@@ -54,7 +54,12 @@ def check(f):
if args and isinstance(args[-1], dict):
ctx = args[-1]
elif isinstance(kwargs, dict):
- ctx = kwargs.get('context', {})
+ if 'context' in kwargs:
+ ctx = kwargs['context']
+ elif 'kwargs' in kwargs:
+ # http entry points such as call_kw()
+ ctx = kwargs['kwargs'].get('context')
+
uid = 1
if args and isinstance(args[0], (long, int)):