Color Oled(SSD1331) connect to STMicroelectronics Nucleo-F466

Dependencies:   ssd1331

Committer:
kadonotakashi
Date:
Thu Oct 11 02:27:46 2018 +0000
Revision:
3:f3764f852aa8
Parent:
0:8fdf9a60065b
Nucreo 446 + SSD1331 test version;

Who changed what in which revision?

UserRevisionLine numberNew contents of line
kadonotakashi 0:8fdf9a60065b 1 <!DOCTYPE html>
kadonotakashi 0:8fdf9a60065b 2 <html lang="en">
kadonotakashi 0:8fdf9a60065b 3 <head>
kadonotakashi 0:8fdf9a60065b 4 <meta charset="utf-8">
kadonotakashi 0:8fdf9a60065b 5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
kadonotakashi 0:8fdf9a60065b 6 <meta name="viewport" content="width=device-width, initial-scale=1">
kadonotakashi 0:8fdf9a60065b 7
kadonotakashi 0:8fdf9a60065b 8 <link rel="stylesheet" type="text/css"
kadonotakashi 0:8fdf9a60065b 9 href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"
kadonotakashi 0:8fdf9a60065b 10 integrity="sha256-916EbMg70RQy9LHiGkXzG8hSg9EdNy97GazNG/aiY1w="
kadonotakashi 0:8fdf9a60065b 11 crossorigin="anonymous"
kadonotakashi 0:8fdf9a60065b 12 />
kadonotakashi 0:8fdf9a60065b 13 <link rel="stylesheet" type="text/css"
kadonotakashi 0:8fdf9a60065b 14 href="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@1.0.4/dist/d3.flameGraph.min.css"
kadonotakashi 0:8fdf9a60065b 15 integrity="sha256-w762vSe6WGrkVZ7gEOpnn2Y+FSmAGlX77jYj7nhuCyY="
kadonotakashi 0:8fdf9a60065b 16 crossorigin="anonymous"
kadonotakashi 0:8fdf9a60065b 17 />
kadonotakashi 0:8fdf9a60065b 18
kadonotakashi 0:8fdf9a60065b 19 <style>
kadonotakashi 0:8fdf9a60065b 20 /* Space out content a bit */
kadonotakashi 0:8fdf9a60065b 21 body {
kadonotakashi 0:8fdf9a60065b 22 padding-top: 20px;
kadonotakashi 0:8fdf9a60065b 23 padding-bottom: 20px;
kadonotakashi 0:8fdf9a60065b 24 }
kadonotakashi 0:8fdf9a60065b 25 /* Custom page header */
kadonotakashi 0:8fdf9a60065b 26 .header {
kadonotakashi 0:8fdf9a60065b 27 padding-bottom: 20px;
kadonotakashi 0:8fdf9a60065b 28 padding-right: 15px;
kadonotakashi 0:8fdf9a60065b 29 padding-left: 15px;
kadonotakashi 0:8fdf9a60065b 30 border-bottom: 1px solid #e5e5e5;
kadonotakashi 0:8fdf9a60065b 31 }
kadonotakashi 0:8fdf9a60065b 32 /* Make the masthead heading the same height as the navigation */
kadonotakashi 0:8fdf9a60065b 33 .header h3 {
kadonotakashi 0:8fdf9a60065b 34 margin-top: 0;
kadonotakashi 0:8fdf9a60065b 35 margin-bottom: 0;
kadonotakashi 0:8fdf9a60065b 36 line-height: 40px;
kadonotakashi 0:8fdf9a60065b 37 }
kadonotakashi 0:8fdf9a60065b 38 </style>
kadonotakashi 0:8fdf9a60065b 39
kadonotakashi 0:8fdf9a60065b 40 <title>{{name}} Memory Details</title>
kadonotakashi 0:8fdf9a60065b 41
kadonotakashi 0:8fdf9a60065b 42 <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
kadonotakashi 0:8fdf9a60065b 43 <!--[if lt IE 9]>
kadonotakashi 0:8fdf9a60065b 44 <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js" integrity="sha256-4OrICDjBYfKefEbVT7wETRLNFkuq4TJV5WLGvjqpGAk=" crossorigin="anonymous"></script>
kadonotakashi 0:8fdf9a60065b 45 <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js" integrity="sha256-g6iAfvZp+nDQ2TdTR/VVKJf3bGro4ub5fvWSWVRi2NE=" crossorigin="anonymous"></script>
kadonotakashi 0:8fdf9a60065b 46 <![endif]-->
kadonotakashi 0:8fdf9a60065b 47 </head>
kadonotakashi 0:8fdf9a60065b 48 <body>
kadonotakashi 0:8fdf9a60065b 49 <div class="container">
kadonotakashi 0:8fdf9a60065b 50 <div class="header clearfix">
kadonotakashi 0:8fdf9a60065b 51 <h3 class="text-muted">{{name}} Memory Details</h3>
kadonotakashi 0:8fdf9a60065b 52 </div>
kadonotakashi 0:8fdf9a60065b 53 <div id="chart-rom">
kadonotakashi 0:8fdf9a60065b 54 </div>
kadonotakashi 0:8fdf9a60065b 55 <hr/>
kadonotakashi 0:8fdf9a60065b 56 <div id="chart-ram">
kadonotakashi 0:8fdf9a60065b 57 </div>
kadonotakashi 0:8fdf9a60065b 58 <hr/>
kadonotakashi 0:8fdf9a60065b 59 <div id="details"></div>
kadonotakashi 0:8fdf9a60065b 60 </div>
kadonotakashi 0:8fdf9a60065b 61
kadonotakashi 0:8fdf9a60065b 62 <script type="text/javascript"
kadonotakashi 0:8fdf9a60065b 63 src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.10.0/d3.min.js"
kadonotakashi 0:8fdf9a60065b 64 integrity="sha256-r7j1FXNTvPzHR41+V71Jvej6fIq4v4Kzu5ee7J/RitM="
kadonotakashi 0:8fdf9a60065b 65 crossorigin="anonymous">
kadonotakashi 0:8fdf9a60065b 66 </script>
kadonotakashi 0:8fdf9a60065b 67 <script type="text/javascript"
kadonotakashi 0:8fdf9a60065b 68 src="https://cdnjs.cloudflare.com/ajax/libs/d3-tip/0.7.1/d3-tip.min.js"
kadonotakashi 0:8fdf9a60065b 69 integrity="sha256-z0A2CQF8xxCKuOJsn4sJ5HBjxiHHRAfTX8hDF4RSN5s="
kadonotakashi 0:8fdf9a60065b 70 crossorigin="anonymous">
kadonotakashi 0:8fdf9a60065b 71 </script>
kadonotakashi 0:8fdf9a60065b 72 <script type="text/javascript"
kadonotakashi 0:8fdf9a60065b 73 src="https://cdn.jsdelivr.net/gh/spiermar/d3-flame-graph@1.0.4/dist/d3.flameGraph.min.js"
kadonotakashi 0:8fdf9a60065b 74 integrity="sha256-I1CkrWbmjv+GWjgbulJ4i0vbzdrDGfxqdye2qNlhG3Q="
kadonotakashi 0:8fdf9a60065b 75 crossorigin="anonymous">
kadonotakashi 0:8fdf9a60065b 76 </script>
kadonotakashi 0:8fdf9a60065b 77
kadonotakashi 0:8fdf9a60065b 78 <script type="text/javascript">
kadonotakashi 0:8fdf9a60065b 79 var tip = d3.tip()
kadonotakashi 0:8fdf9a60065b 80 .direction("s")
kadonotakashi 0:8fdf9a60065b 81 .offset([8, 0])
kadonotakashi 0:8fdf9a60065b 82 .attr('class', 'd3-flame-graph-tip')
kadonotakashi 0:8fdf9a60065b 83 .html(function(d) { return "module: " + d.data.name + ", bytes: " + d.data.value + ", delta: " + d.data.delta; });
kadonotakashi 0:8fdf9a60065b 84 var colorizer = function (d) {
kadonotakashi 0:8fdf9a60065b 85 if (d.data.delta > 0) {
kadonotakashi 0:8fdf9a60065b 86 ratio = (d.data.value - d.data.delta) / d.data.value;
kadonotakashi 0:8fdf9a60065b 87 green = ("0" + (Number(ratio * 0xFF | 0).toString(16))).slice(-2).toUpperCase();
kadonotakashi 0:8fdf9a60065b 88 blue = ("0" + (Number(ratio * 0xEE | 0).toString(16))).slice(-2).toUpperCase();
kadonotakashi 0:8fdf9a60065b 89 console.log(d.data.name, green, blue);
kadonotakashi 0:8fdf9a60065b 90 return "#EE" + green + blue
kadonotakashi 0:8fdf9a60065b 91 } else if (d.data.delta < 0) {
kadonotakashi 0:8fdf9a60065b 92 ratio = (d.data.value + d.data.delta) / d.data.value;
kadonotakashi 0:8fdf9a60065b 93 green = ("0" + (Number(ratio * 0xFF | 0).toString(16))).slice(-2).toUpperCase();
kadonotakashi 0:8fdf9a60065b 94 red = ("0" + (Number(ratio * 0xFF | 0).toString(16))).slice(-2).toUpperCase();
kadonotakashi 0:8fdf9a60065b 95 console.log(d.data.name, red, green);
kadonotakashi 0:8fdf9a60065b 96 return "#" + red + green + "EE";
kadonotakashi 0:8fdf9a60065b 97 } else {
kadonotakashi 0:8fdf9a60065b 98 return "#FFFFEE";
kadonotakashi 0:8fdf9a60065b 99 }
kadonotakashi 0:8fdf9a60065b 100 }
kadonotakashi 0:8fdf9a60065b 101 var flameGraph_rom = d3.flameGraph()
kadonotakashi 0:8fdf9a60065b 102 .transitionDuration(250)
kadonotakashi 0:8fdf9a60065b 103 .transitionEase(d3.easeCubic)
kadonotakashi 0:8fdf9a60065b 104 .sort(true)
kadonotakashi 0:8fdf9a60065b 105 .color(colorizer)
kadonotakashi 0:8fdf9a60065b 106 .tooltip(tip);
kadonotakashi 0:8fdf9a60065b 107 var flameGraph_ram = d3.flameGraph()
kadonotakashi 0:8fdf9a60065b 108 .transitionDuration(250)
kadonotakashi 0:8fdf9a60065b 109 .transitionEase(d3.easeCubic)
kadonotakashi 0:8fdf9a60065b 110 .sort(true)
kadonotakashi 0:8fdf9a60065b 111 .color(colorizer)
kadonotakashi 0:8fdf9a60065b 112 .tooltip(tip);
kadonotakashi 0:8fdf9a60065b 113 var rom_elem = d3.select("#chart-rom");
kadonotakashi 0:8fdf9a60065b 114 flameGraph_rom.width(rom_elem.node().getBoundingClientRect().width);
kadonotakashi 0:8fdf9a60065b 115 rom_elem.datum({{rom}}).call(flameGraph_rom);
kadonotakashi 0:8fdf9a60065b 116 var ram_elem = d3.select("#chart-ram");
kadonotakashi 0:8fdf9a60065b 117 flameGraph_ram.width(ram_elem.node().getBoundingClientRect().width);
kadonotakashi 0:8fdf9a60065b 118 ram_elem.datum({{ram}}).call(flameGraph_ram);
kadonotakashi 0:8fdf9a60065b 119 </script>
kadonotakashi 0:8fdf9a60065b 120 </body>
kadonotakashi 0:8fdf9a60065b 121 </html>
kadonotakashi 0:8fdf9a60065b 122