导航

    • 注册
    • 登录
    • 搜索
    • 版块
    • 最新
    • 话题
    • 热门
    • 用户
    • 群组
    1. 主页
    2. 梵总
    3. 帖子
    梵
    • 继续与 梵总 聊天
    • 开始与 梵总 的新会话
    • 举报资料
    • block_user
    • 资料
    • 关注
    • 粉丝
    • 主题
    • 帖子
    • 最佳
    • 群组

    梵总 发布的帖子

    • November Rain

      十一月的雨/玫瑰与枪炮
        November Rain/by Gun N Rose
            
        when i look into your eyes当我凝望你的双眼,
        i can see a love restrained我看到的是抑制着的情感。
        but darlin' when i hold you但是,亲爱的,当我拥抱你的时候,
        don't you know i feel the same你知道吗,我也感到同样那般。
            
        'cause nothin' lasts forever因为没有什么可以永恒,
        and we both know hearts can change我们都知道心会改变,
        and it's hard to hold a candle就像在十一月凄冷的雨天,
        in the cold november rain手持一支蜡烛那般艰难。
              
        we've been through this such a long long time我们这样已经很长很长时间,
        just tryin' to kill the pain只是努力想使内心的痛苦消减。
            
        but lovers always come and lovers always go但是情人一个一个地更换,
        an no one's really sure who's lettin' go today没有人肯定地知道
        walking away是否今天是自己该走的一天。
            
        if we could take the time to lay it on the line如果我们能够抓住时间,
        i could rest my head那我就小憩一段,
        just knowin' that you were mine因为知道你属于我,
        all mine只属于我,我再念一遍。
              
        so if you want to love me所以亲爱的,如果你想要爱我 ,
        then darlin' don't refrain就不要压抑自己的情感。
        or i'll just end up walkin'否则我会把我们散步的旅程,
        in the cold november rain结束在这十一月寒雨的今天。
              
        do you need some time...on your own你是否需要一些时间,属于自己的时间,
        do you need some time...all alone你是否需要一些时间,一个人的时间。
        everybody needs some time...on their own每个人都需要一些时间,属于自己的时间,
        don't you know you need some time...all alone你是否知道你也需要时间,一个人的时间。
            
        i know it's hard to keep an open heart在这朋友都可能会伤害你的今天,
        when even friends seem out to harm you我知道打开心扉是多么艰难,
        but if you could heal a broken heart但是你终会治愈那颗破碎的心,
        wouldn't time be out to charm you最终战胜痛苦,因为时间。
            
        sometimes i need some time...on my own有时候我也需要一些时间,属于自己的时间
        sometimes i need some time...all alone有时候我也需要一些时间,一个人的时间,
        everybody needs some time...on their own每个人都需要一些时间,属于自己的时间
        don't you know you need some time...all alone你知道吗,你也需要属于自己的时间,一个人的时间。
        and when your fears subside当你对爱的恐惧渐渐消失的时候,
        and shadows still remain痛苦的阴影仍然闪现。
        i know that you can love me我明白你一定爱我,
        when there's no one left to blame到时候没有人能够去埋怨。
              
        so never mind the darkness所以永远不要介意黑暗,
        we still can find a way因为我们仍然会找到爱的路线。
        'cause nothin' lasts forever因为没有什么会永远不变,
        even cold november rain即使那十一月凄冷的雨天。
            
        don't ya think that you need somebody是否,你觉得需要有一个人,
        don't ya think that you need someone和你一起分担。
        everybody needs somebody因为每个人都需要一个人,
        you're not the only one你不孤单,
        you're not the only one你不孤单。

      发布在 FUN版
      梵
      梵总
    • RE: map with label

      Shape file
      https://www.baruch.cuny.edu/confluence/display/geoportal/ESRI+USA+Data

      Shape to GeoJSON:

      • Tutorial: https://www.statsilk.com/maps/convert-esri-shapefile-map-geojson-format
      • Pay version: https://mygeodata.cloud/converter/shp-to-geojson
      • Best free version: https://mapshaper.org/
        Somehow it does not work well for zip3 shape, but it helps covert large GeoJSON to the smaller version
      发布在 笔记
      梵
      梵总
    • RE: map with label

      Here is the zip level GeoJSON:
      https://github.com/OpenDataDE/State-zip-code-GeoJSON

      Here is the state level GeoJSON:
      https://raw.githubusercontent.com/PublicaMundi/MappingAPI/master/data/geojson/us-states.json

      发布在 笔记
      梵
      梵总
    • Best Quote

      "I tell my kids...think of yourself like a captain, and you've got this little boat. And sometimes the weather's good, and you're just sailing and sometimes big storms hit and..you're in a stormy sea, but just ride it out, ride it out. Because it is good to be alive." Patti Smith

      发布在 笔记
      梵
      梵总
    • Object is not extensible error when creating new attribute for array of objects
      const tableData = this.state.uploadedFiles.map((file) => {
            const url = file.url;
            const filename = file.filename;
            console.log(url);
            file.action = this.deleteButton(file);
            file.downloadUrl = (
              <a href="#" onClick={(e) => this.handleDownload(e, url, filename)}>
                {url}
              </a>
            );
            return file;
          });
      

      Have to create a new object

      const tableData = this.state.uploadedFiles.map((file) => {
            const newFile = Object.assign({}, file);
            const url = file.url;
            const filename = file.filename;
            console.log(url);
            newFile.action = this.deleteButton(file);
            newFile.downloadUrl = (
              <a href="#" onClick={(e) => this.handleDownload(e, url, filename)}>
                {url}
              </a>
            );
            return newFile;
          });
      

      https://stackoverflow.com/questions/45798885/object-is-not-extensible-error-when-creating-new-attribute-for-array-of-objects

      发布在 笔记
      梵
      梵总
    • shallow copy vs deep copy

      https://stackoverflow.com/questions/122102/what-is-the-most-efficient-way-to-deep-clone-an-object-in-javascript

      发布在 笔记
      梵
      梵总
    • d3 with react

      https://medium.com/@varvara.munday/d3-in-react-a-step-by-step-tutorial-cba33ce000ce
      https://d3-annotation.susielu.com/#introduction
      https://github.com/susielu/d3-annotation/issues/57
      https://www.npmjs.com/package/d3v4

      发布在 笔记
      梵
      梵总
    • RE: map with label

      https://www.d3-graph-gallery.com/graph/custom_annotation.html

      发布在 笔记
      梵
      梵总
    • map with label
      <!DOCTYPE html>
      <html lang="en">
        <head>
          <meta charset="utf-8" />
          <script src="https://d3js.org/d3.v4.min.js"></script>
          <script src="https://rawgit.com/susielu/d3-annotation/master/d3-annotation.min.js"></script>
          <script
            src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js"
            integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww=="
            crossorigin="anonymous"
          ></script>
          <style type="text/css">
            /* On mouse hover, lighten state color */
            /* path:hover {
              fill-opacity: 0.7;
            } */
      
            div.markets {
              fill-opacity: 0.8;
            }
      
            /* Style for Custom Tooltip */
            div.tooltip {
              position: absolute;
              text-align: center;
              width: 60px;
              height: 28px;
              padding: 2px;
              font: 12px sans-serif;
              background: white;
              border: 0px;
              border-radius: 8px;
              pointer-events: none;
            }
      
            /* Legend Font Style */
            body {
              font: 11px sans-serif;
            }
      
            /* Legend Position Style */
            .legend {
              position: absolute;
              left: 800px;
              top: 350px;
            }
          </style>
        </head>
        <body>
          <button id="select-vq">VQ Markets</button>
          <button id="select-wtw">WTW Markets</button>
          <button id="select-aon">AON Markets</button>
          <button id="select-mercer">MERCER Markets</button>
          <button id="hide-markets">Hide Markets</button>
      
          <script type="text/javascript">
            /*  This visualization was made possible by modifying code provided by:
      
                  Scott Murray, Choropleth example from "Interactive Data Visualization for the Web"
                  https://github.com/alignedleft/d3-book/blob/master/chapter_12/05_choropleth.html
      
                  Malcolm Maclean, tooltips example tutorial
                  http://www.d3noob.org/2013/01/adding-tooltips-to-d3js-graph.html
      
                  Mike Bostock, Pie Chart Legend
                  http://bl.ocks.org/mbostock/3888852  */
      
            "use strict";
      
            //Width and height of map
            var width = 960;
            var height = 500; // D3 Projection
      
            var projection = d3
              .geoAlbersUsa()
              // .albersUsa()
              .translate([width / 2, height / 2]) // translate to center of screen
              .scale([1000]); // scale things down so see entire US
            // Define path generator
      
            var path = d3
              .geoPath() // path generator that will convert GeoJSON to SVG paths
              .projection(projection); // tell path generator to use albersUsa projection
            // Define linear scale for output
      
            var color = d3
              .scaleLinear()
              .range([
                "rgb(213,222,217)",
                "rgb(69,173,168)",
                "rgb(84,36,55)",
                "rgb(217,91,67)",
              ]);
            var legendText = [
              "Cities Lived",
              "States Lived",
              "States Visited",
              "Nada",
            ]; //Create SVG element and append map to the SVG
      
            var svg = d3
              .select("body")
              .append("svg")
              .attr("width", width)
              .attr("height", height); // Append Div for tooltip to SVG
      
            var div = d3
              .select("body")
              .append("div")
              .attr("class", "tooltip")
              .style("opacity", 0);
            var layer1 = svg.append("g");
            var layer2 = svg.append("g");
            var layer3 = svg.append("g"); // Load GeoJSON data and merge with states data
      
            var offsets = {
              VT: [0, 50],
              NH: [15, 35],
              MA: [20, 25],
              RI: [28, 20],
              CT: [35, 10],
              NJ: [34, 20],
              DE: [33, 30],
              MD: [47, 35],
              DC: [49, 21],
            };
      
            d3.json("us-states-abbr.json", function (statejson) {
              layer1
                .selectAll("path")
                .data(statejson.features)
                .enter()
                .append("path")
                .attr("d", path)
                .style("stroke", "#cc0000")
                .style("stroke-width", "1")
                .style("fill", "none");
      
              var smalllStates = statejson.features.filter((item) =>
                _.has(offsets, item.properties.abbr)
              );
      
              smalllStates.forEach((item) => {
                var x = path.centroid(item)[0];
                var y = path.centroid(item)[1];
      
                var abbr = item.properties.abbr;
      
                var offset = offsets[abbr];
      
                var annotations = [
                  {
                    note: {
                      label: abbr,
                    },
                    x: x,
                    y: y,
                    dy: offset[0],
                    dx: offset[1],
                  },
                ];
      
                // Add annotation to the chart
                const makeAnnotations = d3.annotation().annotations(annotations);
                svg.append("g").call(makeAnnotations);
              });
      
              var bigStates = statejson.features.filter(
                (item) => !_.has(offsets, item.properties.abbr)
              );
      
              svg
                .append("g")
                .attr("class", "states-names")
                .selectAll("text")
                .data(bigStates)
                .enter()
                .append("svg:text")
                .text(function (d) {
                  return d.properties.abbr;
                })
                .attr("x", function (d) {
                  console.log(path.centroid(d));
                  return path.centroid(d)[0];
                })
                .attr("y", function (d) {
                  return path.centroid(d)[1];
                })
                .attr("text-anchor", "middle")
                .attr("fill", "black");
            });
      
            // const annotations = [
            //   {
            //     note: {
            //       label: "Here is the annotation label",
            //       title: "Annotation title",
            //     },
            //     x: 562,
            //     y: 143,
            //     dy: 200,
            //     dx: 200,
            //   },
            // ];
      
            // // Add annotation to the chart
            // const makeAnnotations = d3.annotation().annotations(annotations);
            // svg.append("g").call(makeAnnotations);
      
            var items = ["#cc0000", "#00cc00", "#0000cc"];
            // d3.json("mercerMarkets.json", function (vqs) {
            //   vqs.forEach(function (vq) {
            //     var nlayer = svg.append("g").attr("class", "markets");
            //     // var color = items[Math.floor(Math.random() * items.length)];
            //     var color = vq.color;
            //     var file = vq.file;
            //     d3.json(file, function (json) {
            //       var features = [json];
            //       nlayer
            //         .selectAll("path")
            //         .data(features)
            //         .enter()
            //         .append("path")
            //         .attr("class", "markets")
            //         .attr("d", path)
            //         .style("stroke", "#ccc")
            //         .style("stroke-width", "1")
            //         .style("fill", color)
            //         .style("opacity", "0.8");
            //     });
            //   });
            // });
            document
              .getElementById("select-vq")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("vqMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
      
            document
              .getElementById("hide-markets")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
              });
            document
              .getElementById("select-wtw")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("wtwMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
      
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
      
            document
              .getElementById("select-aon")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("aonMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
      
            document
              .getElementById("select-mercer")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("mercerMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
          </script>
        </body>
      </html>
      
      发布在 笔记
      梵
      梵总
    • What
      <!DOCTYPE html>
      <html lang="en">
        <head>
          <meta charset="utf-8" />
          <script src="https://d3js.org/d3.v4.min.js"></script>
          <script src="https://rawgit.com/susielu/d3-annotation/master/d3-annotation.min.js"></script>
          <script
            src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js"
            integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww=="
            crossorigin="anonymous"
          ></script>
          <style type="text/css">
            /* On mouse hover, lighten state color */
            /* path:hover {
              fill-opacity: 0.7;
            } */
      
            div.markets {
              fill-opacity: 0.8;
            }
      
            /* Style for Custom Tooltip */
            div.tooltip {
              position: absolute;
              text-align: center;
              width: 60px;
              height: 28px;
              padding: 2px;
              font: 12px sans-serif;
              background: white;
              border: 0px;
              border-radius: 8px;
              pointer-events: none;
            }
      
            /* Legend Font Style */
            body {
              font: 11px sans-serif;
            }
      
            /* Legend Position Style */
            .legend {
              position: absolute;
              left: 800px;
              top: 350px;
            }
          </style>
        </head>
        <body>
          <button id="select-vq">VQ Markets</button>
          <button id="select-wtw">WTW Markets</button>
          <button id="select-aon">AON Markets</button>
          <button id="select-mercer">MERCER Markets</button>
          <button id="hide-markets">Hide Markets</button>
      
          <script type="text/javascript">
            /*  This visualization was made possible by modifying code provided by:
      
                  Scott Murray, Choropleth example from "Interactive Data Visualization for the Web"
                  https://github.com/alignedleft/d3-book/blob/master/chapter_12/05_choropleth.html
      
                  Malcolm Maclean, tooltips example tutorial
                  http://www.d3noob.org/2013/01/adding-tooltips-to-d3js-graph.html
      
                  Mike Bostock, Pie Chart Legend
                  http://bl.ocks.org/mbostock/3888852  */
      
            "use strict";
      
            //Width and height of map
            var width = 960;
            var height = 500; // D3 Projection
      
            var projection = d3
              .geoAlbersUsa()
              // .albersUsa()
              .translate([width / 2, height / 2]) // translate to center of screen
              .scale([1000]); // scale things down so see entire US
            // Define path generator
      
            var path = d3
              .geoPath() // path generator that will convert GeoJSON to SVG paths
              .projection(projection); // tell path generator to use albersUsa projection
            // Define linear scale for output
      
            var color = d3
              .scaleLinear()
              .range([
                "rgb(213,222,217)",
                "rgb(69,173,168)",
                "rgb(84,36,55)",
                "rgb(217,91,67)",
              ]);
            var legendText = [
              "Cities Lived",
              "States Lived",
              "States Visited",
              "Nada",
            ]; //Create SVG element and append map to the SVG
      
            var svg = d3
              .select("body")
              .append("svg")
              .attr("width", width)
              .attr("height", height); // Append Div for tooltip to SVG
      
            var div = d3
              .select("body")
              .append("div")
              .attr("class", "tooltip")
              .style("opacity", 0);
            var layer1 = svg.append("g");
            var layer2 = svg.append("g");
            var layer3 = svg.append("g"); // Load GeoJSON data and merge with states data
      
            var offsets = {
              VT: [0, 50],
              NH: [15, 35],
              MA: [20, 25],
              RI: [28, 20],
              CT: [35, 10],
              NJ: [34, 20],
              DE: [33, 30],
              MD: [47, 35],
              DC: [49, 21],
            };
      
            d3.json("us-states-abbr.json", function (statejson) {
              layer1
                .selectAll("path")
                .data(statejson.features)
                .enter()
                .append("path")
                .attr("d", path)
                .style("stroke", "#cc0000")
                .style("stroke-width", "1")
                .style("fill", "none");
      
              var smalllStates = statejson.features.filter((item) =>
                _.has(offsets, item.properties.abbr)
              );
      
              smalllStates.forEach((item) => {
                var x = path.centroid(item)[0];
                var y = path.centroid(item)[1];
      
                var abbr = item.properties.abbr;
      
                var offset = offsets[abbr];
      
                var annotations = [
                  {
                    note: {
                      label: abbr,
                    },
                    x: x,
                    y: y,
                    dy: offset[0],
                    dx: offset[1],
                  },
                ];
      
                // Add annotation to the chart
                const makeAnnotations = d3.annotation().annotations(annotations);
                svg.append("g").call(makeAnnotations);
              });
      
              var bigStates = statejson.features.filter(
                (item) => !_.has(offsets, item.properties.abbr)
              );
      
              svg
                .append("g")
                .attr("class", "states-names")
                .selectAll("text")
                .data(bigStates)
                .enter()
                .append("svg:text")
                .text(function (d) {
                  return d.properties.abbr;
                })
                .attr("x", function (d) {
                  console.log(path.centroid(d));
                  return path.centroid(d)[0];
                })
                .attr("y", function (d) {
                  return path.centroid(d)[1];
                })
                .attr("text-anchor", "middle")
                .attr("fill", "black");
            });
      
            // const annotations = [
            //   {
            //     note: {
            //       label: "Here is the annotation label",
            //       title: "Annotation title",
            //     },
            //     x: 562,
            //     y: 143,
            //     dy: 200,
            //     dx: 200,
            //   },
            // ];
      
            // // Add annotation to the chart
            // const makeAnnotations = d3.annotation().annotations(annotations);
            // svg.append("g").call(makeAnnotations);
      
            var items = ["#cc0000", "#00cc00", "#0000cc"];
            // d3.json("mercerMarkets.json", function (vqs) {
            //   vqs.forEach(function (vq) {
            //     var nlayer = svg.append("g").attr("class", "markets");
            //     // var color = items[Math.floor(Math.random() * items.length)];
            //     var color = vq.color;
            //     var file = vq.file;
            //     d3.json(file, function (json) {
            //       var features = [json];
            //       nlayer
            //         .selectAll("path")
            //         .data(features)
            //         .enter()
            //         .append("path")
            //         .attr("class", "markets")
            //         .attr("d", path)
            //         .style("stroke", "#ccc")
            //         .style("stroke-width", "1")
            //         .style("fill", color)
            //         .style("opacity", "0.8");
            //     });
            //   });
            // });
            document
              .getElementById("select-vq")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("vqMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
      
            document
              .getElementById("hide-markets")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
              });
            document
              .getElementById("select-wtw")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("wtwMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
      
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
      
            document
              .getElementById("select-aon")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("aonMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
      
            document
              .getElementById("select-mercer")
              .addEventListener("click", function () {
                svg.selectAll(".markets").remove();
                d3.json("mercerMarkets.json", function (vqs) {
                  vqs.forEach(function (vq) {
                    var nlayer = svg.append("g").attr("class", "markets");
                    var color = vq.color;
                    var file = vq.file;
                    d3.json(file, function (json) {
                      var features = [json];
                      nlayer
                        .selectAll("path")
                        .data(features)
                        .enter()
                        .append("path")
                        .attr("d", path)
                        .style("stroke", "#ccc")
                        .style("stroke-width", "1")
                        .style("fill", color);
                    });
                  });
                });
              });
          </script>
        </body>
      </html>
      
      发布在 笔记
      梵
      梵总
    • pushstate

      componentDidMount() {
      this.login();
      window.history.pushState(null, null, document.URL);
      window.addEventListener('popstate', this.onBack);
      //Ping the server every 31 minutes to see if the session is still alive
      this.interval = setInterval(
      () => this.sessionManager.ping(),
      SESSION_TIMEOUT
      );
      }

      componentWillUnmount() {
      clearInterval(this.interval);
      }

      onBack() {
      if (this.state.selectedNetwork) {
      this.onSelectNetwork(null);
      }
      window.history.pushState(null, null, document.URL);
      }

      发布在 笔记
      梵
      梵总
    • RE: map3

      Start from here for some basic example using D3:
      http://bl.ocks.org/michellechandra/0b2ce4923dc9b5809922

      发布在 笔记
      梵
      梵总
    • RE: map3

      This is amazing website for geoJSON topoJSON, shape and beyond:
      https://mapshaper.org/

      发布在 笔记
      梵
      梵总
    • map3
      var items = [
         '#cc0000','#00cc00', '#0000cc'
      ];
      
      
      for(var i=0; i < 100; i++ ) {
      
      	let nlayer = svg.append('g');
      
      	let color = items[Math.floor(Math.random() * items.length)];
      	if (i<10){
      		j = "00" + i;
      	}
      	else {
      		j = "0" + i;
      	}
      
      	console.log(j, color);
      	d3.json("https://api.deniapps.com/zip3?zip3="+j, function(json) {
      	const features = json.data;
      	nlayer.selectAll("path")
      	.data(features)
      	.enter()
      	.append("path")
      	.attr("d", path)
      	.style("stroke", "#ccc")
      	.style("stroke-width", "1")
      	.style("fill", color)
      
      });
      
      }
      
      发布在 笔记
      梵
      梵总
    • 说清楚awaitRefetchQueries是什么意思?

      https://egghead.io/lessons/react-update-data-using-the-apollo-mutation-component

      发布在 笔记
      梵
      梵总
    • 迷失的世界

      独裁世界,我们被洗脑。
      然而有观点,必然有偏见。
      自由世界里,虽然我们可以听到两种声音,但是谁对谁错,依然使我们困惑和迷失!

      发布在 笔记
      梵
      梵总
    • How to reset origin/master to a commit
      git checkout master
      git reset --hard e3f1e37
      git push --force origin master
      # Then to prove it (it won't print any diff)
      git diff master..origin/master
      
      发布在 笔记
      梵
      梵总
    • move localstorage to httpOnly Cookie

      https://maxschmitt.me/posts/next-js-http-only-cookie-auth-tokens/

      发布在 笔记
      梵
      梵总
    • 丧亲手册

      http://www.med.umich.edu/pdf/grief/ChineseBereavementBook.pdf

      发布在 笔记
      梵
      梵总
    • Probably the best place to learn GraphQL

      https://www.howtographql.com/

      发布在 笔记
      梵
      梵总