Question

仍在进行以下可视化工作：https://ayyrickay.github.io/circulating-magazines/

我正在进行一些不错的更新，但是让我感到讨厌的是，当有人单击折线图时，它保持状态。例如，如果我单击一个问题，则为runs this code to update both application state and crossfilter state

(chart) => {
    chart.selectAll('circle').on('click', (selected) => {
    state.circulationClicked = true
    const clearFilterButton = document.getElementById('clearIssueFilterButton')
    clearFilterButton.classList.remove('hide')
    clearFilterButton.addEventListener('click', lineChart.unClick)
    renderIssueData(selected)
    samplePeriodEnd.filter(d => {
        const currentIssueDate = moment.utc(selected.x)
        const periodEnding = moment.utc(d)
        const periodStart = moment.utc({'year': periodEnding.get('year'), 'month': periodEnding.get('month') === 5 ? 0 : 6, 'day':1})
        if (currentIssueDate >= periodStart && currentIssueDate <= periodEnding) {
            Object.assign(state, {currentIssueDate, periodStart, periodEnding})
            return currentIssueDate >= periodStart && currentIssueDate <= periodEnding
        }
    })

    state.totalSalesByState = salesByState.all().reduce((a, b) => ({value: {sampled_total_sales: a.value.sampled_total_sales + b.value.sampled_total_sales}}))
    us1Chart.colorDomain(generateScale(salesByState))
    us1Chart.customUpdate()
    })
}

这里发生了很多事情，但是我很沮丧，因为好像是因为我覆盖了默认点击，炸掉了一些我想要的功能-特别是，我想要与数据点关联的圆保持可视化。

使用renderDataPoints method是不正确的，因为我只需要圆圈在点击时停留就可以了。我也尝试过创建一个moveToFront method来将圆圈显示在最前面，但这对我没有用。我的问题似乎是我无法在click方法本身中找到圆并修改其属性。我得到了数据，但是没有得到与数据点关联的HTML / SVG来进行相应的修改。

一如既往的粗鲁的问题，但希望能为您解决一些问题（并可能将其记录在某处？）

当您覆盖dc.js中的click事件时，保留折线图装饰吗？

0 个答案: