2b:null 2c:["$","title",null,{"children":"MapD3 zoom | Chris Viau | Observable"}] 31:T491,brushFiltering = { const container = html`

`; yield container; const data = mapd3 .DataGenerator() .setConfig(commonDataConfig) .setConfig({ keyType: "time", lineCount: 1, groupCount: 1, pointCount: 100 }) .generateTestDataset(); const focusChart = mapd3 .Chart(container.querySelector(".focus-chart")) .setConfig(commonChartConfig) .setConfig({ keyType: "time", chartType: "line" }) .setData(data); const rangeChart = mapd3 .Chart(container.querySelector(".range-chart")) .setConfig(commonChartConfig) .setConfig({ keyType: "time", chartType: "line", height: 100, legendIsEnabled: false, brushIsEnabled: true, tooltipIsEnabled: false }) .setData(data); rangeChart .getEvents() .onBrush("brushMove", d => { const focusData = mapd3._Utils.filterByDate(data, d); focusChart.setData(focusData); }) .onBrush("brushClear", d => { focusChart.setData(data); }); }32:[] 2f:{"id":"3a5fd98824ec58b0","slug":"mapd3-examples","title":"MapD3 zoom","thumbnail":"70e15a8f9128694e9bdd38b54b90c94bc179726b042f2421407e56e45091b970","access_level":"public","create_time":"$D2019-03-29T16:49:58.499Z","update_time":"$D2019-03-29T18:17:41.633Z","view_time":null,"first_public_time":"$D2019-03-29T18:16:57.293Z","fork":{"id":"11005fa6ad3860cd","slug":"mapd3-test-sheet","title":"MapD3 examples","owner":{"id":"ec5efd42ce7e8331","login":"biovisualize","name":"Chris Viau"}},"stars":1,"starred":false,"owner":{"type":"team","id":"ec5efd42ce7e8331","login":"biovisualize","name":"Chris Viau","avatar_url":"https://avatars-next.observableusercontent.com/65bb5f5e54396fa26f909d2d00260f5710d56692cc2360f902c4d61182af1022","tier":"starter_2024"},"version":1029,"publish_version":1029,"role":null,"authored":false,"authors":[{"type":"individual","id":"9f1f6ac72dad100b","login":"biovisualize","name":"Chris Viau","avatar_url":"https://avatars-next.observableusercontent.com/65bb5f5e54396fa26f909d2d00260f5710d56692cc2360f902c4d61182af1022","tier":null}],"members":[{"type":"individual","id":"9f1f6ac72dad100b","login":"biovisualize","name":"Chris Viau","avatar_url":"https://avatars-next.observableusercontent.com/65bb5f5e54396fa26f909d2d00260f5710d56692cc2360f902c4d61182af1022","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"MapD3 zoom","cells":[{"id":0,"value":"md`# MapD3 zoom\n\nHere are some examples of brush zooming to get started on prototyping a mousewheel zoom.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":945,"value":"md`## Interaction`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":745,"value":"md`Brush filtering`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":747,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":789,"value":"md`Brush filtering across Notebook cells.`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":917,"value":"focusChartContainer = html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":932,"value":"md`Use the brush selection in this cell to change the one on the cell above`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":900,"value":"viewof crossCellFilteredData = {\n const container = html`

`;\n\n const data = mapd3\n .DataGenerator()\n .setConfig(commonDataConfig)\n .setConfig({\n keyType: \"time\",\n lineCount: 1,\n groupCount: 1,\n pointCount: 100\n })\n .generateTestDataset();\n\n const rangeChart = mapd3\n .Chart(container)\n .setConfig(commonChartConfig)\n .setConfig({\n keyType: \"time\",\n chartType: \"line\",\n height: 100,\n legendIsEnabled: false,\n brushIsEnabled: true,\n tooltipIsEnabled: false\n })\n .setData(data);\n\n rangeChart\n .getEvents()\n .onBrush(\"brushMove\", extent => {\n container.value = mapd3._Utils.filterByDate(data, extent);\n container.dispatchEvent(new CustomEvent(\"input\"));\n })\n .onBrush(\"brushClear\", () => {\n container.value = data;\n container.dispatchEvent(new CustomEvent(\"input\"));\n });\n\n container.value = data;\n\n return container;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":972,"value":"focusChartDataChange = {\n focusChart.setData(crossCellFilteredData);\n\n const values = crossCellFilteredData.series[0].values.map(d => d.x);\n return [values[0], values[values.length - 1]];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":962,"value":"focusChart = {\n return mapd3\n .Chart(focusChartContainer)\n .setConfig(commonChartConfig)\n .setConfig({\n keyType: \"time\",\n chartType: \"line\"\n });\n}\n// .setData(crossCellFilteredData);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":192,"value":"md`---\n## Dependencies`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":104,"value":"mapd3 = require(\"https://raw.githack.com/mapd/mapd3/chrisv/all-types/dist/mapd3.js\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":520,"value":"commonChartConfig = {\n return {\n width: 500,\n height: 300,\n margin: {\n top: 20,\n right: 10,\n bottom: 40,\n left: 50\n },\n brushIsEnabled: false\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":535,"value":"commonDataConfig = {\n return {\n range: [0, 100],\n pointCount: 300,\n groupCount: 1,\n stringMinMaxLength: [5, 10],\n randomStepSize: 50,\n nullRatio: 0\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":472,"value":"notebookStyle = html`\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":232,"value":"mapd3CSS = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"