<commit_before># seisplotjs-waveformplot
Plotting seismic data in miniseed format using d3

A [gist is here](https://gist.github.com/crotwell/27eadb025d22c21b9098f4aeb7d72316)
that can be viewed at [bl.ocks.org](http://bl.ocks.org/crotwell/27eadb025d22c21b9098f4aeb7d72316)

Example:

This is for simple usage in a web page. For more complex cases you should probably just use npm with

```
npm install seisplotjs-waveformplot
```

Create html with a div tag with the parameters and a class, in test.html. Also put a script tag at the end of the body. Note, it needs to be at the end so that we are sure the DOM has been loaded before the javascript runs.

```html
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8" />
   <link rel="stylesheet" href="style.css">
</head>
<body>
<div class='myseisplot' net='CO' sta='JSC' loc='00' chan='HHZ' duration='360'>
</div>

<!-- important that this script element is at the end so the DOM exists before it runs. -->
<!-- older browsers ( and maybe current ones) may need to polyfill. -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.26.0/polyfill.min.js"></script>
<script src="https://github.com/crotwell/seisplotjs-waveformplot/releases/download/v1.2.3/seisplotjs-waveformplot-1.2.3_standalone.js"></script>
<script>
    seisplotjs_waveformplot.createPlotsBySelector('div.myseisplot');
</script>
</body>
</html>

You must set CSS stroke and fill for the path.seisplot elements
in order for the seismogram to display properly. You may also want to set
the height style. The plots are in SVG and so there are many styling attributes you
can apply. In style.css:
<commit_msg>update script link to USC instead of github<commit_after># seisplotjs-waveformplot
Plotting seismic data in miniseed format using d3

A [gist is here](https://gist.github.com/crotwell/27eadb025d22c21b9098f4aeb7d72316)
that can be viewed at [bl.ocks.org](http://bl.ocks.org/crotwell/27eadb025d22c21b9098f4aeb7d72316)

Example:

This is for simple usage in a web page. For more complex cases you should probably just use npm with

```
npm install seisplotjs-waveformplot
```

Create html with a div tag with the parameters and a class, in test.html. Also put a script tag at the end of the body. Note, it needs to be at the end so that we are sure the DOM has been loaded before the javascript runs.

```html
<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8" />
   <link rel="stylesheet" href="style.css">
</head>
<body>
<div class='myseisplot' net='CO' sta='JSC' loc='00' chan='HHZ' duration='360'>
</div>

<!-- important that this script element is at the end so the DOM exists before it runs. -->
<!-- older browsers ( and maybe current ones) may need to polyfill. -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/6.26.0/polyfill.min.js"></script>
<script src="http://www.seis.sc.edu/~crotwell/seisplotjs_demo/seisplotjs-waveformplot/example/seisplotjs_waveformplot_1.2.3_standalone.js"></script>
<script>
    seisplotjs_waveformplot.createPlotsBySelector('div.myseisplot');
</script>
</body>
</html>

You must set CSS stroke and fill for the path.seisplot elements
in order for the seismogram to display properly. You may also want to set
the height style. The plots are in SVG and so there are many styling attributes you
can apply. In style.css:

{'fraction_non_alphanumeric': 0.11437125748502994, 'fraction_numerical': 0.03323353293413173, 'mean_word_length': 4.57762938230384, 'pattern_counts': {'":': 0, '<': 41, '<?xml version=': 0, '>': 41, 'https://': 5, 'lorem ipsum': 0, 'www.': 1, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 1, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3031553', 'n_tokens_mistral': 1194, 'n_tokens_neox': 1100, 'n_words': 391}