This example is being used in my blog on Adding a subtle touch of glow to your d3.js visualizations
Simple examples of adding an SVG filter to create a glow around shapes. Click anywhere around the shapes to turn the filter on and off. Note that the filter doesn't work on line elements
Another data visualization where I use the glow filter is my redesigned radar chart
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <!-- D3.js --> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script> | |
| <!-- Google Font --> | |
| <link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400' rel='stylesheet' type='text/css'> | |
| <style> | |
| #expl { | |
| font-family: 'Open Sans', sans-serif; | |
| text-align: center; | |
| font-size: 12px; | |
| text-align: left; | |
| color: #737373; | |
| font-weight: 400; | |
| /*background-color: #101420;*/ | |
| } | |
| #glowrange { | |
| margin: 0 !important; | |
| padding: 0 !important; | |
| border: none !important; | |
| width: auto !important; | |
| -webkit-appearance: slider-horizontal !important; | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <div id="expl" style="margin-top: 20px; margin-left: 20px;">stdDeviation (spread of glow): <input id="glowrange" style="position:relative;top:3px;" type="range" min="1" max="10" value="3"><span style="margin-left: 20px;">Click anywhere to turn the glow on/off</span></div> | |
| <div id="chart"></div> | |
| <script language="javascript" type="text/javascript"> | |
| /////////////////////////////////////////////////////////////////////////// | |
| //////////////////// Set up and initiate svg containers /////////////////// | |
| /////////////////////////////////////////////////////////////////////////// | |
| //Adjust the spread of the glow with the simple range slider | |
| d3.select("input[type=range]").on("change", function() { | |
| d3.select(".blur").attr("stdDeviation",this.value); | |
| }); | |
| var margin = { | |
| top: 0, | |
| right: 0, | |
| bottom: 0, | |
| left: 0 | |
| }; | |
| var width = window.innerWidth - margin.left - margin.right - 20; | |
| var height = window.innerHeight - margin.top - margin.bottom - 100; | |
| //SVG container | |
| var svg = d3.select('#chart') | |
| .append("svg") | |
| .attr("width", width + margin.left + margin.right) | |
| .attr("height", height + margin.top + margin.bottom) | |
| .on("click", switchGlow) | |
| .append("g") | |
| .attr("class", "svgWrapper") | |
| .attr("transform", "translate(" + (width/2 + margin.left) + "," + (height/2 + margin.top) + ")"); | |
| var glowOn = true; | |
| //Switch between glow filter and no filter on click | |
| function switchGlow() { | |
| d3.selectAll(".exampleGlow") | |
| .style("filter", glowOn ? "none" : "url(#glow)"); | |
| glowOn = glowOn ? false : true; | |
| } | |
| /////////////////////////////////////////////////////////////////////////// | |
| //////////////////////////// Create the filter //////////////////////////// | |
| /////////////////////////////////////////////////////////////////////////// | |
| //Container for the gradients | |
| var defs = svg.append("defs"); | |
| //Code taken from http://stackoverflow.com/questions/9630008/how-can-i-create-a-glow-around-a-rectangle-with-svg | |
| //Filter for the outside glow | |
| var filter = defs.append("filter") | |
| .attr("id","glow"); | |
| filter.append("feGaussianBlur") | |
| .attr("class", "blur") | |
| .attr("stdDeviation","4.5") | |
| .attr("result","coloredBlur"); | |
| var feMerge = filter.append("feMerge"); | |
| feMerge.append("feMergeNode") | |
| .attr("in","coloredBlur"); | |
| feMerge.append("feMergeNode") | |
| .attr("in","SourceGraphic"); | |
| /////////////////////////////////////////////////////////////////////////// | |
| //////////////////// Create the circle, path and rect ///////////////////// | |
| /////////////////////////////////////////////////////////////////////////// | |
| // //Doesn't appear when the filter is applied to it | |
| // svg.append("line") | |
| // .attr("class", "exampleGlow") | |
| // .attr("transform", "translate(" + -3*width/8 + "," + 0 + ")") | |
| // .attr("x1", 0) | |
| // .attr("y1", -90) | |
| // .attr("x2", 0) | |
| // .attr("y2", 90) | |
| // .style("stroke", "#EDC951") | |
| // .style("stroke-width", 10); | |
| var rectSize = Math.min(90, 89*width / 1280); | |
| svg.append("rect") | |
| .attr("class", "exampleGlow") | |
| .attr("transform", "translate(" + -width/4 + "," + 0 + ")") | |
| .attr("x", -rectSize/2) | |
| .attr("y", -rectSize) | |
| .attr("width", rectSize) | |
| .attr("height", rectSize*2) | |
| .style("fill", "#EDC951"); | |
| var circSize = Math.min(75, 75*width / 1280); | |
| svg.append("circle") | |
| .attr("class", "exampleGlow") | |
| .attr("cx", width/4) | |
| .attr("cy", 0) | |
| .attr("r", circSize) | |
| .style("fill", "#CC333F"); | |
| var exampleLine = "M150.963,0.742c-1.119,9.423-15.228,15.627-22.337,19.502 c-11.778,6.419-23.959,12.104-36.053,17.896C69.303,49.286,46.104,60.565,23.176,72.401c-23.287,12.02-46.154,24.828-69.413,36.897 c-10.333,5.361-21.625,12.133-33.254,14.016c-9.644,1.562-13.388-4.293-13.831-13.285c-0.603-12.237,2.106-24.863,4.199-36.863 c2.262-12.973,4.751-25.905,7.11-38.861c4.7-25.813,9.014-51.691,12.748-77.663c3.652-25.404,6.054-51.186,11.26-76.331 c1.486-7.178,3.651-22.944,13.075-24.345c9.477-1.409,20.082,10.858,25.997,16.556c18.648,17.962,35.902,37.396,53.899,56.005 c18.176,18.792,36.767,37.168,55.606,55.293c9.7,9.333,19.494,18.575,29.027,28.079c8.103,8.078,17.955,16.726,22.78,27.291 c9.267,20.292-36.935,22.065-48.109,23.595C42.182,69.911-9.66,77.357-61.444,86.495c-12.598,2.223-25.258,4.61-38.015,5.725 c-7.134,0.623-21.543,2.52-24.37-6.648c-2.906-9.425,5.29-22.527,9.291-30.512c6.031-12.036,12.592-23.804,19.061-35.608 c25.167-45.922,47.544-93.094,71.522-139.611c4.958-9.618,10.177-21.902,19.054-28.565c7.985-5.995,14.804,2.125,19.104,8.516 c14.261,21.19,23.637,46.118,34.58,69.107C60.079-47.374,71.775-23.842,83.969-0.561c12.036,22.982,26.008,45.653,35.471,69.856 c2.667,6.822,7.368,18.686-1.367,23.091c-9.31,4.695-23.635,0.879-33.33-0.665c-25.83-4.113-51.421-9.731-77.173-14.302 c-25.596-4.542-51.278-8.522-77.011-12.201c-13.523-1.934-27.08-3.734-40.537-6.095c-9.673-1.696-24.463-2.754-31.741-10.225 c-6.827-7.008,1.473-16.689,6.217-22.272c8.324-9.796,17.947-18.539,27.3-27.328c19.105-17.954,38.326-35.776,57.026-54.156 c18.79-18.468,37.058-37.438,55.514-56.237c8.868-9.034,17.761-18.443,27.89-26.089c6.143-4.637,15.243-10.111,20.842-1.842 c6.222,9.192,7.154,22.496,8.713,33.204c1.963,13.493,3.518,27.043,5.183,40.575c3.185,25.886,6.684,51.728,10.776,77.487 c4.086,25.711,9.162,51.302,12.619,77.106c1.187,8.852,4.666,23.917-1.147,31.884c-5.655,7.75-18.656,1.271-25.199-1.642 c-23.64-10.523-45.876-24.461-68.542-36.892c-23.03-12.629-46.329-24.748-69.817-36.501c-22.603-11.31-48.056-20.971-68.244-36.392 c-6.675-5.099-11.641-11.893-4.795-19.117c7.983-8.424,20.137-13.389,30.417-18.383c46.896-22.778,94.21-44.32,140.451-68.464 c11.894-6.21,23.753-12.542,35.924-18.197c7.45-3.461,21.475-11.609,29.98-7.194c8.456,4.389,5.37,19.997,4.438,27.266 c-1.64,12.786-4.283,25.45-6.79,38.086C76.857-4.896,68.722,46.562,60.438,98.187c-1.922,11.975-4.556,55.485-25.435,44.297 c-10.381-5.562-18.851-15.642-26.872-24.073c-9.295-9.771-18.359-19.761-27.512-29.663c-17.773-19.229-35.834-38.181-54.293-56.753 c-18.134-18.246-37.169-35.735-54.523-54.734c-5.299-5.801-17.022-16.624-14.777-25.72c2.264-9.171,18.244-10.822,25.558-12.154 c25.065-4.564,50.666-6.431,75.937-9.574c26.033-3.238,51.991-6.991,77.887-11.185c13.312-2.156,26.608-4.431,39.941-6.462 c11.876-1.809,24.569-4.321,36.611-3.156c25.688,2.484,3.334,35.891-3.147,47.715C97.082-20.052,83.74,2.828,71.116,26.113 C58.829,48.778,47.142,71.75,35.531,94.767c-5.966,11.828-11.853,23.727-18.459,35.215c-3.793,6.596-10.691,21.044-20.014,20.989 c-9.528-0.056-15.968-15.275-19.529-22.06c-6.083-11.589-11.39-23.594-16.802-35.505c-10.696-23.542-21.489-47.035-32.873-70.254 c-11.629-23.72-24.028-47.046-35.757-70.713c-5.993-12.092-27.191-46.82-1.046-47.941c12.388-0.531,25.124,2.479,37.219,4.838 c12.895,2.515,25.746,5.256,38.621,7.874c25.706,5.227,51.483,10.069,77.367,14.335c25.393,4.185,51.179,7.129,76.289,12.821 c7.177,1.626,23.01,4.075,24.354,13.511c1.345,9.441-11.078,19.794-16.835,25.548C109.796,1.685,90.049,18.49,71.122,36.062 C51.954,53.857,33.191,72.072,14.678,90.546c-9.553,9.532-19.017,19.16-28.731,28.529c-8.288,7.994-17.162,17.708-27.858,22.412 c-20.561,9.042-21.411-36.83-22.725-48.11c-6.08-52.21-12.415-104.192-20.529-156.137c-1.982-12.688-4.115-25.442-4.999-38.266 c-0.492-7.146-2.178-21.72,6.997-24.481c9.381-2.823,22.319,5.608,30.144,9.72c12.169,6.394,24.042,13.345,35.959,20.191 c45.321,26.037,91.998,49.227,137.881,74.187c9.345,5.083,22.122,10.617,28.173,19.788c5.488,8.317-2.986,14.762-9.515,18.937 C117.655,31.269,92.173,40.251,68.64,50.874C44.682,61.688,20.945,72.971-2.586,84.682c-22.912,11.403-45.538,24.726-69.625,33.512 c-6.711,2.447-18.915,6.77-22.66-2.295c-4.053-9.809-0.325-23.266,1.485-33.235c4.696-25.856,10.811-51.457,15.94-77.231 c5.07-25.478,9.525-51.064,13.732-76.697c2.166-13.194,4.197-26.423,6.765-39.547c1.904-9.733,3.246-24.501,10.834-31.771 c7.078-6.78,16.525,1.532,22.043,6.394c9.605,8.462,18.121,18.223,26.684,27.71c17.544,19.438,34.945,38.999,52.916,58.047 c18.104,19.19,36.723,37.868,55.168,56.726c8.895,9.095,18.153,18.207,25.664,28.513c4.502,6.177,10.011,15.481,1.689,20.984 c-9.191,6.079-22.5,6.743-33.146,8.078c-13.492,1.691-27.033,2.971-40.56,4.355c-25.933,2.655-51.828,5.621-77.653,9.182 c-25.848,3.563-51.592,8.123-77.518,11.086c-8.961,1.023-24.103,4.228-32.083-1.682c-7.725-5.721-1.1-18.487,1.928-24.981 c10.899-23.382,25.299-45.26,38.144-67.601c13.094-22.774,25.698-45.816,37.931-69.063c11.731-22.292,21.883-47.235,37.428-67.207 c5.083-6.531,11.831-12.258,19.282-5.607c8.358,7.461,13.039,19.972,17.644,29.936C51.323-70.378,71.834-22.584,95.03,24.153 c6.05,12.189,12.202,24.346,17.749,36.775c3.492,7.824,11.006,21.236,7.301,30.094c-3.686,8.809-18.511,5.966-25.625,4.996 c-12.662-1.726-25.178-4.609-37.651-7.34C5.462,77.441-46.022,67.961-97.751,58.729c-11.382-2.032-55.969-5.517-46.024-25.508 c5.091-10.234,15.394-18.469,23.678-26.079c9.831-9.031,19.902-17.799,29.889-26.657c19.548-17.34,38.876-34.921,57.788-52.955 c18.828-17.953,36.938-36.785,56.407-54.046c6.219-5.514,17.061-17.142,26.506-15.617c9.404,1.518,11.012,17.123,12.221,24.304 c4.268,25.344,5.571,51.244,8.2,76.795c2.687,26.108,5.919,52.149,9.572,78.14c1.874,13.332,3.863,26.649,5.648,39.994 c1.61,12.035,3.724,24.68,2.627,36.84c-0.808,8.95-5.041,14.575-14.536,12.446c-11.647-2.613-22.604-9.648-32.854-15.53 C18.44,97.696-4.124,83.911-27.101,70.828c-22.423-12.769-45.173-24.934-67.97-37.017c-11.745-6.226-23.559-12.374-34.961-19.216 c-6.569-3.942-20.958-11.133-20.849-20.479c0.111-9.506,15.366-15.648,22.172-19.057c11.663-5.841,23.73-10.891,35.708-16.042 c23.733-10.207,47.421-20.504,70.849-31.4c23.994-11.159,47.611-23.093,71.545-34.371c12.078-5.691,47.578-26.467,48.293-0.44 c0.339,12.329-2.922,24.954-5.503,36.932c-2.762,12.813-5.758,25.576-8.633,38.364C77.797-6.31,72.423,19.356,67.635,45.142 c-4.711,25.37-8.21,51.148-14.385,76.215c-1.767,7.173-4.507,23.068-13.953,24.356c-9.405,1.282-19.507-11.289-25.1-17.104 C-3.78,109.92-20.23,89.739-37.486,70.39c-17.407-19.521-35.224-38.661-53.326-57.537c-9.515-9.922-19.107-19.774-28.453-29.856 c-7.646-8.248-17.423-17.397-21.486-28.102c-7.807-20.569,37.537-20.349,48.949-21.434C-39.469-71.518,12.626-76.886,64.734-83.91 c12.833-1.73,25.731-3.621,38.68-4.212c6.942-0.317,21.75-1.564,23.807,7.785c2.172,9.871-6.22,22.104-10.702,30.254 c-6.515,11.843-13.619,23.366-20.587,34.945C69.041,29.549,44.929,75.625,19.133,120.912c-5.311,9.324-11.103,21.997-20.406,27.994 c-8.383,5.404-14.651-2.961-18.74-9.604c-13.527-21.976-21.95-47.597-32.048-71.255C-62.38,43.873-73.176,19.913-84.399-3.854 c-10.965-23.22-23.835-46.173-32.22-70.491c-2.317-6.721-6.542-19.15,2.538-22.804c9.774-3.934,23.146,0.052,32.988,2.039 c25.706,5.19,51.124,11.813,76.733,17.461c25.382,5.598,50.887,10.588,76.445,15.311c13.187,2.437,26.409,4.748,39.519,7.576 c10.061,2.17,23.624,3.861,31.462,11.147c7.223,6.715-0.855,16.162-5.709,21.533c-8.573,9.491-18.484,17.816-28.129,26.181 C89.428,21.272,69.498,38.283,50.051,55.857C30.633,73.404,11.728,91.489-7.336,109.418c-9.251,8.699-18.496,17.681-28.778,25.175 c-5.895,4.296-15.991,11.139-21.859,3.186c-6.408-8.685-6.706-22.371-7.85-32.704c-1.48-13.375-2.44-26.809-3.537-40.219 c-2.12-25.923-4.515-51.816-7.519-77.653c-3.021-25.983-7.048-51.877-9.575-77.914c-0.959-9.884-3.559-23.587,1.428-32.763 c4.663-8.58,16.733-2.93,23.147,0.059C-38.62-112.577-17.134-97.54,4.798-84.302C27.301-70.718,50.062-57.58,73.061-44.854 c22.391,12.388,46.654,23.348,67.172,38.761c6.027,4.527,14.451,11.91,8.213,19.673c-6.805,8.47-19.33,12.923-28.982,17.201 C71.718,51.945,23.312,71.264-23.969,93.529c-12.29,5.787-24.541,11.68-37.021,17.052c-8.778,3.778-21.305,10.56-31.182,8.038 c-9.359-2.388-7.11-16.388-6.161-23.287c1.763-12.812,4.948-25.448,7.961-38.009C-78.096,6.168-67.404-45.129-57.173-96.724 c2.436-12.282,4.609-25.026,9.07-36.771c2.897-7.627,7.612-15.551,16.733-11.468c10.407,4.659,18.644,15.688,26.03,24.029 c8.854,9.999,17.419,20.254,26.073,30.426c16.919,19.886,34.087,39.552,51.703,58.825c17.59,19.245,36.034,37.794,53.015,57.583 c5.714,6.658,16.635,17.212,15.683,26.955c-0.923,9.45-16.49,10.989-23.422,12.054c-25.464,3.909-51.485,4.65-77.144,6.74 c-26.169,2.131-52.28,4.842-78.35,7.952c-13.166,1.57-26.314,3.28-39.489,4.773c-12.307,1.395-25.206,3.348-37.598,2.146 c-8.786-0.852-15.139-4.495-13.172-14.148c2.347-11.518,9.905-22.458,15.856-32.41C-98.72,17.451-84.534-4.621-71.089-27.147 C-57.79-49.43-45.06-72.034-32.448-94.711c6.445-11.59,12.785-23.279,19.824-34.524c4.255-6.799,11.543-21.135,21.072-21.485 c9.4-0.345,15.395,14.792,18.568,21.433c5.636,11.793,10.484,23.958,15.406,36.06c9.814,24.13,19.689,48.229,30.186,72.073 c10.68,24.259,22.146,48.155,32.965,72.35c5.392,12.057,25.718,48.334-0.183,48.642c-12.265,0.146-24.777-3.355-36.634-6.16 c-13.059-3.088-26.06-6.422-39.09-9.629C4.193,77.779-21.371,71.92-47.057,66.592c-24.988-5.184-50.388-9.169-75.061-15.735 c-7.17-1.908-23.115-4.943-24.348-14.401c-1.221-9.373,11.488-19.214,17.358-24.649C-110.125-5.77-89.65-21.758-70-38.576 C-50.123-55.589-30.609-73.01-11.36-90.73c9.867-9.083,19.659-18.255,29.672-27.179c8.716-7.768,18.024-17.157,28.981-21.634 c21.08-8.614,20.143,36.614,21.017,48.065C72.308-39.089,76.462,13.09,82.452,65.301c1.475,12.858,3.111,25.78,3.524,38.728 c0.229,7.168,1.471,22.056-7.72,24.687c-9.298,2.662-21.884-6.217-29.395-10.541c-11.84-6.816-23.353-14.194-34.909-21.475 C-30.162,68.906-75.625,43.716-120.46,17.161c-9.354-5.54-21.311-11.461-27.741-20.519c-5.785-8.148,0.904-14.275,7.876-18.604 c21.599-13.41,47.476-21.05,70.955-30.505C-45-62.28-20.798-72.498,3.18-83.236c23.436-10.495,46.592-22.583,70.889-30.975 c6.778-2.341,20.021-7.499,24.81,0.854c4.918,8.578,0.297,22.958-1.614,31.809c-5.525,25.586-12.734,50.82-18.934,76.25 C72.157,20.025,66.607,45.49,61.342,71.016c-2.696,13.073-5.271,26.178-8.273,39.185c-2.417,10.469-4.331,24.035-11.35,32.566 c-6.345,7.712-14.611,1.954-20.547-3.269c-9.473-8.335-17.513-18.44-25.581-28.094c-16.755-20.045-33.242-40.307-50.343-60.062 C-71.925,31.505-89.61,12.138-107.218-7.311c-8.609-9.509-17.458-18.984-25.051-29.344c-4.277-5.835-12.44-16.477-5.437-23.21 c7.3-7.018,22.105-6.939,31.505-7.848c13.439-1.299,26.941-1.985,40.416-2.805c25.883-1.574,51.741-3.417,77.56-5.841 c26.073-2.448,52.062-5.882,78.16-8.038c10.394-0.858,24.089-3.252,33.921,1.23c9.046,4.125,5.08,14.469,1.922,21.423 c-10.655,23.458-26.771,44.825-40.51,66.539C71.215,27.009,57.584,49.478,44.381,72.205c-12.93,22.255-24.532,46.079-40.035,66.691 c-4.339,5.77-12.094,15.635-20.099,9.893c-8.771-6.292-13.048-19.593-17.085-29.121C-53.14,71.747-71.209,23.024-92.433-24.539 c-5.546-12.429-11.232-24.812-16.374-37.417c-3.664-8.981-10.63-22.064-8.061-32.071c2.428-9.454,15.236-7.448,22.453-6.391 c12.787,1.873,25.372,5.372,37.859,8.622C-5.63-78.541,45.411-66.631,96.821-55.427c12.298,2.68,24.93,5.181,36.716,9.692 c7.251,2.775,16.429,7.626,12.302,16.726c-4.627,10.202-15.393,18.094-23.718,25.185c-10.302,8.773-20.85,17.255-31.336,25.804 C50.276,55.005,12.374,90.949-27.771,124.346c-6.78,5.641-17.68,16.575-27.426,15.742c-9.544-0.815-10.923-15.452-11.929-22.544 c-3.648-25.715-3.719-52.035-5.303-77.936c-1.602-26.211-3.764-52.378-6.344-78.511c-1.306-13.224-2.745-26.435-3.982-39.666 c-1.16-12.398-2.849-25.381-1.445-37.817c0.984-8.711,4.616-15.236,14.264-13.137c11.411,2.482,22.173,10.249,31.936,16.353 c22.511,14.075,44.561,28.876,67.074,42.952c21.792,13.625,43.932,26.672,66.135,39.614c11.412,6.652,22.922,13.203,33.986,20.427 c6.794,4.436,20.994,11.977,21.319,21.558c0.319,9.383-14.882,15.102-21.524,18.123c-11.854,5.395-24.072,9.981-36.229,14.641 C68.46,53.458,44.184,62.821,20.154,72.822c-24.319,10.123-48.313,20.983-72.55,31.294c-11.869,5.05-48.945,25.143-49.561,0.039 c-0.292-11.937,3.568-24.358,6.52-35.821c3.349-13.006,6.94-25.947,10.414-38.92c6.78-25.318,13.204-50.725,19.049-76.277 c5.751-25.139,10.402-50.654,17.387-75.487c2.018-7.174,5.308-23.242,14.623-24.753c9.342-1.516,18.962,11.295,24.229,17.168 c17.229,19.211,32.731,40.011,49.09,59.96C55.957-49.727,72.992-29.85,90.321-10.222c8.868,10.044,17.826,20.013,26.557,30.178 c7.605,8.855,16.437,18.171,21.184,28.962c9.672,21.988-33.718,20.417-45.792,21.107C39.896,73.018-12.296,75.934-64.538,80.882 c-12.848,1.217-25.721,2.522-38.627,2.913c-7.194,0.218-23.163,1.705-26.716-6.959c-3.583-8.735,5.399-21.371,9.543-28.369 c6.876-11.612,14.396-22.841,21.815-34.109c28.707-43.602,55.108-88.423,82.413-132.886c6.005-9.778,12.152-21.076,21.084-28.499 c7.582-6.301,13.921-2.093,18.632,5.236c6.647,10.342,10.884,22.41,15.286,33.827c4.789,12.42,9.385,24.915,14.096,37.365 C62.279-46.046,71.97-21.653,82.171,2.535c9.944,23.579,21.199,46.837,29.572,71.035c2.312,6.684,8.415,21.412,0.691,26.908 c-7.841,5.58-22.24,0.866-30.559-1.04C56.621,93.652,31.803,85.896,6.77,79.234c-25.262-6.724-50.663-12.879-76.149-18.692 c-13.115-2.991-26.262-5.859-39.322-9.085c-11.079-2.737-23.992-5.059-33.533-11.639c-18.328-12.639,20.38-37.99,29.172-45.064 c20.55-16.536,41.35-32.747,61.672-49.567c20.14-16.669,39.809-33.881,59.518-51.055c9.633-8.394,19.24-16.967,29.592-24.477 c5.798-4.206,17.141-13.23,24.273-6.804c7.339,6.612,7.07,22.072,7.756,30.998c1.032,13.435,1.484,26.91,2.03,40.371 c1.049,25.854,2.322,51.692,4.208,77.499c1.924,26.344,4.777,52.619,6.508,78.975c0.708,10.782,2.562,23.975-1.615,34.242 c-3.763,9.248-13.848,5.745-20.803,2.491c-23.16-10.834-44.058-27.359-65.316-41.423c-21.918-14.5-44.074-28.629-66.525-42.291 c-22.144-13.475-45.795-25.676-66.356-41.534c-5.807-4.479-15.902-12.208-10.661-20.477c5.592-8.822,19.838-12.942,28.964-16.622 c48.258-19.46,97.408-36.389,145.385-56.641c12.544-5.295,25.047-10.716,37.742-15.644c9.521-3.696,22.021-9.888,32.504-7.848 c9.642,1.875,7.794,14.569,6.668,21.641c-2.031,12.753-5.767,25.266-9.261,37.676C79.01-5.258,66.03,45.334,53.834,96.333 c-2.979,12.453-5.726,25.257-10.448,37.193c-2.837,7.17-7.536,16.887-16.763,13.141c-10.122-4.109-17.965-15.606-24.678-23.766 c-8.696-10.569-17.037-21.43-25.47-32.209c-32.029-40.938-66.958-79.377-99.396-119.931c-5.922-7.403-16.26-18.017-16.037-28.254 c0.208-9.601,14.781-10.973,21.667-11.858c25.613-3.293,51.825-2.756,77.599-3.801c26.25-1.064,52.469-2.652,78.661-4.696 c25.312-1.975,52.147-6.797,77.521-4.153c8.308,0.866,16.452,3.682,14.695,13.505c-1.989,11.122-10.093,21.781-16.14,31.067 C100.674-15.36,85.507,6.184,71.094,28.228C56.969,49.83,43.357,71.748,29.908,93.776c-7.063,11.567-14.041,23.208-21.59,34.469 c-4.754,7.093-12.249,20.742-21.875,21.946c-9.409,1.178-14.99-13.777-17.871-20.264c-5.184-11.674-9.431-23.77-13.759-35.778 c-8.862-24.588-17.737-49.164-27.257-73.507c-9.587-24.512-19.926-48.71-29.774-73.115c-4.362-10.811-24.863-50.232-1.748-51.526 c11.627-0.65,23.858,3.415,34.955,6.468c13.045,3.59,26.008,7.475,39,11.251c25.125,7.302,50.346,14.26,75.721,20.645 c25.118,6.32,50.579,11.605,75.44,18.889c7.774,2.277,22.935,5.383,26.218,14.215c3.263,8.779-9.475,18.612-14.891,23.372 C113.216,7.767,92.183,22.715,72.013,38.526C51.363,54.714,31.061,71.33,11.028,88.274c-10.249,8.669-20.428,17.423-30.742,26.015 c-9.266,7.718-18.794,16.2-29.625,21.658c-23.57,11.876-21.831-27.988-22.409-41.728c-2.197-52.235-3.609-104.329-7.519-156.489 c-0.983-13.124-2.114-26.277-2.372-39.44c-0.154-7.854-1.862-23.764,6.024-28.967c7.79-5.14,20.885,4.126,27.241,7.943 c11.23,6.745,21.986,14.291,32.774,21.711c43.028,29.6,87.143,57.181,131.17,85.235c10.732,6.839,48.544,26.231,27.992,40.768 c-9.956,7.042-22.406,10.974-33.769,15.134C97.182,44.73,84.48,49.107,71.819,53.589C47.102,62.34,22.542,71.511-1.838,81.163 c-23.788,9.417-47.238,20.104-71.503,28.245c-7.112,2.386-22.04,8.756-28.618,1.945c-6.544-6.774-1.411-22.195,0.452-29.773 c6.162-25.067,14.411-49.635,21.577-74.426c7.27-25.151,13.986-50.451,20.333-75.849c3.292-13.175,6.478-26.379,9.95-39.508 c2.972-11.239,5.632-23.897,12.012-33.771c12.768-19.761,36.598,17.958,43.813,27.282C22.22-93.962,37.861-72.933,54.154-52.397 c16.313,20.561,33.14,40.69,49.979,60.818c8.279,9.896,16.711,19.751,24.228,30.249c4.212,5.883,13.902,17.845,8.107,25.415 c-5.895,7.701-21.866,7.172-30.355,7.718c-13.285,0.854-26.619,0.985-39.925,1.256c-25.794,0.524-51.578,1.229-77.345,2.563 c-26.406,1.367-52.761,3.662-79.17,4.924c-11.234,0.536-24.375,2.079-35.159-1.798c-9.403-3.381-7.275-12.383-3.862-19.744 c10.812-23.322,28.348-44.145,42.917-65.19c14.957-21.606,29.523-43.473,43.656-65.627c13.8-21.632,26.434-44.523,42.201-64.806 c4.413-5.676,12.573-16.898,21.067-12.29c8.83,4.79,12.837,19.382,16.163,28.024C55.465-72.023,71.303-22.126,90.683,26.561 c4.905,12.323,9.935,24.607,14.53,37.052c3.721,10.072,9.562,22.499,8.053,33.485c-1.353,9.848-12.787,8.741-20.156,7.562 c-12.572-2.013-24.88-5.978-37.041-9.651C5.687,79.787-44.751,65.488-95.708,52.31c-12.401-3.207-25.065-6.245-36.999-10.966 c-6.908-2.732-18.039-7.384-14.874-16.722c3.367-9.936,15.283-17.723,23.122-23.945c10.592-8.409,21.478-16.443,32.294-24.559 c41.857-31.406,81.471-65.442,122.75-97.539c7.839-6.096,18.272-15.819,28.754-16.338c9.729-0.482,11.288,12.972,12.154,19.96 c3.167,25.567,1.911,51.841,2.409,77.558c0.509,26.278,1.527,52.538,3.025,78.778c1.451,25.43,5.128,51.728,2.939,77.182 c-0.651,7.571-2.544,18.37-12.435,17.104c-10.88-1.395-21.328-9.626-30.185-15.586C15.397,102.535-5.8,86.874-27.518,71.977 C-48.878,57.325-70.58,43.197-92.405,29.25c-11.403-7.287-22.871-14.491-34.02-22.166c-7.76-5.343-20.193-12.365-23.118-22.018 c-2.794-9.223,10.435-14.75,16.786-17.606c11.647-5.239,23.87-9.229,35.95-13.33c24.772-8.41,49.574-16.711,74.146-25.697 c24.779-9.062,49.274-18.842,73.9-28.306c10.133-3.895,51.825-24.755,54.657-4.21c1.528,11.089-3.024,23.426-6.074,33.95 c-3.75,12.942-7.901,25.767-11.934,38.623C80.082-6.622,72.581,18.357,65.66,43.51c-6.901,25.083-12.773,50.51-20.395,75.386 c-2.683,8.756-5.624,23.301-14.227,28.396c-8.219,4.867-17.693-6.823-22.301-12.036c-16.925-19.154-31.243-40.725-46.557-61.16 c-15.755-21.025-31.929-41.724-48.46-62.144c-12.908-15.945-26.313-31.562-38.485-48.085"; | |
| svg.append("path") | |
| .attr("class", "exampleGlow") | |
| .attr("transform", "translate(" + 0 + "," + 0 + ")scale(" + Math.min(1, width / 1280) + ")") | |
| .attr("d", exampleLine) | |
| .style("fill", "none") | |
| .style("stroke", "#00A0B0"); | |
| d3.selectAll(".exampleGlow") | |
| .style("filter","url(#glow)"); | |
| </script> | |
| </body> | |
| </html> |
