hi,
https://stackblitz.com/edit/angular-2rrick?file=src/app/app.component.ts
ERROR
Error: Uncaught (in promise): TypeError: Cannot read property 'countries' of undefined
TypeError: Cannot read property 'countries' of undefined
at eval (src/app/app.component.ts:52:72)
d3.json("https://raw.githubusercontent.com/cszang/dendrobox/master/data/world-110m2.json")
.then(function (topology) {
// <---- Renamed it from data to topology
console.log("------>", topology.feature);
g.selectAll('path')
.data(t.feature(topology, topology.feature.countries)
.geometries)
.enter()
.append('path')
.attr('d', path);
console.log("ending json calling1");
});
topology.feature.countries
but feature
is undefined, thus you cant' get countries
from it
hi,
https://stackblitz.com/edit/angular-ce7zwy?file=src/app/app.component.ts
ERROR
Error: Uncaught (in promise): TypeError: Cannot read property 'type' of undefined
TypeError: Cannot read property 'type' of undefined
d3.json("https://raw.githubusercontent.com/cszang/dendrobox/master/data/world-110m2.json")
.then(function (airports) {
// <---- Renamed it from data to topology
//console.log("------>", topology.feature);
g.selectAll('path')
.data(t.feature(airports, airports.objects.airports).features)
//.data(t.feature(topology, topology.objects.countries)
// .geometries)
.enter()
.append('path')
.attr("id", function (d) { return d.id; })
.attr('d', path);
console.log("ending json calling1");
});
airports
doesn't have airports.objects.airports
propertyairports ------>
{type: "Topology", transform: {…}, objects: {…}, arcs: Array(676)}
{arcs:(676) [Array(13), Array(11), Array(21), Array(9), Array(7), Array(13), Array(25), Array(552), Array(5), Array(16), Array(8), Array(10), Array(9), Array(17), Array(30), Array(36), Array(13), Array(9), Array(8), Array(5), Array(5), Array(7), Array(49), Array(224), Array(6), Array(7), Array(8), Array(7), Array(9), Array(7), Array(10), Array(9), Array(9), Array(7), Array(23), Array(7), Array(11), Array(22), Array(6), Array(9), Array(14), Array(32), Array(36), Array(45), Array(13), Array(35), Array(8), Array(3), Array(12), Array(26), Array(27), Array(10), Array(8), Array(12), Array(9), Array(9), Array(14), Array(6), Array(33), Array(9), Array(11), Array(21), Array(16), Array(10), Array(17), Array(9), Array(5), Array(9), Array(7), Array(42), Array(8), Array(9), Array(6), Array(7), Array(12), Array(6), Array(7), Array(11), Array(11), Array(10), Array(37), Array(7), Array(16), Array(9), Array(8), Array(16), Array(33), Array(11), Array(22), Array(4), Array(9), Array(6), Array(9), Array(44), Array(7), Array(8), Array(7), Array(12), Array(20), Array(20), …]
objects:countries:{type: "GeometryCollection", geometries: Array(177)}
land:{type: "MultiPolygon", arcs: Array(127)}
transform:{scale: Array(2), translate: Array(2)}
__proto__:Object
}
So, got a question, maybe a bit out of context, but since I am using Vue.js for the frontend, here it goes:
How can I make a user access my website only via a unique link, without the need for a proper authentication? This link should have an expiration date.
Maybe something like a token in the URL? 🤔🤔
Hello,
I am playing around with a responsive flexbox nav, and a question came to my mind.
There is no way of aligning the image with the red background perfectly with a css command with the navbar easyily?
Is the solution here always fiddling around with the image size manually to get them both to tie in together perfectly, or is the solution to resize the image to a perfect size beforehand and then just insert that?
Here's the pen I'm talking about:´
https://codepen.io/bradley1492/pen/pOQbOb
Edit: Hm now I did it manually by resizing the image but I want to know if there's a smarter way of doing things here?
@eweiss17 oh I think maybe I didn`t formulate the question right, I was thinking about aligning the borders sort of automatically or ssomething not the color.
Like if I have a navbar already, sort of perfectly fit an image into the left area?
a
element of the page flow with position: absolute
it has no possibility to align to its environment.
height: 100%
on the image and don't use position: absolute
for the a
element, it should take the same height as the navbar and adjust the width with width: auto
display: flex
and justify-content: space-between
on the nav
you then get the horizontal layout of the navbar
height: 200px
on the ul would adjust the height of the ul to the height of the navbar
s torn apart now...
Here
s the pen:nav {
display: flex;
justify-content: space-between;
width: 100%;
}
@bradley1492, I added this code and it's working fine. You want it like that?
word-break: break-all;
instead of overflow-wrap: break-word;
- or use both. Sometimes both are needed depending on the layout.
white-space: pre-wrap;
overflow-x: scroll;