    <div class="row">
        <div class="col-12">
            <pre class="with-hljs"><code class="lang-html">&lt;!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.01//EN&quot; &quot;http://www.w3.org/TR/html4/strict.dtd&quot;&gt;
&lt;html&gt;
    
    &lt;head&gt;
        &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot;&gt;
        &lt;title&gt;amCharts examples&lt;/title&gt;
        &lt;link rel=&quot;stylesheet&quot; href=&quot;style.css&quot; type=&quot;text/css&quot;&gt;
        &lt;script src=&quot;../amcharts/amcharts.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;
        &lt;script src=&quot;../amcharts/xy.js&quot; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;
        
        &lt;script type=&quot;text/javascript&quot;&gt;
            var chart = AmCharts.makeChart(&quot;chartdiv&quot;, {
                type:&quot;xy&quot;,
                dataProvider: [{
                    &quot;y&quot;: 10,
                        &quot;x&quot;: 14,
                        &quot;value&quot;: 59,
                        &quot;y2&quot;: -5,
                        &quot;x2&quot;: -3,
                        &quot;value2&quot;: 44
                }, {
                    &quot;y&quot;: 5,
                        &quot;x&quot;: 3,
                        &quot;value&quot;: 50,
                        &quot;y2&quot;: -15,
                        &quot;x2&quot;: -8,
                        &quot;value2&quot;: 12
                }, {
                    &quot;y&quot;: -10,
                        &quot;x&quot;: -3,
                        &quot;value&quot;: 19,
                        &quot;y2&quot;: -4,
                        &quot;x2&quot;: 6,
                        &quot;value2&quot;: 35
                }, {
                    &quot;y&quot;: -6,
                        &quot;x&quot;: 5,
                        &quot;value&quot;: 65,
                        &quot;y2&quot;: -5,
                        &quot;x2&quot;: -6,
                        &quot;value2&quot;: 168
                }, {
                    &quot;y&quot;: 15,
                        &quot;x&quot;: -4,
                        &quot;value&quot;: 92,
                        &quot;y2&quot;: -10,
                        &quot;x2&quot;: -8,
                        &quot;value2&quot;: 102
                }, {
                    &quot;y&quot;: 13,
                        &quot;x&quot;: 1,
                        &quot;value&quot;: 8,
                        &quot;y2&quot;: -2,
                        &quot;x2&quot;: -3,
                        &quot;value2&quot;: 41
                }, {
                    &quot;y&quot;: 1,
                        &quot;x&quot;: 6,
                        &quot;value&quot;: 35,
                        &quot;y2&quot;: 0,
                        &quot;x2&quot;: -3,
                        &quot;value2&quot;: 16
                }],
                pathToImages: &quot;../amcharts/images/&quot;,
                startDuration: 1.5,
            
                valueAxes: [{
                    position: &quot;bottom&quot;,
                    axisAlpha: 0,
                    minMaxMultiplayer: 1.2
                }, {
                    position: &quot;left&quot;,
                    axisAlpha: 0,
                    minMaxMultiplayer: 1.2
                }],
            
                graphs: [{
                    valueField: &quot;value&quot;,
                    xField: &quot;x&quot;,
                    yField: &quot;y&quot;,
                    lineAlpha: 0,
                    bullet: &quot;bubble&quot;,
                    lineColor: &quot;#b0de09&quot;,
                    balloonText: &quot;x:&lt;b&gt;[[x]]&lt;/b&gt; y:&lt;b&gt;[[y]]&lt;/b&gt;&lt;br&gt;value:&lt;b&gt;[[value]]&lt;/b&gt;&quot;
                }, {
                    valueField: &quot;value2&quot;,
                    xField: &quot;x2&quot;,
                    yField: &quot;y2&quot;,
                    lineAlpha: 0,
                    bullet: &quot;bubble&quot;,
                    lineColor: &quot;#fcd202&quot;,
                    balloonText: &quot;x:&lt;b&gt;[[x]]&lt;/b&gt; y:&lt;b&gt;[[y]]&lt;/b&gt;&lt;br&gt;value:&lt;b&gt;[[value]]&lt;/b&gt;&quot;
                }],
                chartCursor: {},
                chartScrollbar: {}
            
            });
       
        &lt;/script&gt;
    &lt;/head&gt;
    
    &lt;body&gt;
        &lt;div id=&quot;chartdiv&quot; style=&quot;width: 600px; height: 400px;&quot;&gt;&lt;/div&gt;
    &lt;/body&gt;

&lt;/html&gt;</code></pre>        </div>
    </div>