From d96e6fbfb63fdbe675b675acf98fe50535bc4365 Mon Sep 17 00:00:00 2001 From: neocarto Date: Wed, 4 Dec 2024 15:25:51 +0100 Subject: [PATCH] update projection system --- docs/container_create.js.html | 10 ++-- docs/container_draw.js.html | 4 +- docs/container_render.js.html | 4 +- docs/data/search.json | 2 +- docs/effect_blur.js.html | 4 +- docs/effect_clippath.js.html | 4 +- docs/effect_radialgradient.js.html | 4 +- docs/effect_shadow.js.html | 4 +- docs/global.html | 10 ++-- docs/grid_arbitrary.js.html | 4 +- docs/grid_count.js.html | 53 +++++++++++++++++++ docs/grid_diamond.js.html | 4 +- docs/grid_dot.js.html | 4 +- docs/grid_h3.js.html | 4 +- docs/grid_hexbin.js.html | 4 +- docs/grid_intersect.js.html | 73 +++++++++++++++++++++++++++ docs/grid_make.js.html | 4 +- docs/grid_square.js.html | 4 +- docs/grid_triangle.js.html | 4 +- docs/helpers_tooltip.js.html | 11 ++-- docs/index.html | 4 +- docs/legend_box.js.html | 4 +- docs/legend_choro-horizontal.js.html | 4 +- docs/legend_choro-vertical.js.html | 4 +- docs/legend_circles-half.js.html | 4 +- docs/legend_circles-nested.js.html | 4 +- docs/legend_circles.js.html | 4 +- docs/legend_mushrooms.js.html | 4 +- docs/legend_spikes.js.html | 4 +- docs/legend_squares-nested.js.html | 4 +- docs/legend_squares.js.html | 4 +- docs/legend_symbol-horizontal.js.html | 4 +- docs/legend_symbol-vertical.js.html | 4 +- docs/legend_typo-horizontal.js.html | 4 +- docs/legend_typo-vertical.js.html | 4 +- docs/mark_circle.js.html | 4 +- docs/mark_footer.js.html | 4 +- docs/mark_graticule.js.html | 4 +- docs/mark_halfcircle.js.html | 4 +- docs/mark_header.js.html | 4 +- docs/mark_north.js.html | 4 +- docs/mark_outline.js.html | 4 +- docs/mark_path.js.html | 4 +- docs/mark_scalebar.js.html | 4 +- docs/mark_spike.js.html | 4 +- docs/mark_square.js.html | 4 +- docs/mark_symbol.js.html | 4 +- docs/mark_text.js.html | 4 +- docs/mark_tile.js.html | 4 +- docs/plot_plot.js.html | 4 +- docs/plot_plot_choro.js.html | 4 +- docs/plot_plot_prop.js.html | 4 +- docs/plot_plot_propchoro.js.html | 4 +- docs/plot_plot_proptypo.js.html | 4 +- docs/plot_plot_symbol.js.html | 4 +- docs/plot_plot_typo.js.html | 4 +- docs/tool_addfonts.js.html | 4 +- docs/tool_centroid.js.html | 4 +- docs/tool_choro.js.html | 4 +- docs/tool_dissolve.js.html | 4 +- docs/tool_dodge.js.html | 4 +- docs/tool_dotstogrid.js.html | 4 +- docs/tool_featurecollection.js.html | 4 +- docs/tool_geotable.js.html | 4 +- docs/tool_height.js.html | 4 +- docs/tool_merge.js.html | 4 +- docs/tool_proj4d3.js.html | 4 +- docs/tool_project.js.html | 4 +- docs/tool_radius.js.html | 4 +- docs/tool_random.js.html | 4 +- docs/tool_replicate.js.html | 4 +- docs/tool_rewind.js.html | 4 +- docs/tool_ridge.js.html | 4 +- docs/tool_symbols.js.html | 4 +- docs/tool_typo.js.html | 4 +- docs/tool_unproject.js.html | 4 +- package-lock.json | 24 +++++++++ package.json | 1 + src/container/create.js | 6 ++- src/index.js | 6 +++ src/projection/getproj.js | 25 +++++---- src/projection/stringtod3proj.js | 5 +- 82 files changed, 338 insertions(+), 168 deletions(-) create mode 100644 docs/grid_count.js.html create mode 100644 docs/grid_intersect.js.html diff --git a/docs/container_create.js.html b/docs/container_create.js.html index 4a6d7b7..6e500d7 100644 --- a/docs/container_create.js.html +++ b/docs/container_create.js.html @@ -1,7 +1,8 @@ Source: container/create.js
On this page

container_create.js

import { extent } from "../helpers/extent";
+    
On this page

container_create.js

import { extent } from "../helpers/extent";
 import { unique } from "../helpers/utils";
+import { getproj } from "../projection/getproj";
 import { create as create2 } from "d3-selection";
 import {
   geoPath,
@@ -63,7 +64,7 @@
  * @property {number} [id = "map"] - id of the svg container.
  * @property {number} [height] - height of the container. This value is automatically calculated according to `domain`. But it can be forced by entering a value.
  * @property {object|object[]} [domain] - the domain corresponds to the geographical area to be displayed. It is defined by a geoJSON or an array containing geoJSONs.
- * @property {function|string} [projection] - d3 function of projection. See [d3-geo](https://github.com/d3/d3-geo) & [d3-geo-projection](https://github.com/d3/d3-geo-projection). You can aslo write "mercator" to use tiles. (default: "none")
+ * @property {function|string} [projection] - d3 function of projection. See [d3-geo](https://github.com/d3/d3-geo), [d3-geo-projection](https://github.com/d3/d3-geo-projection) & [d3-geo-polygon](https://github.com/d3/d3-geo-polygon). All theses functions are available in geoviz like this: viz.proj.geoSomething(). You can alse use a String. E.g: d3.geoMercator() <=> viz.proj.geoMercator() <=> "Mercator" <=> "mercator". Null or “none” allows you to display geometries as they are, without reprojecting them. In this case, you must specify the domain.
  * @property {number[]} [pos] - position of the container (if contained in another svg container)
  * @property {string} [background] - background color
  * @property {string} [fontFamily] - font-family for the entire map
@@ -95,6 +96,9 @@
   warning_message = [],
 } = {}) {
   // projection
+
+  projection = getproj(projection);
+
   const initproj = projection;
   switch (projection) {
     case "mercator":
@@ -272,4 +276,4 @@
     },
   });
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/container_draw.js.html b/docs/container_draw.js.html index 276aa92..136683e 100644 --- a/docs/container_draw.js.html +++ b/docs/container_draw.js.html @@ -1,6 +1,6 @@ Source: container/draw.js
On this page

container_draw.js

import { create } from "./create";
+    
On this page

container_draw.js

import { create } from "./create";
 import { geoEquirectangular } from "d3-geo";
 const d3 = Object.assign({}, { geoEquirectangular });
 
@@ -69,4 +69,4 @@
   });
   return svg.render();
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/container_render.js.html b/docs/container_render.js.html index 6991a62..9f05f90 100644 --- a/docs/container_render.js.html +++ b/docs/container_render.js.html @@ -1,6 +1,6 @@ Source: container/render.js
On this page

container_render.js

import { getDOMids } from "../helpers/getDOMids";
+    
On this page

container_render.js

import { getDOMids } from "../helpers/getDOMids";
 import { zoomandpan } from "../helpers/zoomandpan";
 import { zoomversor } from "../helpers/zoomversor";
 import { select, pointers } from "d3-selection";
@@ -131,4 +131,4 @@
   // render
   return svg.node();
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/data/search.json b/docs/data/search.json index c2a47f3..ffc569a 100644 --- a/docs/data/search.json +++ b/docs/data/search.json @@ -1 +1 @@ -{"list":[{"title":"circle","link":"circle","description":"

The circle function allows to add circles on a map. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"create","link":"create","description":"

The create function is the first step in map construction. It creates an svg container + some information about this container:projection, margin, width, height and bbox.

"},{"title":"draw","link":"draw","description":"

The draw() function is inspired by the bertin library. It allows you to draw the entire map using a single function. All the necessary information is stored in a single JSON, containing general parameters and an array of objects describing the layers to be displayed and overlaid. Under the wood, the function draw() use the viz.plot() function. The types available are the same.

"},{"title":"effect/blur","link":"effect/blur","description":"

The blur function allows to create a svg blur filter. It adds a filter to the defs and returns the id like "url(#id)".

"},{"title":"effect/clipPath","link":"effect/clipPath","description":"

The clipPath function allows to create a clip layer. The function adds a clip layer to the SVG container and returns the id like "url(#id)". WARNING - the clip is valid for the entireweb page, not just the map

"},{"title":"effect/radialGradient","link":"effect/radialGradient","description":"

The radialGradient function allows to create a radialGradient. The function adds a filter to the defs and returns the id like "url(#id)".

"},{"title":"effect/shadow","link":"effect/shadow","description":"

The shadow function allows to create a svg filter. It can be use ta add a shadow effect. The function adds a filter to the defs and returns the id like "url(#id)".

"},{"title":"footer","link":"footer","description":"

The footer function allows add a source below the map. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"graticule","link":"graticule","description":"

The graticule function allows to create a layer with lat/long lines. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"grid/arbitrary","link":"grid/arbitrary","description":"

The grid.arbitrary function allows to create an arbitrary geoJSON grid in SVG coordinates.

"},{"title":"grid/diamond","link":"grid/diamond","description":"

The grid.diamond function allows to create a diamond geoJSON grid in SVG coordinates.

"},{"title":"grid/dot","link":"grid/dot","description":"

The grid.dot function allows to create a geoJSON vith regular dots in SVG coordinates.

"},{"title":"grid/h3","link":"grid/h3","description":"

The grid.h3 function allows to create a hexbin geoJSON grid in geographical coordinates.

"},{"title":"grid/hexbin","link":"grid/hexbin","description":"

The grid.hexbin function allows to create a hexbin geoJSON grid in SVG coordinates.

"},{"title":"grid/make","link":"grid/make","description":"

The grid.make function allows to create a regular grid geoJSON. For all types, For all grid types (except "h3"), the function returns a geojson with svg coordinates in the layout of the page. For type "h3", the function returns geographic coordinates in latitude and longitude.

"},{"title":"grid/square","link":"grid/square","description":"

The grid.square function allows to create a square geoJSON grid in SVG coordinates.

"},{"title":"grid/triangle","link":"grid/triangle","description":"

The grid.triangle function allows to create a triangle geoJSON grid in SVG coordinates.

"},{"title":"halfcircle","link":"halfcircle","description":"

The halfcircle function allows to create a layer with rotable half-circles from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"header","link":"header","description":"

The header function allows add a title above the map. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/box","link":"legend/box","description":"

The legend.box function allows to add a box legend on a map. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/choro_horizontal","link":"legend/choro_horizontal","description":"

The legend.choro_horizontal function allows to add an horizontal legend on a map for choropleth layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/choro_vertical","link":"legend/choro_vertical","description":"

The legend.choro_vertical function allows to add a vertical legend on a map for choropleth layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/circles","link":"legend/circles","description":"

The legend.circles function allows to add an legend for proportional circles. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/circles_half","link":"legend/circles_half","description":"

The legend.circles_half function allows to add an legend for mushroom maps. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/circles_nested","link":"legend/circles_nested","description":"

The legend.circles_nested function allows to add an legend for proportional circles. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/mushrooms","link":"legend/mushrooms","description":"

The legend.mushrooms function allows to add an legend for proportional half-circles. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/spikes","link":"legend/spikes","description":"

The legend.spikes function allows to add an legend for spike marks. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/squares","link":"legend/squares","description":"

The legend.squares function allows to add an legend for proportional squares. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/squares_nested","link":"legend/squares_nested","description":"

The legend.squares_nested function allows to add an legend for proportional squares. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/symbol_horizontal","link":"legend/symbol_horizontal","description":"

The legend.symbol_horizontal function allows to add an vertical legend on a map for symbol layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/symbol_vertical","link":"legend/symbol_vertical","description":"

The legend.symbol_vertical function allows to add an vertical legend on a map for symbol layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/typo_horizontal","link":"legend/typo_horizontal","description":"

The legend.typo_horizontal function allows to add an horizontal legend on a map for typo layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/typo_vertical","link":"legend/typo_vertical","description":"

The legend.typo_vertical function allows to add an vertical legend on a map for typo layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"north","link":"north","description":"

The north function allows add a North arrow. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"outline","link":"outline","description":"

The outline function allows to create a layer with Earth outline in the projection. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"path","link":"path","description":"

The path function generates SVG paths from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"plot","link":"plot","description":"

The plot() function in geoviz allows you to call up all the layer types available in the library via a single function. To do this, you need to define the type in the parameter.\n

For example: geoviz.plot({type: "graticule", step: 30})

"},{"title":"plot/choro","link":"plot/choro","description":"

With the plot({type = "choro"}) function, you can quickly draw a choropleth map.

\n\"choro\"

"},{"title":"plot/prop","link":"plot/prop","description":"

With the plot({type = "prop"}) function, you can quickly draw a choropleth map.

"},{"title":"plot/propchoro","link":"plot/propchoro","description":"

With the plot({type = "propchoro"}) function, you can quickly draw a proportional symbols with a color gradation/

"},{"title":"plot/proptypo","link":"plot/proptypo","description":"

With the plot({type = "proptypo"}) function, you can quickly draw a proportional symbols with qualitative colors (hues)

"},{"title":"plot/symbol","link":"plot/symbol","description":"

With the plot({type = "symbol"}) function, you can quickly draw a layer with symbols.

\n\"choro\"

"},{"title":"plot/typo","link":"plot/typo","description":"

With the plot({type = "typo"}) function, you can quickly draw a typlogy from qualitative data.

\n\"choro\"

"},{"title":"render","link":"render","description":"

The render function returns the svg document. It returns a pretty map in SVG format :-)

"},{"title":"scalebar","link":"scalebar","description":"

The scalebar function allows add a scalebar. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"spike","link":"spike","description":"

The spike function allows to create a layer with spikes from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"square","link":"square","description":"

The square function allows to create a layer with rotable squares from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"symbol","link":"symbol","description":"

The symbol function allows to create a layer with symbols from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"text","link":"text","description":"

The text function allows to add a text on the map. It allow also to create a layer with labels from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"tile","link":"tile","description":"

The tile function allows to display raster tiles. To use this mark, you must use the projection d3.geoMercator() (or directly "mercator"). The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"tip","link":"tip","description":"

The tip parameter allows to add tooltips on map layers

"},{"title":"tool/addonts","link":"tool/addonts","description":"

The tool.addonts function allows add font to the document from an url.

"},{"title":"tool/centroid","link":"tool/centroid","description":"

The tool.centroid function calculate the centroid of all the geometries given in a GeoJSON FeatureCollection. It returns a GeoJSON FeatureCollection (points)

"},{"title":"tool/choro","link":"tool/choro","description":"

The tool.choro function discretizes an array of numbers. It returns an object containing breaks, colors, the color of the missing value and a function.

"},{"title":"tool/dissolve","link":"tool/dissolve","description":"

The tool.dissolve function aims to transform multi part features into single parts feature. It a GeoJSON FeatureCollection (without multi part features)

"},{"title":"tool/dodge","link":"tool/dodge","description":"

The tool.dodge function use d3.forceSimulation to spread dots or circles of given in a GeoJSON FeatureCollection (points). It returns the coordinates in the page map. It can be used to create a dorling cartogram. The function returns a GeoJSON FeatureCollection (points) with coordinates in the page map.

"},{"title":"tool/dotstogrid","link":"tool/dotstogrid","description":"

dotstogrid is a function to create a regular grid in the SVG plan count the number of dots inside

"},{"title":"tool/featurecollection","link":"tool/featurecollection","description":"

tool.featurecollection is a function to create a valid GeoJSON FeatureCollection, from geometries, features or coordinates. It returns a GeoJSON FeatureCollection.

"},{"title":"tool/geotable","link":"tool/geotable","description":"

geotable is a function to create an array on objects containing properties and geomeytries, froam a GeoJSON FeatureCollection. This makes it easy to sort, extract data, etc. tool.featurecollection(geotable, { geometry: "geometry" }) can be used to rebuild a valid geoJSON. The function returns an array of an array of FeatureCollections.

"},{"title":"tool/height","link":"tool/height","description":"

This function return a function to calculate radius of circles from data. It returns an object containing a radius function.

"},{"title":"tool/merge","link":"tool/merge","description":"

tool.merge is a function to join a geoJSON and a data file. It returns a GeoJSON FeatureCollection.

"},{"title":"tool/proj4d3","link":"tool/proj4d3","description":"

proj4d3 is a function developped by Philippe Rivière to allow tu use proj4js projections with d3. It returns a d3js projection function. See https://observablehq.com/@fil/proj4js-d3

"},{"title":"tool/project","link":"tool/project","description":"

The function tool.project use geoproject from d3-geo-projection to project a geoJSON. It returns a GeoJSON FeatureCollection with coordinates in the page map.

"},{"title":"tool/radius","link":"tool/radius","description":"

The tool.radius function return a function to calculate radius of circles from data

"},{"title":"tool/random","link":"tool/random","description":"

The tool.random function returns a random color among 20 predefined colors.

"},{"title":"tool/replicate","link":"tool/replicate","description":"

Data-driven features replication. This function can be used to create "dots cartograms". The function returns a GeoJSON FeatureCollection with overlapping features

"},{"title":"tool/rewind","link":"tool/rewind","description":"

The tool.rewind function allows to generate compliant Polygon and MultiPolygon geometries. Adapted from MapBox geojson-rewind code (https://github.com/mapbox/grojson-rewind) under ISC license

"},{"title":"tool/ridge","link":"tool/ridge","description":"

The tool.ridge function convert a regular grid (x,y,z) to a GeoJSON FeatureCollection (LineString). The aim is to draw a rideline map.

"},{"title":"tool/symbols","link":"tool/symbols","description":"

Display symbols available in geoviz

"},{"title":"tool/typo","link":"tool/typo","description":"

The tool.typo function allows you to assign colors to qualitative data. It can be used to create typology maps. It returs an object containing types, colors, the color of the missing value and a function.

"},{"title":"tool/unproject","link":"tool/unproject","description":"

The tool.unproject function allow to unproject geometries. It returns a GeoJSON FeatureCollection with wgs84 coordinates

"}]} \ No newline at end of file +{"list":[{"title":"circle","link":"circle","description":"

The circle function allows to add circles on a map. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"create","link":"create","description":"

The create function is the first step in map construction. It creates an svg container + some information about this container:projection, margin, width, height and bbox.

"},{"title":"draw","link":"draw","description":"

The draw() function is inspired by the bertin library. It allows you to draw the entire map using a single function. All the necessary information is stored in a single JSON, containing general parameters and an array of objects describing the layers to be displayed and overlaid. Under the wood, the function draw() use the viz.plot() function. The types available are the same.

"},{"title":"effect/blur","link":"effect/blur","description":"

The blur function allows to create a svg blur filter. It adds a filter to the defs and returns the id like "url(#id)".

"},{"title":"effect/clipPath","link":"effect/clipPath","description":"

The clipPath function allows to create a clip layer. The function adds a clip layer to the SVG container and returns the id like "url(#id)". WARNING - the clip is valid for the entireweb page, not just the map

"},{"title":"effect/radialGradient","link":"effect/radialGradient","description":"

The radialGradient function allows to create a radialGradient. The function adds a filter to the defs and returns the id like "url(#id)".

"},{"title":"effect/shadow","link":"effect/shadow","description":"

The shadow function allows to create a svg filter. It can be use ta add a shadow effect. The function adds a filter to the defs and returns the id like "url(#id)".

"},{"title":"footer","link":"footer","description":"

The footer function allows add a source below the map. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"graticule","link":"graticule","description":"

The graticule function allows to create a layer with lat/long lines. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"grid/arbitrary","link":"grid/arbitrary","description":"

The grid.arbitrary function allows to create an arbitrary geoJSON grid in SVG coordinates.

"},{"title":"grid/count","link":"grid/count","description":"

The grid.count function allows to count dots in polygons (e.g. grid cells)

"},{"title":"grid/diamond","link":"grid/diamond","description":"

The grid.diamond function allows to create a diamond geoJSON grid in SVG coordinates.

"},{"title":"grid/dot","link":"grid/dot","description":"

The grid.dot function allows to create a geoJSON vith regular dots in SVG coordinates.

"},{"title":"grid/h3","link":"grid/h3","description":"

The grid.h3 function allows to create a hexbin geoJSON grid in geographical coordinates.

"},{"title":"grid/hexbin","link":"grid/hexbin","description":"

The grid.hexbin function allows to create a hexbin geoJSON grid in SVG coordinates.

"},{"title":"grid/intersect","link":"grid/intersect","description":"

The grid.intersect function allows to affect polygons values tu grid cells.

"},{"title":"grid/make","link":"grid/make","description":"

The grid.make function allows to create a regular grid geoJSON. For all types, For all grid types (except "h3"), the function returns a geojson with svg coordinates in the layout of the page. For type "h3", the function returns geographic coordinates in latitude and longitude.

"},{"title":"grid/square","link":"grid/square","description":"

The grid.square function allows to create a square geoJSON grid in SVG coordinates.

"},{"title":"grid/triangle","link":"grid/triangle","description":"

The grid.triangle function allows to create a triangle geoJSON grid in SVG coordinates.

"},{"title":"halfcircle","link":"halfcircle","description":"

The halfcircle function allows to create a layer with rotable half-circles from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"header","link":"header","description":"

The header function allows add a title above the map. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/box","link":"legend/box","description":"

The legend.box function allows to add a box legend on a map. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/choro_horizontal","link":"legend/choro_horizontal","description":"

The legend.choro_horizontal function allows to add an horizontal legend on a map for choropleth layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/choro_vertical","link":"legend/choro_vertical","description":"

The legend.choro_vertical function allows to add a vertical legend on a map for choropleth layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/circles","link":"legend/circles","description":"

The legend.circles function allows to add an legend for proportional circles. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/circles_half","link":"legend/circles_half","description":"

The legend.circles_half function allows to add an legend for mushroom maps. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/circles_nested","link":"legend/circles_nested","description":"

The legend.circles_nested function allows to add an legend for proportional circles. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/mushrooms","link":"legend/mushrooms","description":"

The legend.mushrooms function allows to add an legend for proportional half-circles. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/spikes","link":"legend/spikes","description":"

The legend.spikes function allows to add an legend for spike marks. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/squares","link":"legend/squares","description":"

The legend.squares function allows to add an legend for proportional squares. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/squares_nested","link":"legend/squares_nested","description":"

The legend.squares_nested function allows to add an legend for proportional squares. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/symbol_horizontal","link":"legend/symbol_horizontal","description":"

The legend.symbol_horizontal function allows to add an vertical legend on a map for symbol layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/symbol_vertical","link":"legend/symbol_vertical","description":"

The legend.symbol_vertical function allows to add an vertical legend on a map for symbol layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/typo_horizontal","link":"legend/typo_horizontal","description":"

The legend.typo_horizontal function allows to add an horizontal legend on a map for typo layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"legend/typo_vertical","link":"legend/typo_vertical","description":"

The legend.typo_vertical function allows to add an vertical legend on a map for typo layers. The function adds a legend layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"north","link":"north","description":"

The north function allows add a North arrow. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"outline","link":"outline","description":"

The outline function allows to create a layer with Earth outline in the projection. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"path","link":"path","description":"

The path function generates SVG paths from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"plot","link":"plot","description":"

The plot() function in geoviz allows you to call up all the layer types available in the library via a single function. To do this, you need to define the type in the parameter.\n

For example: geoviz.plot({type: "graticule", step: 30})

"},{"title":"plot/choro","link":"plot/choro","description":"

With the plot({type = "choro"}) function, you can quickly draw a choropleth map.

\n\"choro\"

"},{"title":"plot/prop","link":"plot/prop","description":"

With the plot({type = "prop"}) function, you can quickly draw a choropleth map.

"},{"title":"plot/propchoro","link":"plot/propchoro","description":"

With the plot({type = "propchoro"}) function, you can quickly draw a proportional symbols with a color gradation/

"},{"title":"plot/proptypo","link":"plot/proptypo","description":"

With the plot({type = "proptypo"}) function, you can quickly draw a proportional symbols with qualitative colors (hues)

"},{"title":"plot/symbol","link":"plot/symbol","description":"

With the plot({type = "symbol"}) function, you can quickly draw a layer with symbols.

\n\"choro\"

"},{"title":"plot/typo","link":"plot/typo","description":"

With the plot({type = "typo"}) function, you can quickly draw a typlogy from qualitative data.

\n\"choro\"

"},{"title":"render","link":"render","description":"

The render function returns the svg document. It returns a pretty map in SVG format :-)

"},{"title":"scalebar","link":"scalebar","description":"

The scalebar function allows add a scalebar. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"spike","link":"spike","description":"

The spike function allows to create a layer with spikes from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"square","link":"square","description":"

The square function allows to create a layer with rotable squares from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"symbol","link":"symbol","description":"

The symbol function allows to create a layer with symbols from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"text","link":"text","description":"

The text function allows to add a text on the map. It allow also to create a layer with labels from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"tile","link":"tile","description":"

The tile function allows to display raster tiles. To use this mark, you must use the projection d3.geoMercator() (or directly "mercator"). The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

"},{"title":"tip","link":"tip","description":"

The tip parameter allows to add tooltips on map layers

"},{"title":"tool/addonts","link":"tool/addonts","description":"

The tool.addonts function allows add font to the document from an url.

"},{"title":"tool/centroid","link":"tool/centroid","description":"

The tool.centroid function calculate the centroid of all the geometries given in a GeoJSON FeatureCollection. It returns a GeoJSON FeatureCollection (points)

"},{"title":"tool/choro","link":"tool/choro","description":"

The tool.choro function discretizes an array of numbers. It returns an object containing breaks, colors, the color of the missing value and a function.

"},{"title":"tool/dissolve","link":"tool/dissolve","description":"

The tool.dissolve function aims to transform multi part features into single parts feature. It a GeoJSON FeatureCollection (without multi part features)

"},{"title":"tool/dodge","link":"tool/dodge","description":"

The tool.dodge function use d3.forceSimulation to spread dots or circles of given in a GeoJSON FeatureCollection (points). It returns the coordinates in the page map. It can be used to create a dorling cartogram. The function returns a GeoJSON FeatureCollection (points) with coordinates in the page map.

"},{"title":"tool/dotstogrid","link":"tool/dotstogrid","description":"

dotstogrid is a function to create a regular grid in the SVG plan count the number of dots inside

"},{"title":"tool/featurecollection","link":"tool/featurecollection","description":"

tool.featurecollection is a function to create a valid GeoJSON FeatureCollection, from geometries, features or coordinates. It returns a GeoJSON FeatureCollection.

"},{"title":"tool/geotable","link":"tool/geotable","description":"

geotable is a function to create an array on objects containing properties and geomeytries, froam a GeoJSON FeatureCollection. This makes it easy to sort, extract data, etc. tool.featurecollection(geotable, { geometry: "geometry" }) can be used to rebuild a valid geoJSON. The function returns an array of an array of FeatureCollections.

"},{"title":"tool/height","link":"tool/height","description":"

This function return a function to calculate radius of circles from data. It returns an object containing a radius function.

"},{"title":"tool/merge","link":"tool/merge","description":"

tool.merge is a function to join a geoJSON and a data file. It returns a GeoJSON FeatureCollection.

"},{"title":"tool/proj4d3","link":"tool/proj4d3","description":"

proj4d3 is a function developped by Philippe Rivière to allow tu use proj4js projections with d3. It returns a d3js projection function. See https://observablehq.com/@fil/proj4js-d3

"},{"title":"tool/project","link":"tool/project","description":"

The function tool.project use geoproject from d3-geo-projection to project a geoJSON. It returns a GeoJSON FeatureCollection with coordinates in the page map.

"},{"title":"tool/radius","link":"tool/radius","description":"

The tool.radius function return a function to calculate radius of circles from data

"},{"title":"tool/random","link":"tool/random","description":"

The tool.random function returns a random color among 20 predefined colors.

"},{"title":"tool/replicate","link":"tool/replicate","description":"

Data-driven features replication. This function can be used to create "dots cartograms". The function returns a GeoJSON FeatureCollection with overlapping features

"},{"title":"tool/rewind","link":"tool/rewind","description":"

The tool.rewind function allows to generate compliant Polygon and MultiPolygon geometries. Adapted from MapBox geojson-rewind code (https://github.com/mapbox/grojson-rewind) under ISC license

"},{"title":"tool/ridge","link":"tool/ridge","description":"

The tool.ridge function convert a regular grid (x,y,z) to a GeoJSON FeatureCollection (LineString). The aim is to draw a rideline map.

"},{"title":"tool/symbols","link":"tool/symbols","description":"

Display symbols available in geoviz

"},{"title":"tool/typo","link":"tool/typo","description":"

The tool.typo function allows you to assign colors to qualitative data. It can be used to create typology maps. It returs an object containing types, colors, the color of the missing value and a function.

"},{"title":"tool/unproject","link":"tool/unproject","description":"

The tool.unproject function allow to unproject geometries. It returns a GeoJSON FeatureCollection with wgs84 coordinates

"}]} \ No newline at end of file diff --git a/docs/effect_blur.js.html b/docs/effect_blur.js.html index 490e355..b55b9de 100644 --- a/docs/effect_blur.js.html +++ b/docs/effect_blur.js.html @@ -1,6 +1,6 @@ Source: effect/blur.js
On this page

effect_blur.js

import { unique } from "../helpers/utils";
+    
On this page

effect_blur.js

import { unique } from "../helpers/utils";
 
 /**
  * @function effect/blur
@@ -29,4 +29,4 @@
 
   return `url(#${id})`;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/effect_clippath.js.html b/docs/effect_clippath.js.html index 41f17ac..200e2b2 100644 --- a/docs/effect_clippath.js.html +++ b/docs/effect_clippath.js.html @@ -1,6 +1,6 @@ Source: effect/clippath.js
On this page

effect_clippath.js

import { unique } from "../helpers/utils";
+    
On this page

effect_clippath.js

import { unique } from "../helpers/utils";
 import { geoPath } from "d3-geo";
 const d3 = Object.assign({}, { geoPath });
 
@@ -45,4 +45,4 @@
 
   return `url(#${id})`;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/effect_radialgradient.js.html b/docs/effect_radialgradient.js.html index 8f94433..a113ed7 100644 --- a/docs/effect_radialgradient.js.html +++ b/docs/effect_radialgradient.js.html @@ -1,6 +1,6 @@ Source: effect/radialgradient.js
On this page

effect_radialgradient.js

import { unique } from "../helpers/utils";
+    
On this page

effect_radialgradient.js

import { unique } from "../helpers/utils";
 
 /**
  * @function effect/radialGradient
@@ -52,4 +52,4 @@
 
   return `url(#${id})`;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/effect_shadow.js.html b/docs/effect_shadow.js.html index d33f9e6..fdf511d 100644 --- a/docs/effect_shadow.js.html +++ b/docs/effect_shadow.js.html @@ -1,6 +1,6 @@ Source: effect/shadow.js
On this page

effect_shadow.js

import { unique } from "../helpers/utils";
+    
On this page

effect_shadow.js

import { unique } from "../helpers/utils";
 
 /**
  * @function effect/shadow
@@ -50,4 +50,4 @@
 
   return `url(#${id})`;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/global.html b/docs/global.html index 3677048..999ea31 100644 --- a/docs/global.html +++ b/docs/global.html @@ -1,6 +1,6 @@ Global
On this page

Members

tip

The tip parameter allows to add tooltips on map layers

Properties
NameTypeDescription
tipstring | boolean | function

You can display a simple text like "foo". But in most cases, tooltips are used to display information related to the elements hovered over. To do this, use the $ prefix with the field name.With true, all fidls are displayed. Finally, you can pass a function to build a customized tooltip.

tipstyleobject

An object to configure the "appearance of the tooltip. fontSize, fill, background, stroke, strokeWidth, fontFamily, fontWeight, fontStyle, textDecoration. See also tool.addonts

Examples
// Simple text
+    
On this page

Members

tip

The tip parameter allows to add tooltips on map layers

Properties
NameTypeDescription
tipstring | boolean | function

You can display a simple text like "foo". But in most cases, tooltips are used to display information related to the elements hovered over. To do this, use the $ prefix with the field name.With true, all fidls are displayed. Finally, you can pass a function to build a customized tooltip.

tipstyleobject

An object to configure the "appearance of the tooltip. fontSize, fill, background, stroke, strokeWidth, fontFamily, fontWeight, fontStyle, textDecoration. See also tool.addonts

Examples
// Simple text
 viz.path({ data: world, tip: "hello" })
// A field to display
 viz.path({ data: world, tip: "$pop" })
// To display all fields
 viz.path({ data: world, tip: true })
// A tooltip on several lines
@@ -40,7 +40,7 @@
 svg.circle({ data: cities, r: "population" }) // where svg is the container
 svg.plot({ type: "circle", data: cities, r: "population" }) // where svg is the container
 geoviz.circle({ data: cities, r: "population" }) // no container
-geoviz.plot({ type = "circle", data: cities, r: "population" }) // no container

create()

The create function is the first step in map construction. It creates an svg container + some information about this container:projection, margin, width, height and bbox.

Properties
NameTypeAttributesDefaultDescription
widthnumber<optional>
1000

width of the container.

idnumber<optional>
"map"

id of the svg container.

heightnumber<optional>

height of the container. This value is automatically calculated according to domain. But it can be forced by entering a value.

domainobject | Array.<object><optional>

the domain corresponds to the geographical area to be displayed. It is defined by a geoJSON or an array containing geoJSONs.

projectionfunction | string<optional>

d3 function of projection. See d3-geo & d3-geo-projection. You can aslo write "mercator" to use tiles. (default: "none")

posArray.<number><optional>

position of the container (if contained in another svg container)

backgroundstring<optional>

background color

fontFamilystring<optional>

font-family for the entire map

marginnumber | Array.<number><optional>
0

margins around the map. A number to set the same margin everywhere or an array [top, right, bottom, left] to set different margins.

parentobject<optional>

name of parent container into which this child container is to be included. In this case, the options.pos parameter is also used.

zoomableboolean | number | string<optional>

activates the map zoom function. If you set an array of 2 values, it defines the scaleExtent (default: [1,8]). Use "versor" to activate versor zoom. "versor" is only available for vector geometries in wgs84.

controlboolean | Array.<number><optional>

If zoomable is enabled, set the control parameter as true displays control buttons to zoom on the map. You can also define an array of 2 values to locate the panel in the position you want (e.g. [100, 200]). This setting is not available with the Versor zoom.

warningboolean<optional>
true

display or not warnings on the map

Example
let svg = geoviz.create({width: 500, background: "lightblue"})

draw()

The draw() function is inspired by the bertin library. It allows you to draw the entire map using a single function. All the necessary information is stored in a single JSON, containing general parameters and an array of objects describing the layers to be displayed and overlaid. Under the wood, the function draw() use the viz.plot() function. The types available are the same.

Properties
NameTypeDescription
jsonobject

an object containing container parameters and an array for layers description. See example below.

Example
geoviz.draw({
+geoviz.plot({ type = "circle", data: cities, r: "population" }) // no container

create()

The create function is the first step in map construction. It creates an svg container + some information about this container:projection, margin, width, height and bbox.

Properties
NameTypeAttributesDefaultDescription
widthnumber<optional>
1000

width of the container.

idnumber<optional>
"map"

id of the svg container.

heightnumber<optional>

height of the container. This value is automatically calculated according to domain. But it can be forced by entering a value.

domainobject | Array.<object><optional>

the domain corresponds to the geographical area to be displayed. It is defined by a geoJSON or an array containing geoJSONs.

projectionfunction | string<optional>

d3 function of projection. See d3-geo, d3-geo-projection & d3-geo-polygon. All theses functions are available in geoviz like this: viz.proj.geoSomething(). You can alse use a String. E.g: d3.geoMercator() <=> viz.proj.geoMercator() <=> "Mercator" <=> "mercator". Null or “none” allows you to display geometries as they are, without reprojecting them. In this case, you must specify the domain.

posArray.<number><optional>

position of the container (if contained in another svg container)

backgroundstring<optional>

background color

fontFamilystring<optional>

font-family for the entire map

marginnumber | Array.<number><optional>
0

margins around the map. A number to set the same margin everywhere or an array [top, right, bottom, left] to set different margins.

parentobject<optional>

name of parent container into which this child container is to be included. In this case, the options.pos parameter is also used.

zoomableboolean | number | string<optional>

activates the map zoom function. If you set an array of 2 values, it defines the scaleExtent (default: [1,8]). Use "versor" to activate versor zoom. "versor" is only available for vector geometries in wgs84.

controlboolean | Array.<number><optional>

If zoomable is enabled, set the control parameter as true displays control buttons to zoom on the map. You can also define an array of 2 values to locate the panel in the position you want (e.g. [100, 200]). This setting is not available with the Versor zoom.

warningboolean<optional>
true

display or not warnings on the map

Example
let svg = geoviz.create({width: 500, background: "lightblue"})

draw()

The draw() function is inspired by the bertin library. It allows you to draw the entire map using a single function. All the necessary information is stored in a single JSON, containing general parameters and an array of objects describing the layers to be displayed and overlaid. Under the wood, the function draw() use the viz.plot() function. The types available are the same.

Properties
NameTypeDescription
jsonobject

an object containing container parameters and an array for layers description. See example below.

Example
geoviz.draw({
  // SVG container parameters
   params: {
     zoomable: true,
@@ -83,8 +83,8 @@
 geoviz.graticule(svg, { step: 2 }) // where svg is the container
 svg.graticule({ step: [10,2] }) // where svg is the container
 svg.plot({ type: "graticule", step: [10,2] }) // where svg is the container
-geoviz.graticule({ step: 2 }) // no container

grid/arbitrary()

The grid.arbitrary function allows to create an arbitrary geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.arbitrary({step: 30})

grid/diamond()

The grid.diamond function allows to create a diamond geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.diamond({step: 30})

grid/dot()

The grid.dot function allows to create a geoJSON vith regular dots in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.dot({step: 30})

grid/h3()

The grid.h3 function allows to create a hexbin geoJSON grid in geographical coordinates.

Properties
NameTypeAttributesDefaultDescription
levelnumber<optional>
0

level of the grid. Form 0 (large hexagons) to 4 (small hexagons). See: https://h3geo.org

domainobject<optional>

a geoJSON to define an extent

rewindboolen<optional>

to rewind the output

Example
geoviz.grid.h3({level: 1})
-geoviz.grid.h3({level: 4, domain: italy})

grid/hexbin()

The grid.hexbin function allows to create a hexbin geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.hexbin({step: 30})

grid/make()

The grid.make function allows to create a regular grid geoJSON. For all types, For all grid types (except "h3"), the function returns a geojson with svg coordinates in the layout of the page. For type "h3", the function returns geographic coordinates in latitude and longitude.

Properties
NameTypeAttributesDefaultDescription
typestring<optional>
"square"

Type of grid ("square", "dot", "diamond", "hexbin" (or "hex"), "trangle", "arbitrary" (or "randmon"), "h3" (or "h3geo", "hexgeo", "hexbingeo"))

stepnumber<optional>
50

step of grids (except for "h3" type)

levelnumber<optional>
0

level oh geographical hexbin grids ("h3" type only). Form 0 (large hexagons) to 4 (small hexagons). See: https://h3geo.org

domainobject<optional>

a geoJSON to define an extent (h3 only)

rewindboolen<optional>

to rewind the output (h3 only)

Example
// There are several ways to use this function
+geoviz.graticule({ step: 2 }) // no container

grid/arbitrary()

The grid.arbitrary function allows to create an arbitrary geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.arbitrary({step: 30})

grid/count()

The grid.count function allows to count dots in polygons (e.g. grid cells)

Properties
NameTypeAttributesDescription
dotsobject<optional>

dots geoJSON

polygonsobject<optional>

polygons geoJSON (e.g. grid)

varstring<optional>

field (absolute quantitative data only)

grid/diamond()

The grid.diamond function allows to create a diamond geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.diamond({step: 30})

grid/dot()

The grid.dot function allows to create a geoJSON vith regular dots in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.dot({step: 30})

grid/h3()

The grid.h3 function allows to create a hexbin geoJSON grid in geographical coordinates.

Properties
NameTypeAttributesDefaultDescription
levelnumber<optional>
0

level of the grid. Form 0 (large hexagons) to 4 (small hexagons). See: https://h3geo.org

domainobject<optional>

a geoJSON to define an extent

rewindboolen<optional>

to rewind the output

Example
geoviz.grid.h3({level: 1})
+geoviz.grid.h3({level: 4, domain: italy})

grid/hexbin()

The grid.hexbin function allows to create a hexbin geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.hexbin({step: 30})

grid/intersect()

The grid.intersect function allows to affect polygons values tu grid cells.

Properties
NameTypeAttributesDescription
gridobject<optional>

grid geoJSON

polygonsobject<optional>

polygons geoJSON

varstring<optional>

field (absolute quantitative data only)

grid/make()

The grid.make function allows to create a regular grid geoJSON. For all types, For all grid types (except "h3"), the function returns a geojson with svg coordinates in the layout of the page. For type "h3", the function returns geographic coordinates in latitude and longitude.

Properties
NameTypeAttributesDefaultDescription
typestring<optional>
"square"

Type of grid ("square", "dot", "diamond", "hexbin" (or "hex"), "trangle", "arbitrary" (or "randmon"), "h3" (or "h3geo", "hexgeo", "hexbingeo"))

stepnumber<optional>
50

step of grids (except for "h3" type)

levelnumber<optional>
0

level oh geographical hexbin grids ("h3" type only). Form 0 (large hexagons) to 4 (small hexagons). See: https://h3geo.org

domainobject<optional>

a geoJSON to define an extent (h3 only)

rewindboolen<optional>

to rewind the output (h3 only)

Example
// There are several ways to use this function
 geoviz.grid.make(svg, { type:"diamond", step:100 })  // where svg is the container
 svg.grid.make({ type:"diamond", step:100 })  // where svg is the container

grid/square()

The grid.square function allows to create a square geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.square({step: 30})

grid/triangle()

The grid.triangle function allows to create a triangle geoJSON grid in SVG coordinates.

Properties
NameTypeAttributesDefaultDescription
stepnumber<optional>
50

step of the grid

widthnumber<optional>
1000

width of the grid

heightnumber<optional>
500

height of the grid

Example
geoviz.grid.triangle({step: 30})

halfcircle()

The halfcircle function allows to create a layer with rotable half-circles from a geoJSON. The function adds a layer to the SVG container and returns the layer identifier. If the container is not defined, then the layer is displayed directly.

Properties
NameTypeAttributesDefaultDescription
dataobject

GeoJSON FeatureCollection

idstring<optional>

id of the layer

posArray.<number><optional>
[0,0]

position of the half-circle to display a single circle

dxnumber<optional>
0

shift in x

dynumber<optional>
0

shift in y

anglenumber<optional>
0

angle of the half circle

rnumber | string<optional>
10

a number or the name of a property containing numerical values

innerRadiusnumber<optional>
10

inner radius

cornerRadiusnumber<optional>
2

corner radius

knumber<optional>
50

radius of the largest half-circle (or corresponding to the value defined by fixmax)

fixmaxnumber<optional>

value matching the half-circle with radius k. Setting this value is useful for making maps comparable with each other

sortstring | function<optional>

the field to sort circles or a sort function

descendingboolean<optional>

circle sorting order

coordsstring<optional>
"geo"

use "svg" if the coordinates are already in the plan of the svg document

fillstring | function<optional>

fill color. To create choropleth maps or typologies, use the tool.choro and tool.typo functions

strokestring | function<optional>

stroke color. To create choropleth maps or typologies, use the tool.choro and tool.typo functions

tipboolean | function<optional>
false

a function to display the tip. Use true tu display all fields

viewboolean<optional>
false

use true and viewof in Observable for this layer to act as Input

tipstyleobject<optional>

tooltip style

**<optional>

other SVG attributes that can be applied (strokeDasharray, strokeWidth, opacity, strokeLinecap...)

svg_**<optional>

parameters of the svg container created if the layer is not called inside a container (e.g svg_width)

Example
// There are several ways to use this function
 geoviz.halfcircle(svg, { pos: [10,20], r: 15 }) // a single half-circle
@@ -198,4 +198,4 @@
 geoviz.tile() // no container
 geoviz.tile(svg, {url: "worldterrain"}) // where svg is the container
 svg.tile({url: "worldterrain"}) // where svg is the container
-svg.plot({type: "tile", url: "worldterrain"}) // where svg is the container

tool/addonts()

The tool.addonts function allows add font to the document from an url.

Properties
NameTypeDescription
fontFamilystring

font family name

urlstring

tff- file url

tool/centroid()

The tool.centroid function calculate the centroid of all the geometries given in a GeoJSON FeatureCollection. It returns a GeoJSON FeatureCollection (points)

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.largestboolean<optional>
true

place the centroid in the largest polygon.

options.latlongboolean<optional>
true

use true if input coordinates are in latitude ans longitude. Use false if the coordinates are already defined in the page plan

Example
let dots = geoviz.tool.centroid(world, { largest: true })

tool/choro()

The tool.choro function discretizes an array of numbers. It returns an object containing breaks, colors, the color of the missing value and a function.

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.breaksArray.<number><optional>

class breaks including min and max

options.colorsstring | Array.<string><optional>
"Algae"

an array of colors or name of a color palette available in dicopal

options.reverseboolean<optional>
false

reverse colors

options.missingstring<optional>
"white"

a color for missings values

options.methodstring<optional>
"quantile"

classification method ('quantile', 'q6', 'equal', 'jenks', 'msd', 'geometric', 'headtail', 'pretty', 'arithmetic' or 'nestedmeans')

options.nbnumber<optional>
6

number of classes desired

options.precisionnumber<optional>
2

number of digits

options.minmaxboolean<optional>

to keep or delete min and max

options.knumber<optional>
1

number of standard deviations taken into account (msd method only)

options.middleboolean<optional>

to have the average as a class center (msd method only)

Example
geoviz.tool.choro(world.features.map((d) => d.properties.gdppc), {method: "equal", nb: 4})

tool/dissolve()

The tool.dissolve function aims to transform multi part features into single parts feature. It a GeoJSON FeatureCollection (without multi part features)

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.areashareboolean<optional>
"_share"

name of the field containing the share area of the part

Example
let dots = geoviz.tool.dissolve(world)

tool/dodge()

The tool.dodge function use d3.forceSimulation to spread dots or circles of given in a GeoJSON FeatureCollection (points). It returns the coordinates in the page map. It can be used to create a dorling cartogram. The function returns a GeoJSON FeatureCollection (points) with coordinates in the page map.

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.projectionfunction<optional>
d => d

d3 projection function

options.rnumber | string<optional>
10

a number or the name of a property containing numerical values.

options.knumber<optional>
50

radius of the largest circle (or corresponding to the value defined by fixmax)

options.fixmaxnumber<optional>
null

value matching the circle with radius k. Setting this value is useful for making maps comparable with each other

options.iterationnumber<optional>
200

number of iterations

options.gapnumber<optional>
0

space between points/circles

Example
let dots = geoviz.tool.dodge(world, { projection: d3.geoOrthographic(), r: "population", k: 40 })

tool/dotstogrid()

dotstogrid is a function to create a regular grid in the SVG plan count the number of dots inside

Properties
NameTypeAttributesDefaultDescription
svgobject

A geoviz SVG container

options.typestring<optional>
"hex"

type of grid ("hex", "square", "triangle","random")

options.stepnumber<optional>
50

grid resolution (in pixels)

options.datageoJSON<optional>

dots to count in the grid

options.varstring<optional>

field to sum

Example
geoviz.tool.dotstogrid(svg, {type:"triangle", step:30, data: dots, var: "mayvar"})

tool/featurecollection()

tool.featurecollection is a function to create a valid GeoJSON FeatureCollection, from geometries, features or coordinates. It returns a GeoJSON FeatureCollection.

Properties
NameTypeDescription
dataobject | Array

A GeoJSON FeatureCollection, an array of GeoJSON features, a single feature, an array of geometries, a single geometry or a array defining a bbox. You can also use an array of properties containing latitude and longitude coordinates. In this case, you need to specify the field names in the options.

options.latitudestring

name of field containing latitudes. You can also use lat

options.longitudestring

name of field containing longitudes. You can also use lon

options.coordinatesstring

name of field containing géographic coordinates. You can also use coords

options.geometrystring

name of field containing geoJSON geometries

tool/geotable()

geotable is a function to create an array on objects containing properties and geomeytries, froam a GeoJSON FeatureCollection. This makes it easy to sort, extract data, etc. tool.featurecollection(geotable, { geometry: "geometry" }) can be used to rebuild a valid geoJSON. The function returns an array of an array of FeatureCollections.

Properties
NameTypeDescription
dataobject

A GeoJSON FeatureCollection

options.geometrystring

name of field containing GEOJSON geometries

tool/height()

This function return a function to calculate radius of circles from data. It returns an object containing a radius function.

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.fixmaxArray.<string><optional>

to fix the value corresponding to the circle with radius = k

options.kArray.<string><optional>
50

radius if the greater circle

tool/merge()

tool.merge is a function to join a geoJSON and a data file. It returns a GeoJSON FeatureCollection.

Properties
NameTypeAttributesDescription
geomArray

a GeoJSON FeatureCollection

geom_idstring

geom id

dataArray

array containg data

data_idstring

data id

idstring<optional>

id (if ids are the same in data and geometries)

tool/proj4d3()

proj4d3 is a function developped by Philippe Rivière to allow tu use proj4js projections with d3. It returns a d3js projection function. See https://observablehq.com/@fil/proj4js-d3

Properties
NameTypeDescription
proj4library

the proj4 lib that you have to load

proj4stringstring

a proj4 projection

Example
geoviz.tool.proj4d3(proj4, `+proj=lcc +lat_1=49 +lat_2=44 +lat_0=46.5 +lon_0=3 +x_0=700000 +y_0=6600000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs` )

tool/project()

The function tool.project use geoproject from d3-geo-projection to project a geoJSON. It returns a GeoJSON FeatureCollection with coordinates in the page map.

Properties
NameTypeDescription
dataobject

a GeoJSON FeatureCollection

options.projectionfunction

projection definition. See d3-geo & d3-geo-projection

Example
let newGeoJSON = geoviz.tool.project(world, { projection: d3.geoOrthographic()})

tool/radius()

The tool.radius function return a function to calculate radius of circles from data

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.fixmaxArray.<string><optional>

to fix the value corresponding to the circle with radius = k

option.kArray.<string><optional>
50

radius if the greater circle

tool/random()

The tool.random function returns a random color among 20 predefined colors.

tool/replicate()

Data-driven features replication. This function can be used to create "dots cartograms". The function returns a GeoJSON FeatureCollection with overlapping features

Properties
NameTypeDescription
dataobject

a GeoJSON FeatureCollection

options.fieldstring

property name containing numeric data

options.targetvaluenumber

Feature target value

Example
let dots = geoviz.tool.replicate(world, { field: "population", targetvalue: 10000 })

tool/rewind()

The tool.rewind function allows to generate compliant Polygon and MultiPolygon geometries. Adapted from MapBox geojson-rewind code (https://github.com/mapbox/grojson-rewind) under ISC license

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.outerboolean<optional>
false

rewind Rings Outer

options.mutateboolean<optional>
false

mutate the Input geoJSON

tool/ridge()

The tool.ridge function convert a regular grid (x,y,z) to a GeoJSON FeatureCollection (LineString). The aim is to draw a rideline map.

Properties
NameTypeAttributesDefaultDescription
gridarray

an array of object containig x,y,z values

options.xstring<optional>
"x"

field containg x values

options.ystring<optional>
"y"

field containg y values

options.zstring<optional>
"z"

field containg z values

options.knumber<optional>
100

height of highest peak

options.fixmaxnumber<optional>
null

a fixed value corresponding to the k

options.projectionboolean<optional>
d => d

projection

tool/symbols()

Display symbols available in geoviz

Properties
NameTypeAttributesDefaultDescription
options.widthnumber<optional>
800

width

Example
geoviz.tool.symbols({ width: 500 })

tool/typo()

The tool.typo function allows you to assign colors to qualitative data. It can be used to create typology maps. It returs an object containing types, colors, the color of the missing value and a function.

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.colorsArray.<string><optional>
"Set3"

an array of colors or name of a color palette available in dicopal

options.missingstring<optional>
"white"

a color for missings values

Example
geoviz.tool.typo(world.features.map((d) => d.properties.region), {palette: "Pastel"})

tool/unproject()

The tool.unproject function allow to unproject geometries. It returns a GeoJSON FeatureCollection with wgs84 coordinates

Properties
NameTypeDescription
dataobject

a GeoJSON FeatureCollection

options.projectionfunction

projection definition. See d3-geo & d3-geo-projection

Example
let newGeoJSON = geoviz.tool.unproject(world, { projection: d3.geoOrthographic()})
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +svg.plot({type: "tile", url: "worldterrain"}) // where svg is the container

tool/addonts()

The tool.addonts function allows add font to the document from an url.

Properties
NameTypeDescription
fontFamilystring

font family name

urlstring

tff- file url

tool/centroid()

The tool.centroid function calculate the centroid of all the geometries given in a GeoJSON FeatureCollection. It returns a GeoJSON FeatureCollection (points)

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.largestboolean<optional>
true

place the centroid in the largest polygon.

options.latlongboolean<optional>
true

use true if input coordinates are in latitude ans longitude. Use false if the coordinates are already defined in the page plan

Example
let dots = geoviz.tool.centroid(world, { largest: true })

tool/choro()

The tool.choro function discretizes an array of numbers. It returns an object containing breaks, colors, the color of the missing value and a function.

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.breaksArray.<number><optional>

class breaks including min and max

options.colorsstring | Array.<string><optional>
"Algae"

an array of colors or name of a color palette available in dicopal

options.reverseboolean<optional>
false

reverse colors

options.missingstring<optional>
"white"

a color for missings values

options.methodstring<optional>
"quantile"

classification method ('quantile', 'q6', 'equal', 'jenks', 'msd', 'geometric', 'headtail', 'pretty', 'arithmetic' or 'nestedmeans')

options.nbnumber<optional>
6

number of classes desired

options.precisionnumber<optional>
2

number of digits

options.minmaxboolean<optional>

to keep or delete min and max

options.knumber<optional>
1

number of standard deviations taken into account (msd method only)

options.middleboolean<optional>

to have the average as a class center (msd method only)

Example
geoviz.tool.choro(world.features.map((d) => d.properties.gdppc), {method: "equal", nb: 4})

tool/dissolve()

The tool.dissolve function aims to transform multi part features into single parts feature. It a GeoJSON FeatureCollection (without multi part features)

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.areashareboolean<optional>
"_share"

name of the field containing the share area of the part

Example
let dots = geoviz.tool.dissolve(world)

tool/dodge()

The tool.dodge function use d3.forceSimulation to spread dots or circles of given in a GeoJSON FeatureCollection (points). It returns the coordinates in the page map. It can be used to create a dorling cartogram. The function returns a GeoJSON FeatureCollection (points) with coordinates in the page map.

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.projectionfunction<optional>
d => d

d3 projection function

options.rnumber | string<optional>
10

a number or the name of a property containing numerical values.

options.knumber<optional>
50

radius of the largest circle (or corresponding to the value defined by fixmax)

options.fixmaxnumber<optional>
null

value matching the circle with radius k. Setting this value is useful for making maps comparable with each other

options.iterationnumber<optional>
200

number of iterations

options.gapnumber<optional>
0

space between points/circles

Example
let dots = geoviz.tool.dodge(world, { projection: d3.geoOrthographic(), r: "population", k: 40 })

tool/dotstogrid()

dotstogrid is a function to create a regular grid in the SVG plan count the number of dots inside

Properties
NameTypeAttributesDefaultDescription
svgobject

A geoviz SVG container

options.typestring<optional>
"hex"

type of grid ("hex", "square", "triangle","random")

options.stepnumber<optional>
50

grid resolution (in pixels)

options.datageoJSON<optional>

dots to count in the grid

options.varstring<optional>

field to sum

Example
geoviz.tool.dotstogrid(svg, {type:"triangle", step:30, data: dots, var: "mayvar"})

tool/featurecollection()

tool.featurecollection is a function to create a valid GeoJSON FeatureCollection, from geometries, features or coordinates. It returns a GeoJSON FeatureCollection.

Properties
NameTypeDescription
dataobject | Array

A GeoJSON FeatureCollection, an array of GeoJSON features, a single feature, an array of geometries, a single geometry or a array defining a bbox. You can also use an array of properties containing latitude and longitude coordinates. In this case, you need to specify the field names in the options.

options.latitudestring

name of field containing latitudes. You can also use lat

options.longitudestring

name of field containing longitudes. You can also use lon

options.coordinatesstring

name of field containing géographic coordinates. You can also use coords

options.geometrystring

name of field containing geoJSON geometries

tool/geotable()

geotable is a function to create an array on objects containing properties and geomeytries, froam a GeoJSON FeatureCollection. This makes it easy to sort, extract data, etc. tool.featurecollection(geotable, { geometry: "geometry" }) can be used to rebuild a valid geoJSON. The function returns an array of an array of FeatureCollections.

Properties
NameTypeDescription
dataobject

A GeoJSON FeatureCollection

options.geometrystring

name of field containing GEOJSON geometries

tool/height()

This function return a function to calculate radius of circles from data. It returns an object containing a radius function.

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.fixmaxArray.<string><optional>

to fix the value corresponding to the circle with radius = k

options.kArray.<string><optional>
50

radius if the greater circle

tool/merge()

tool.merge is a function to join a geoJSON and a data file. It returns a GeoJSON FeatureCollection.

Properties
NameTypeAttributesDescription
geomArray

a GeoJSON FeatureCollection

geom_idstring

geom id

dataArray

array containg data

data_idstring

data id

idstring<optional>

id (if ids are the same in data and geometries)

tool/proj4d3()

proj4d3 is a function developped by Philippe Rivière to allow tu use proj4js projections with d3. It returns a d3js projection function. See https://observablehq.com/@fil/proj4js-d3

Properties
NameTypeDescription
proj4library

the proj4 lib that you have to load

proj4stringstring

a proj4 projection

Example
geoviz.tool.proj4d3(proj4, `+proj=lcc +lat_1=49 +lat_2=44 +lat_0=46.5 +lon_0=3 +x_0=700000 +y_0=6600000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs` )

tool/project()

The function tool.project use geoproject from d3-geo-projection to project a geoJSON. It returns a GeoJSON FeatureCollection with coordinates in the page map.

Properties
NameTypeDescription
dataobject

a GeoJSON FeatureCollection

options.projectionfunction

projection definition. See d3-geo & d3-geo-projection

Example
let newGeoJSON = geoviz.tool.project(world, { projection: d3.geoOrthographic()})

tool/radius()

The tool.radius function return a function to calculate radius of circles from data

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.fixmaxArray.<string><optional>

to fix the value corresponding to the circle with radius = k

option.kArray.<string><optional>
50

radius if the greater circle

tool/random()

The tool.random function returns a random color among 20 predefined colors.

tool/replicate()

Data-driven features replication. This function can be used to create "dots cartograms". The function returns a GeoJSON FeatureCollection with overlapping features

Properties
NameTypeDescription
dataobject

a GeoJSON FeatureCollection

options.fieldstring

property name containing numeric data

options.targetvaluenumber

Feature target value

Example
let dots = geoviz.tool.replicate(world, { field: "population", targetvalue: 10000 })

tool/rewind()

The tool.rewind function allows to generate compliant Polygon and MultiPolygon geometries. Adapted from MapBox geojson-rewind code (https://github.com/mapbox/grojson-rewind) under ISC license

Properties
NameTypeAttributesDefaultDescription
dataobject

a GeoJSON FeatureCollection

options.outerboolean<optional>
false

rewind Rings Outer

options.mutateboolean<optional>
false

mutate the Input geoJSON

tool/ridge()

The tool.ridge function convert a regular grid (x,y,z) to a GeoJSON FeatureCollection (LineString). The aim is to draw a rideline map.

Properties
NameTypeAttributesDefaultDescription
gridarray

an array of object containig x,y,z values

options.xstring<optional>
"x"

field containg x values

options.ystring<optional>
"y"

field containg y values

options.zstring<optional>
"z"

field containg z values

options.knumber<optional>
100

height of highest peak

options.fixmaxnumber<optional>
null

a fixed value corresponding to the k

options.projectionboolean<optional>
d => d

projection

tool/symbols()

Display symbols available in geoviz

Properties
NameTypeAttributesDefaultDescription
options.widthnumber<optional>
800

width

Example
geoviz.tool.symbols({ width: 500 })

tool/typo()

The tool.typo function allows you to assign colors to qualitative data. It can be used to create typology maps. It returs an object containing types, colors, the color of the missing value and a function.

Properties
NameTypeAttributesDefaultDescription
dataArray.<number>

an array of numerical values.

options.colorsArray.<string><optional>
"Set3"

an array of colors or name of a color palette available in dicopal

options.missingstring<optional>
"white"

a color for missings values

Example
geoviz.tool.typo(world.features.map((d) => d.properties.region), {palette: "Pastel"})

tool/unproject()

The tool.unproject function allow to unproject geometries. It returns a GeoJSON FeatureCollection with wgs84 coordinates

Properties
NameTypeDescription
dataobject

a GeoJSON FeatureCollection

options.projectionfunction

projection definition. See d3-geo & d3-geo-projection

Example
let newGeoJSON = geoviz.tool.unproject(world, { projection: d3.geoOrthographic()})
\ No newline at end of file diff --git a/docs/grid_arbitrary.js.html b/docs/grid_arbitrary.js.html index 96d7409..ffc336d 100644 --- a/docs/grid_arbitrary.js.html +++ b/docs/grid_arbitrary.js.html @@ -1,6 +1,6 @@ Source: grid/arbitrary.js
On this page

grid_arbitrary.js

import { Delaunay } from "d3-delaunay";
+    
On this page

grid_arbitrary.js

import { Delaunay } from "d3-delaunay";
 const d3 = Object.assign({}, { Delaunay });
 
 /**
@@ -47,4 +47,4 @@
     features: result,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_count.js.html b/docs/grid_count.js.html new file mode 100644 index 0000000..e89f876 --- /dev/null +++ b/docs/grid_count.js.html @@ -0,0 +1,53 @@ +Source: grid/count.js
On this page

grid_count.js

import booleanPointInPolygon from "@turf/boolean-point-in-polygon";
+
+/**
+ * @function grid/count
+ * @description The `grid.count` function allows to count dots in polygons (e.g. grid cells)
+ * @see {@link https://observablehq.com/@neocartocnrs/regular-grids}
+ * @property {object} [dots] - dots geoJSON
+ * @property {object} [polygons] - polygons geoJSON (e.g. grid)
+ * @property {string} [var = undefined] - field (absolute quantitative data only)
+ */
+export function count(
+  opts = {
+    dots: undefined, // a FeatureCollection containg points
+    polygons: undefined, // a FeatureCollection containg polygons (grid)
+    var: undefined, // a field  (optional)
+  }
+) {
+  let polys = opts.polygons.features;
+  let dots = opts.dots.features;
+  let count = new Array(polys.length).fill(0);
+  let nb = dots.length;
+  let test = new Array(nb).fill(true);
+  polys.forEach((p, i) => {
+    dots.forEach((d, j) => {
+      if (test[j]) {
+        if (booleanPointInPolygon(d, p)) {
+          if (opts.var == undefined) {
+            count[i] = count[i] + 1;
+          } else {
+            count[i] = count[i] + parseFloat(d.properties[opts.var]);
+          }
+          test[j] = false;
+        }
+      }
+    });
+  });
+
+  // Rebuild grid
+  let output = polys
+    .map((d, i) => ({
+      type: d.type,
+      geometry: d.geometry,
+      properties: { ...d.properties, count: count[i] },
+    }))
+    .filter((d) => d.properties.count !== 0);
+
+  //const endTime = performance.now();
+  //const elapsedTime = endTime - startTime;
+  return { type: "FeatureCollection", features: output };
+}
+
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_diamond.js.html b/docs/grid_diamond.js.html index a72616a..3b7cc5f 100644 --- a/docs/grid_diamond.js.html +++ b/docs/grid_diamond.js.html @@ -1,6 +1,6 @@ Source: grid/diamond.js
On this page

grid_diamond.js

import { range } from "d3-array";
+    
On this page

grid_diamond.js

import { range } from "d3-array";
 const d3 = Object.assign({}, { range });
 
 /**
@@ -53,4 +53,4 @@
     features: result,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_dot.js.html b/docs/grid_dot.js.html index 922e25e..469318d 100644 --- a/docs/grid_dot.js.html +++ b/docs/grid_dot.js.html @@ -1,6 +1,6 @@ Source: grid/dot.js
On this page

grid_dot.js

import { range } from "d3-array";
+    
On this page

grid_dot.js

import { range } from "d3-array";
 const d3 = Object.assign({}, { range });
 
 /**
@@ -39,4 +39,4 @@
     features: result,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_h3.js.html b/docs/grid_h3.js.html index b38b0ad..510a170 100644 --- a/docs/grid_h3.js.html +++ b/docs/grid_h3.js.html @@ -1,6 +1,6 @@ Source: grid/h3.js
On this page

grid_h3.js

import {
+    
On this page

grid_h3.js

import {
   getRes0Cells,
   cellToChildren,
   isPentagon,
@@ -49,4 +49,4 @@
 
   return rewind ? rrewind(output) : output;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_hexbin.js.html b/docs/grid_hexbin.js.html index 43ccdf7..e276acd 100644 --- a/docs/grid_hexbin.js.html +++ b/docs/grid_hexbin.js.html @@ -1,6 +1,6 @@ Source: grid/hexbin.js
On this page

grid_hexbin.js

import { range, max } from "d3-array";
+    
On this page

grid_hexbin.js

import { range, max } from "d3-array";
 const d3 = Object.assign({}, { range, max });
 
 /**
@@ -55,4 +55,4 @@
     features: result,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_intersect.js.html b/docs/grid_intersect.js.html new file mode 100644 index 0000000..238ee87 --- /dev/null +++ b/docs/grid_intersect.js.html @@ -0,0 +1,73 @@ +Source: grid/intersect.js
On this page

grid_intersect.js

import { featureCollection } from "@turf/helpers";
+import { intersect } from "@turf/intersect";
+import { geoPath } from "d3-geo";
+import { groups } from "d3-array";
+const d3 = Object.assign({}, { geoPath, groups });
+
+/**
+ * @function grid/intersect
+ * @description The `grid.intersect` function allows to affect polygons values tu grid cells.
+ * @see {@link https://observablehq.com/@neocartocnrs/regular-grids}
+ * @property {object} [grid] - grid geoJSON
+ * @property {object} [polygons] - polygons geoJSON
+ * @property {string} [var = undefined] - field (absolute quantitative data only)
+ */
+
+// WARNING : BUG !!!!!!
+export function intersectpolys(
+  opts = {
+    grid: undefined, // a FeatureCollection containg points
+    polygons: undefined, // a FeatureCollection containg polygons (grid)
+    var: undefined, // a field
+  }
+) {
+  let grid = opts.grid.features;
+  let polys = opts.polygons.features;
+  let gridbyindex = new Map(grid.map((d, i) => [i, d]));
+
+  let arr = [];
+  polys.forEach((p, i) => {
+    const area = d3.geoPath().area(p);
+    grid.forEach((g, j) => {
+      const f = intersect(featureCollection([p, g]));
+      if (f !== null) {
+        let areapiece = d3.geoPath().area(f);
+        arr.push([i, j, areapiece / area]);
+      }
+    });
+  });
+
+  let accessor;
+  if (opts.var) {
+    accessor = new Map(
+      polys.map((d, i) => [i, parseFloat(d.properties[opts.var]) || 0])
+    );
+  } else {
+    accessor = new Map(polys.map((d, i) => [i, 1]));
+  }
+
+  let datagrid = d3.groups(arr, (d) => d[1]);
+
+  function getsum(cell) {
+    let sum = 0;
+    cell[1].forEach((d) => {
+      sum += accessor.get(d[0]) * d[2];
+    });
+    return sum == 0 ? undefined : sum;
+  }
+
+  return {
+    type: "FeatureCollection",
+    features: datagrid.map((d) => {
+      let tmp = gridbyindex.get(d[0]);
+      return {
+        type: tmp.type,
+        properties: { ...tmp.properties, sum: getsum(d) },
+        geometry: tmp.geometry,
+      };
+    }),
+  };
+}
+
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_make.js.html b/docs/grid_make.js.html index df5b3d7..bddc3a1 100644 --- a/docs/grid_make.js.html +++ b/docs/grid_make.js.html @@ -1,6 +1,6 @@ Source: grid/make.js
On this page

grid_make.js

import { square } from "./square.js";
+    
On this page

grid_make.js

import { square } from "./square.js";
 import { dot } from "./dot.js";
 import { diamond } from "./diamond.js";
 import { arbitrary } from "./arbitrary.js";
@@ -63,4 +63,4 @@
       break;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_square.js.html b/docs/grid_square.js.html index 3f27d80..61ae57d 100644 --- a/docs/grid_square.js.html +++ b/docs/grid_square.js.html @@ -1,6 +1,6 @@ Source: grid/square.js
On this page

grid_square.js

import { range } from "d3-array";
+    
On this page

grid_square.js

import { range } from "d3-array";
 const d3 = Object.assign({}, { range });
 
 /**
@@ -48,4 +48,4 @@
     features: result,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/grid_triangle.js.html b/docs/grid_triangle.js.html index d98182e..5f0a379 100644 --- a/docs/grid_triangle.js.html +++ b/docs/grid_triangle.js.html @@ -1,6 +1,6 @@ Source: grid/triangle.js
On this page

grid_triangle.js

import { range, max } from "d3-array";
+    
On this page

grid_triangle.js

import { range, max } from "d3-array";
 const d3 = Object.assign({}, { range, max });
 
 /**
@@ -69,4 +69,4 @@
     features: result,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/helpers_tooltip.js.html b/docs/helpers_tooltip.js.html index c61a9f4..1ef9c41 100644 --- a/docs/helpers_tooltip.js.html +++ b/docs/helpers_tooltip.js.html @@ -1,6 +1,6 @@ Source: helpers/tooltip.js
On this page

helpers_tooltip.js

import { select, pointers } from "d3-selection";
+    
On this page

helpers_tooltip.js

import { select, pointers } from "d3-selection";
 const d3 = Object.assign({}, { select, pointers });
 
 /**
@@ -72,10 +72,10 @@
 
   //if input == string
   if (typeof tip === "string") {
-    const sortfields = fields.sort((a, b) => b.length - a.length);
     fields.forEach((d) => {
-      tip = tip.replace(`$${d}`, `\${d.properties.${d}}`);
+      tip = tip.replace(`$${d}`, `\${d.properties["${d}"]}`);
     });
+    console.log(tip);
     tip = eval("d => `" + tip + "`");
   }
 
@@ -99,7 +99,8 @@
     keys = Array.from(new Set(keys.flat()));
 
     let str = [];
-    keys.forEach((d) => str.push(`${d}: \${d.properties.${d}}`));
+    keys.forEach((d) => str.push(`${[d]}: \${d.properties["${d}"]}`));
+
     tip = eval("(d) => `" + str.join("\n") + "`");
   }
 
@@ -274,4 +275,4 @@
     });
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/index.html b/docs/index.html index a11c649..eea1b41 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1,6 +1,6 @@ Geoviz
On this page

npm jsdeliver license code size github stars

Geoviz JavaScript library

Tags #cartography #maps #geoviz #dataviz #JSspatial #Observable #FrontEndCartography

geoviz is a JavaScript library for designing thematic maps. The library provides a set of d3 compatible functions that you can mix with the usual d3 syntax. The library is designed to be intuitive and concise. It allow to manage different geographic layers (points, lines, polygons) and marks (circles, labels, scale bar, title, north arrow, etc.) to design pretty maps. Its use is particularly well suited to Observable notebooks. Maps deigned with geoviz are:

🌏 live demo Observable notebook simple map choropleth typology bubble dorling Mercator tiles

💻 Source code github

💡 Suggestions/bugs issues

Installation

In the browser

<script src="https://cdn.jsdelivr.net/npm/geoviz" charset="utf-8"></script>
+    
On this page

npm jsdeliver license code size github stars

Geoviz JavaScript library

Tags #cartography #maps #geoviz #dataviz #JSspatial #Observable #FrontEndCartography

geoviz is a JavaScript library for designing thematic maps. The library provides a set of d3 compatible functions that you can mix with the usual d3 syntax. The library is designed to be intuitive and concise. It allow to manage different geographic layers (points, lines, polygons) and marks (circles, labels, scale bar, title, north arrow, etc.) to design pretty maps. Its use is particularly well suited to Observable notebooks. Maps deigned with geoviz are:

🌏 live demo Observable notebook simple map choropleth typology bubble dorling Mercator tiles

💻 Source code github

💡 Suggestions/bugs issues

Installation

In the browser

<script src="https://cdn.jsdelivr.net/npm/geoviz" charset="utf-8"></script>
 

In Observable notebooks

geoviz = require("geoviz")
 

Marks

The geoviz library provides several graphic marks that will allow you to draw your maps. circles, semi-circles, graticules, paths, scale, legends... Each mark has a specific function.

📚 Map marks path() circle() square() halfcircle() spike() tile()

📚 Layout marks header() footer() graticule() outline() north() scalebar() text()

📚 Legend marks legend.box() legend.choro_horizontal() legend.choro_vertical() legend.circles_half() legend.circles_nested() legend.circles() legend.squares() legend.squares_nested() legend.mushrooms() legend.spikes() legend.typo_horizontal() legend.typo_vertical()

For example:

// To display a geoJSON
 viz.path({data: *a geoJSON*})
@@ -48,4 +48,4 @@
 

📚 plot/choro()

🌏 live demo choropleth

Typology

By using type = "typo", you can design a qualitative typo map. Find below a minimal example.

geoviz.plot({type = "typo", data = *a geoJSON*, var = *a field*})
 

📚 plot/typo()

🌏 live demo typology

Proportional symbols + choropleth

By using type = "propchoro", you can design a map with proportionnal symbols with graduated colors. Find below a minimal example.

geoviz.plot({type = "propchoro", data = *a geoJSON*, var1 = *a field*, var2 = *a field*})
 

📚 plot/propchoro()

🌏 live demo prop

Proportional symbols + typology

By using type = "proptypo", you can design a map with proportionnal symbols with qualitative colors. Find below a minimal example.

geoviz.plot({type = "proptypo", data = *a geoJSON*, var1 = *a field*, var2 = *a field*})
-

📚 plot/proptypo()

🌏 live demo prop

Interactivity

Maps created by geoviz are zoomable and interactive.

🌏 live demo tooltip pan and zoom interactivity

Helpers

Finally, geoviz provides a toolbox of useful functions for cartography.

📚 tool.addfonts() tool/centroid() tool.choro() tool.typo() tool.dissolve() tool.dodge() tool.featurecollection() tool.geotable() tool.rewind() tool.merge() tool.proj4d3() tool.project() tool.unproject() tool.replicate() tool.ridge() tool.random() tool.radius()

🌏 live demo Handle geometries

Nicolas Lambert 2024 - MIT License
\ No newline at end of file +

📚 plot/proptypo()

🌏 live demo prop

Interactivity

Maps created by geoviz are zoomable and interactive.

🌏 live demo tooltip pan and zoom interactivity

Helpers

Finally, geoviz provides a toolbox of useful functions for cartography.

📚 tool.addfonts() tool/centroid() tool.choro() tool.typo() tool.dissolve() tool.dodge() tool.featurecollection() tool.geotable() tool.rewind() tool.merge() tool.proj4d3() tool.project() tool.unproject() tool.replicate() tool.ridge() tool.random() tool.radius()

🌏 live demo Handle geometries

Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_box.js.html b/docs/legend_box.js.html index 22a82d1..3543697 100644 --- a/docs/legend_box.js.html +++ b/docs/legend_box.js.html @@ -1,6 +1,6 @@ Source: legend/box.js
On this page

legend_box.js

import { create } from "../container/create";
+    
On this page

legend_box.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { getsize } from "../helpers/getsize";
@@ -140,4 +140,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_choro-horizontal.js.html b/docs/legend_choro-horizontal.js.html index c8650b1..c715a8a 100644 --- a/docs/legend_choro-horizontal.js.html +++ b/docs/legend_choro-horizontal.js.html @@ -1,6 +1,6 @@ Source: legend/choro-horizontal.js
On this page

legend_choro-horizontal.js

import { create } from "../container/create";
+    
On this page

legend_choro-horizontal.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { roundarray } from "../helpers/rounding";
@@ -218,4 +218,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_choro-vertical.js.html b/docs/legend_choro-vertical.js.html index 98893bc..d50f4fa 100644 --- a/docs/legend_choro-vertical.js.html +++ b/docs/legend_choro-vertical.js.html @@ -1,6 +1,6 @@ Source: legend/choro-vertical.js
On this page

legend_choro-vertical.js

import { create } from "../container/create";
+    
On this page

legend_choro-vertical.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { roundarray } from "../helpers/rounding";
@@ -224,4 +224,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_circles-half.js.html b/docs/legend_circles-half.js.html index 62031ed..bb7a18c 100644 --- a/docs/legend_circles-half.js.html +++ b/docs/legend_circles-half.js.html @@ -1,6 +1,6 @@ Source: legend/circles-half.js
On this page

legend_circles-half.js

import { create } from "../container/create.js";
+    
On this page

legend_circles-half.js

import { create } from "../container/create.js";
 import { render } from "../container/render.js";
 import { camelcasetodash } from "../helpers/camelcase.js";
 import { datatoradius } from "../helpers/datatoradius.js";
@@ -253,4 +253,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_circles-nested.js.html b/docs/legend_circles-nested.js.html index d3f1788..6d4b242 100644 --- a/docs/legend_circles-nested.js.html +++ b/docs/legend_circles-nested.js.html @@ -1,6 +1,6 @@ Source: legend/circles-nested.js
On this page

legend_circles-nested.js

import { create } from "../container/create";
+    
On this page

legend_circles-nested.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { datatoradius } from "../helpers/datatoradius";
@@ -240,4 +240,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_circles.js.html b/docs/legend_circles.js.html index beadea2..cc24ae7 100644 --- a/docs/legend_circles.js.html +++ b/docs/legend_circles.js.html @@ -1,6 +1,6 @@ Source: legend/circles.js
On this page

legend_circles.js

import { create } from "../container/create";
+    
On this page

legend_circles.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { datatoradius } from "../helpers/datatoradius";
@@ -249,4 +249,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_mushrooms.js.html b/docs/legend_mushrooms.js.html index dd33f21..72afc9f 100644 --- a/docs/legend_mushrooms.js.html +++ b/docs/legend_mushrooms.js.html @@ -1,6 +1,6 @@ Source: legend/mushrooms.js
On this page

legend_mushrooms.js

import { create } from "../container/create.js";
+    
On this page

legend_mushrooms.js

import { create } from "../container/create.js";
 import { render } from "../container/render.js";
 import { camelcasetodash } from "../helpers/camelcase.js";
 import { datatoradius } from "../helpers/datatoradius.js";
@@ -427,4 +427,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_spikes.js.html b/docs/legend_spikes.js.html index f97f2b5..5e24cfc 100644 --- a/docs/legend_spikes.js.html +++ b/docs/legend_spikes.js.html @@ -1,6 +1,6 @@ Source: legend/spikes.js
On this page

legend_spikes.js

import { create } from "../container/create.js";
+    
On this page

legend_spikes.js

import { create } from "../container/create.js";
 import { render } from "../container/render.js";
 import { camelcasetodash } from "../helpers/camelcase.js";
 import { datatoheight } from "../helpers/datatoheight.js";
@@ -204,4 +204,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_squares-nested.js.html b/docs/legend_squares-nested.js.html index 167b1f1..f9e66d2 100644 --- a/docs/legend_squares-nested.js.html +++ b/docs/legend_squares-nested.js.html @@ -1,6 +1,6 @@ Source: legend/squares-nested.js
On this page

legend_squares-nested.js

import { create } from "../container/create";
+    
On this page

legend_squares-nested.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { datatoradius } from "../helpers/datatoradius";
@@ -244,4 +244,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_squares.js.html b/docs/legend_squares.js.html index 1e8d4f8..d386927 100644 --- a/docs/legend_squares.js.html +++ b/docs/legend_squares.js.html @@ -1,6 +1,6 @@ Source: legend/squares.js
On this page

legend_squares.js

import { create } from "../container/create";
+    
On this page

legend_squares.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { datatoradius } from "../helpers/datatoradius";
@@ -256,4 +256,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_symbol-horizontal.js.html b/docs/legend_symbol-horizontal.js.html index eb70342..ec1845f 100644 --- a/docs/legend_symbol-horizontal.js.html +++ b/docs/legend_symbol-horizontal.js.html @@ -1,6 +1,6 @@ Source: legend/symbol-horizontal.js
On this page

legend_symbol-horizontal.js

import { create } from "../container/create";
+    
On this page

legend_symbol-horizontal.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { getsize } from "../helpers/getsize";
@@ -244,4 +244,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_symbol-vertical.js.html b/docs/legend_symbol-vertical.js.html index e671484..8c8c693 100644 --- a/docs/legend_symbol-vertical.js.html +++ b/docs/legend_symbol-vertical.js.html @@ -1,6 +1,6 @@ Source: legend/symbol-vertical.js
On this page

legend_symbol-vertical.js

import { create } from "../container/create";
+    
On this page

legend_symbol-vertical.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { getsize } from "../helpers/getsize";
@@ -241,4 +241,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_typo-horizontal.js.html b/docs/legend_typo-horizontal.js.html index f63bd07..db40701 100644 --- a/docs/legend_typo-horizontal.js.html +++ b/docs/legend_typo-horizontal.js.html @@ -1,6 +1,6 @@ Source: legend/typo-horizontal.js
On this page

legend_typo-horizontal.js

import { create } from "../container/create";
+    
On this page

legend_typo-horizontal.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { getsize } from "../helpers/getsize";
@@ -208,4 +208,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/legend_typo-vertical.js.html b/docs/legend_typo-vertical.js.html index 612a966..4755966 100644 --- a/docs/legend_typo-vertical.js.html +++ b/docs/legend_typo-vertical.js.html @@ -1,6 +1,6 @@ Source: legend/typo-vertical.js
On this page

legend_typo-vertical.js

import { create } from "../container/create";
+    
On this page

legend_typo-vertical.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash } from "../helpers/camelcase";
 import { getsize } from "../helpers/getsize";
@@ -209,4 +209,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_circle.js.html b/docs/mark_circle.js.html index 5911124..1cd3f1c 100644 --- a/docs/mark_circle.js.html +++ b/docs/mark_circle.js.html @@ -1,6 +1,6 @@ Source: mark/circle.js
On this page

mark_circle.js

import { scaleSqrt } from "d3-scale";
+    
On this page

mark_circle.js

import { scaleSqrt } from "d3-scale";
 import { max, descending } from "d3-array";
 import { geoPath, geoIdentity } from "d3-geo";
 const d3 = Object.assign(
@@ -324,4 +324,4 @@
       return (d) => attr;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_footer.js.html b/docs/mark_footer.js.html index 6af61c5..a1072d3 100644 --- a/docs/mark_footer.js.html +++ b/docs/mark_footer.js.html @@ -1,6 +1,6 @@ Source: mark/footer.js
On this page

mark_footer.js

import { create } from "../container/create";
+    
On this page

mark_footer.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash, getsize, unique } from "../helpers/utils";
 
@@ -171,4 +171,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_graticule.js.html b/docs/mark_graticule.js.html index a6aa08f..24d74f8 100644 --- a/docs/mark_graticule.js.html +++ b/docs/mark_graticule.js.html @@ -1,6 +1,6 @@ Source: mark/graticule.js
On this page

mark_graticule.js

import { create } from "../container/create";
+    
On this page

mark_graticule.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash, unique } from "../helpers/utils";
 import { geoGraticule, geoPath, geoNaturalEarth1 } from "d3-geo";
@@ -131,4 +131,4 @@
     }
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_halfcircle.js.html b/docs/mark_halfcircle.js.html index 26f6e21..34f418b 100644 --- a/docs/mark_halfcircle.js.html +++ b/docs/mark_halfcircle.js.html @@ -1,6 +1,6 @@ Source: mark/halfcircle.js
On this page

mark_halfcircle.js

import { scaleSqrt } from "d3-scale";
+    
On this page

mark_halfcircle.js

import { scaleSqrt } from "d3-scale";
 import { arc } from "d3-shape";
 import { max, descending } from "d3-array";
 import { geoPath, geoIdentity } from "d3-geo";
@@ -339,4 +339,4 @@
       return (d) => attr;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_header.js.html b/docs/mark_header.js.html index 1f0f887..2ebb8a7 100644 --- a/docs/mark_header.js.html +++ b/docs/mark_header.js.html @@ -1,6 +1,6 @@ Source: mark/header.js
On this page

mark_header.js

import { create } from "../container/create";
+    
On this page

mark_header.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash, getsize, unique } from "../helpers/utils";
 
@@ -171,4 +171,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_north.js.html b/docs/mark_north.js.html index fea7194..9237b26 100644 --- a/docs/mark_north.js.html +++ b/docs/mark_north.js.html @@ -1,6 +1,6 @@ Source: mark/north.js
On this page

mark_north.js

import { create } from "../container/create";
+    
On this page

mark_north.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { camelcasetodash, unique, northangle } from "../helpers/utils";
 import { geoNaturalEarth1 } from "d3-geo";
@@ -123,4 +123,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_outline.js.html b/docs/mark_outline.js.html index 62376a6..bea5313 100644 --- a/docs/mark_outline.js.html +++ b/docs/mark_outline.js.html @@ -1,6 +1,6 @@ Source: mark/outline.js
On this page

mark_outline.js

import { geoPath, geoNaturalEarth1 } from "d3-geo";
+    
On this page

mark_outline.js

import { geoPath, geoNaturalEarth1 } from "d3-geo";
 const d3 = Object.assign({}, { geoPath, geoNaturalEarth1 });
 import { create } from "../container/create";
 import { render } from "../container/render";
@@ -110,4 +110,4 @@
     }
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_path.js.html b/docs/mark_path.js.html index a76abb8..a2fe126 100644 --- a/docs/mark_path.js.html +++ b/docs/mark_path.js.html @@ -1,6 +1,6 @@ Source: mark/path.js
On this page

mark_path.js

import { geoPath, geoIdentity } from "d3-geo";
+    
On this page

mark_path.js

import { geoPath, geoIdentity } from "d3-geo";
 const d3 = Object.assign({}, { geoPath, geoIdentity });
 import { create } from "../container/create";
 import { render } from "../container/render";
@@ -241,4 +241,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_scalebar.js.html b/docs/mark_scalebar.js.html index 82dbce5..14eb7bf 100644 --- a/docs/mark_scalebar.js.html +++ b/docs/mark_scalebar.js.html @@ -1,6 +1,6 @@ Source: mark/scalebar.js
On this page

mark_scalebar.js

import * as geoScaleBar from "d3-geo-scale-bar";
+    
On this page

mark_scalebar.js

import * as geoScaleBar from "d3-geo-scale-bar";
 import { geoNaturalEarth1 } from "d3-geo";
 const d3 = Object.assign({ geoNaturalEarth1 }, geoScaleBar);
 import { create } from "../container/create";
@@ -155,4 +155,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_spike.js.html b/docs/mark_spike.js.html index 6332052..9162440 100644 --- a/docs/mark_spike.js.html +++ b/docs/mark_spike.js.html @@ -1,6 +1,6 @@ Source: mark/spike.js
On this page

mark_spike.js

import { scaleSqrt } from "d3-scale";
+    
On this page

mark_spike.js

import { scaleSqrt } from "d3-scale";
 import { max, descending } from "d3-array";
 import { geoPath, geoIdentity } from "d3-geo";
 const d3 = Object.assign(
@@ -319,4 +319,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_square.js.html b/docs/mark_square.js.html index ea2b3ea..bde2e6e 100644 --- a/docs/mark_square.js.html +++ b/docs/mark_square.js.html @@ -1,6 +1,6 @@ Source: mark/square.js
On this page

mark_square.js

import { scaleSqrt } from "d3-scale";
+    
On this page

mark_square.js

import { scaleSqrt } from "d3-scale";
 import { arc } from "d3-shape";
 import { radius as computeradius } from "../tool/radius";
 import { max, descending } from "d3-array";
@@ -325,4 +325,4 @@
       return (d) => attr;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_symbol.js.html b/docs/mark_symbol.js.html index 54e551f..9e67bfe 100644 --- a/docs/mark_symbol.js.html +++ b/docs/mark_symbol.js.html @@ -1,6 +1,6 @@ Source: mark/symbol.js
On this page

mark_symbol.js

import { scaleSqrt } from "d3-scale";
+    
On this page

mark_symbol.js

import { scaleSqrt } from "d3-scale";
 import { max, descending } from "d3-array";
 import { geoPath, geoIdentity } from "d3-geo";
 const d3 = Object.assign(
@@ -485,4 +485,4 @@
     }
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_text.js.html b/docs/mark_text.js.html index 4327ff5..fb6726c 100644 --- a/docs/mark_text.js.html +++ b/docs/mark_text.js.html @@ -1,6 +1,6 @@ Source: mark/text.js
On this page

mark_text.js

import { geoPath, geoIdentity, geoCentroid } from "d3-geo";
+    
On this page

mark_text.js

import { geoPath, geoIdentity, geoCentroid } from "d3-geo";
 const d3 = Object.assign({}, { geoPath, geoIdentity, geoCentroid });
 import { create } from "../container/create";
 import { render } from "../container/render";
@@ -275,4 +275,4 @@
     return `#${opts.id}`;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/mark_tile.js.html b/docs/mark_tile.js.html index df2b602..e47b448 100644 --- a/docs/mark_tile.js.html +++ b/docs/mark_tile.js.html @@ -1,6 +1,6 @@ Source: mark/tile.js
On this page

mark_tile.js

import { tile as d3tile } from "d3-tile";
+    
On this page

mark_tile.js

import { tile as d3tile } from "d3-tile";
 import { geoMercator } from "d3-geo";
 import { create } from "../container/create";
 import { render } from "../container/render";
@@ -254,4 +254,4 @@
       `  https://server.arcgisonline.com/ArcGIS/rest/services/World_Terrain_Base/MapServer/tile/${z}/${y}/${x}`,
   },
 ];
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot.js.html b/docs/plot_plot.js.html index 087d9f4..48f5718 100644 --- a/docs/plot_plot.js.html +++ b/docs/plot_plot.js.html @@ -1,6 +1,6 @@ Source: plot/plot.js
On this page

plot_plot.js

// Marks
+    
On this page

plot_plot.js

// Marks
 import { graticule } from "../mark/graticule";
 import { outline } from "../mark/outline";
 import { path } from "../mark/path";
@@ -231,4 +231,4 @@
       break;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot_choro.js.html b/docs/plot_plot_choro.js.html index a18c6c7..2a92696 100644 --- a/docs/plot_plot_choro.js.html +++ b/docs/plot_plot_choro.js.html @@ -1,6 +1,6 @@ Source: plot/plot_choro.js
On this page

plot_plot_choro.js

import { choro } from "../tool/choro";
+    
On this page

plot_plot_choro.js

import { choro } from "../tool/choro";
 import { create } from "../container/create";
 import { path } from "../mark/path";
 import { render } from "../container/render";
@@ -171,4 +171,4 @@
     return ids;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot_prop.js.html b/docs/plot_plot_prop.js.html index c8473c3..c9568df 100644 --- a/docs/plot_plot_prop.js.html +++ b/docs/plot_plot_prop.js.html @@ -1,6 +1,6 @@ Source: plot/plot_prop.js
On this page

plot_plot_prop.js

import { create } from "../container/create";
+    
On this page

plot_plot_prop.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { implantation, unique } from "../helpers/utils";
 
@@ -165,4 +165,4 @@
     return ids;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot_propchoro.js.html b/docs/plot_plot_propchoro.js.html index 6620543..bdefcb2 100644 --- a/docs/plot_plot_propchoro.js.html +++ b/docs/plot_plot_propchoro.js.html @@ -1,6 +1,6 @@ Source: plot/plot_propchoro.js
On this page

plot_plot_propchoro.js

import { create } from "../container/create";
+    
On this page

plot_plot_propchoro.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { choro } from "../tool/choro";
 import { choro_vertical } from "../legend/choro-vertical";
@@ -244,4 +244,4 @@
     return ids;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot_proptypo.js.html b/docs/plot_plot_proptypo.js.html index 7894008..56a6939 100644 --- a/docs/plot_plot_proptypo.js.html +++ b/docs/plot_plot_proptypo.js.html @@ -1,6 +1,6 @@ Source: plot/plot_proptypo.js
On this page

plot_plot_proptypo.js

import { create } from "../container/create";
+    
On this page

plot_plot_proptypo.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { typo } from "../tool/typo";
 import { typo_vertical } from "../legend/typo-vertical";
@@ -232,4 +232,4 @@
     return ids;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot_symbol.js.html b/docs/plot_plot_symbol.js.html index 8d49bc5..bbbc518 100644 --- a/docs/plot_plot_symbol.js.html +++ b/docs/plot_plot_symbol.js.html @@ -1,6 +1,6 @@ Source: plot/plot_symbol.js
On this page

plot_plot_symbol.js

import { create } from "../container/create";
+    
On this page

plot_plot_symbol.js

import { create } from "../container/create";
 import { render } from "../container/render";
 import { implantation, propertiesentries } from "../helpers/utils";
 import { picto } from "../helpers/picto";
@@ -175,4 +175,4 @@
     }
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/plot_plot_typo.js.html b/docs/plot_plot_typo.js.html index c7ae844..7de44d3 100644 --- a/docs/plot_plot_typo.js.html +++ b/docs/plot_plot_typo.js.html @@ -1,6 +1,6 @@ Source: plot/plot_typo.js
On this page

plot_plot_typo.js

import { typo } from "../tool/typo";
+    
On this page

plot_plot_typo.js

import { typo } from "../tool/typo";
 import { create } from "../container/create";
 import { path } from "../mark/path";
 import { render } from "../container/render";
@@ -159,4 +159,4 @@
     return ids;
   }
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_addfonts.js.html b/docs/tool_addfonts.js.html index 2619282..99cbf06 100644 --- a/docs/tool_addfonts.js.html +++ b/docs/tool_addfonts.js.html @@ -1,6 +1,6 @@ Source: tool/addfonts.js
On this page

tool_addfonts.js

/**
+    
On this page

tool_addfonts.js

/**
  * @function tool/addonts
  * @description The `tool.addonts` function allows add font to the document from an url.
  * @property {string} fontFamily - font family name
@@ -21,4 +21,4 @@
   });
   return fontNames;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_centroid.js.html b/docs/tool_centroid.js.html index 9df4f5c..8498950 100644 --- a/docs/tool_centroid.js.html +++ b/docs/tool_centroid.js.html @@ -1,6 +1,6 @@ Source: tool/centroid.js
On this page

tool_centroid.js

// Imports
+    
On this page

tool_centroid.js

// Imports
 import { geoArea, geoCentroid, geoIdentity, geoPath } from "d3-geo";
 const d3 = Object.assign({}, { geoArea, geoCentroid, geoIdentity, geoPath });
 
@@ -61,4 +61,4 @@
 
   return geojson;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_choro.js.html b/docs/tool_choro.js.html index 6737b8a..50d8c75 100644 --- a/docs/tool_choro.js.html +++ b/docs/tool_choro.js.html @@ -1,6 +1,6 @@ Source: tool/choro.js
On this page

tool_choro.js

import { isNumber } from "../helpers/isnuber";
+    
On this page

tool_choro.js

import { isNumber } from "../helpers/isnuber";
 import * as discr from "statsbreaks";
 import { getColors, getPalettes } from "dicopal";
 // import { getColors } from "dicopal";
@@ -106,4 +106,4 @@
 
   return cols;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_dissolve.js.html b/docs/tool_dissolve.js.html index 2cd34ce..19324ea 100644 --- a/docs/tool_dissolve.js.html +++ b/docs/tool_dissolve.js.html @@ -1,6 +1,6 @@ Source: tool/dissolve.js
On this page

tool_dissolve.js

import { geoArea } from "d3-geo";
+    
On this page

tool_dissolve.js

import { geoArea } from "d3-geo";
 const d3 = Object.assign({}, { geoArea });
 
 /**
@@ -57,4 +57,4 @@
 
   return JSON.parse(JSON.stringify(result));
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_dodge.js.html b/docs/tool_dodge.js.html index 4552072..c598e7a 100644 --- a/docs/tool_dodge.js.html +++ b/docs/tool_dodge.js.html @@ -1,6 +1,6 @@ Source: tool/dodge.js
On this page

tool_dodge.js

import { forceX, forceY, forceCollide, forceSimulation } from "d3-force";
+    
On this page

tool_dodge.js

import { forceX, forceY, forceCollide, forceSimulation } from "d3-force";
 import { max } from "d3-array";
 import { scaleSqrt } from "d3-scale";
 const d3 = Object.assign(
@@ -107,4 +107,4 @@
 
   return { type: "FeatureCollection", crs: null, features: rawfeatures };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_dotstogrid.js.html b/docs/tool_dotstogrid.js.html index 8668de3..e67e075 100644 --- a/docs/tool_dotstogrid.js.html +++ b/docs/tool_dotstogrid.js.html @@ -1,6 +1,6 @@ Source: tool/dotstogrid.js
On this page

tool_dotstogrid.js

// Imports
+    
On this page

tool_dotstogrid.js

// Imports
 import { range, max } from "d3-array";
 import { Delaunay } from "d3-delaunay";
 import { geoProject } from "d3-geo-projection";
@@ -246,4 +246,4 @@
   });
   return result;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_featurecollection.js.html b/docs/tool_featurecollection.js.html index e99272a..2ab865d 100644 --- a/docs/tool_featurecollection.js.html +++ b/docs/tool_featurecollection.js.html @@ -1,6 +1,6 @@ Source: tool/featurecollection.js
On this page

tool_featurecollection.js

import { whatisit } from "../helpers/whatisit";
+    
On this page

tool_featurecollection.js

import { whatisit } from "../helpers/whatisit";
 import { coords2geo } from "../helpers/coords2geo";
 import { bbox } from "../helpers/bbox";
 
@@ -99,4 +99,4 @@
 
   return { type: "FeatureCollection", features };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_geotable.js.html b/docs/tool_geotable.js.html index ab11056..95f62f2 100644 --- a/docs/tool_geotable.js.html +++ b/docs/tool_geotable.js.html @@ -1,6 +1,6 @@ Source: tool/geotable.js
On this page

tool_geotable.js

/**
+    
On this page

tool_geotable.js

/**
  * @function tool/geotable
  * @description `geotable` is a function to create an array on objects containing properties and geomeytries, froam a GeoJSON FeatureCollection. This makes it easy to sort, extract data, etc. tool.featurecollection(geotable, { geometry: "geometry" }) can be used to rebuild a valid geoJSON. The function returns an array of an array of FeatureCollections.
  * @see {@link https://observablehq.com/@neocartocnrs/handle-geometries}
@@ -15,4 +15,4 @@
   );
   return table;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_height.js.html b/docs/tool_height.js.html index 8f9885b..fa860b1 100644 --- a/docs/tool_height.js.html +++ b/docs/tool_height.js.html @@ -1,6 +1,6 @@ Source: tool/height.js
On this page

tool_height.js

import { isNumber } from "../helpers/utils";
+    
On this page

tool_height.js

import { isNumber } from "../helpers/utils";
 import { max, extent } from "d3-array";
 import { scaleLinear } from "d3-scale";
 const d3 = Object.assign({}, { scaleLinear, max, extent });
@@ -26,4 +26,4 @@
     h: d3.scaleLinear().domain([0, valmax]).range([0, k]).unknown(0),
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_merge.js.html b/docs/tool_merge.js.html index 816d8a7..21e3552 100644 --- a/docs/tool_merge.js.html +++ b/docs/tool_merge.js.html @@ -1,6 +1,6 @@ Source: tool/merge.js
On this page

tool_merge.js

import { columns } from "../helpers/utils";
+    
On this page

tool_merge.js

import { columns } from "../helpers/utils";
 
 /**
  * @function tool/merge
@@ -111,4 +111,4 @@
 
   return [newArray, accessor.get(id)];
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_proj4d3.js.html b/docs/tool_proj4d3.js.html index e80a111..b5ae5f1 100644 --- a/docs/tool_proj4d3.js.html +++ b/docs/tool_proj4d3.js.html @@ -1,6 +1,6 @@ Source: tool/proj4d3.js
On this page

tool_proj4d3.js

import { geoProjection } from "d3-geo";
+    
On this page

tool_proj4d3.js

import { geoProjection } from "d3-geo";
 const d3 = Object.assign({}, { geoProjection });
 
 /**
@@ -30,4 +30,4 @@
   projection.raw = raw;
   return projection;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_project.js.html b/docs/tool_project.js.html index 0f38268..9d1250d 100644 --- a/docs/tool_project.js.html +++ b/docs/tool_project.js.html @@ -1,6 +1,6 @@ Source: tool/project.js
On this page

tool_project.js

import { geoProject } from "d3-geo-projection";
+    
On this page

tool_project.js

import { geoProject } from "d3-geo-projection";
 const d3 = Object.assign({}, { geoProject });
 
 /**
@@ -15,4 +15,4 @@
 export function project(data, { projection = null } = {}) {
   return projection == null ? data : d3.geoProject(data, projection);
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_radius.js.html b/docs/tool_radius.js.html index 2a78fcd..66ed52f 100644 --- a/docs/tool_radius.js.html +++ b/docs/tool_radius.js.html @@ -1,6 +1,6 @@ Source: tool/radius.js
On this page

tool_radius.js

import { isNumber } from "../helpers/utils";
+    
On this page

tool_radius.js

import { isNumber } from "../helpers/utils";
 import { max, extent } from "d3-array";
 import { scaleSqrt } from "d3-scale";
 const d3 = Object.assign({}, { scaleSqrt, max, extent });
@@ -38,4 +38,4 @@
     r: d3.scaleSqrt([0, valmax], [0, k]),
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_random.js.html b/docs/tool_random.js.html index b1bdeb4..bc2995d 100644 --- a/docs/tool_random.js.html +++ b/docs/tool_random.js.html @@ -1,6 +1,6 @@ Source: tool/random.js
On this page

tool_random.js

/**
+    
On this page

tool_random.js

/**
  * @function tool/random
  * @description The `tool.random` function returns a random color among 20 predefined colors.
  */
@@ -29,4 +29,4 @@
   ];
   return cols[Math.floor(Math.random() * cols.length)];
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_replicate.js.html b/docs/tool_replicate.js.html index a72a21a..fcae958 100644 --- a/docs/tool_replicate.js.html +++ b/docs/tool_replicate.js.html @@ -1,6 +1,6 @@ Source: tool/replicate.js
On this page

tool_replicate.js

import { sum } from "d3-array";
+    
On this page

tool_replicate.js

import { sum } from "d3-array";
 const d3 = Object.assign({}, { sum });
 
 /**
@@ -31,4 +31,4 @@
   x.features = output;
   return x;
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_rewind.js.html b/docs/tool_rewind.js.html index b3019ea..db64133 100644 --- a/docs/tool_rewind.js.html +++ b/docs/tool_rewind.js.html @@ -1,6 +1,6 @@ Source: tool/rewind.js
On this page

tool_rewind.js

/**
+    
On this page

tool_rewind.js

/**
  * @function tool/rewind
  * @description The `tool.rewind` function allows to generate compliant Polygon and MultiPolygon geometries. Adapted from MapBox geojson-rewind code (https://github.com/mapbox/grojson-rewind) under ISC license
  * @see {@link https://observablehq.com/@neocartocnrs/handle-geometries}
@@ -45,4 +45,4 @@
   }
   if (tArea + err >= 0 !== !!dir) ring.reverse();
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_ridge.js.html b/docs/tool_ridge.js.html index 011fab1..1daba5f 100644 --- a/docs/tool_ridge.js.html +++ b/docs/tool_ridge.js.html @@ -1,6 +1,6 @@ Source: tool/ridge.js
On this page

tool_ridge.js

import { scaleLinear } from "d3-scale";
+    
On this page

tool_ridge.js

import { scaleLinear } from "d3-scale";
 import { min, max, mean, mode } from "d3-array";
 const d3 = Object.assign({}, { scaleLinear, min, max, mean, mode });
 
@@ -123,4 +123,4 @@
   }
   return d3.mode(arr);
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_symbols.js.html b/docs/tool_symbols.js.html index 03e3416..03bfd4f 100644 --- a/docs/tool_symbols.js.html +++ b/docs/tool_symbols.js.html @@ -1,6 +1,6 @@ Source: tool/symbols.js
On this page

tool_symbols.js

import { picto } from "../helpers/picto";
+    
On this page

tool_symbols.js

import { picto } from "../helpers/picto";
 import { create } from "d3-selection";
 const d3 = Object.assign({}, { create });
 
@@ -60,4 +60,4 @@
 
   return svg.node();
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_typo.js.html b/docs/tool_typo.js.html index 5f9b3c4..c18b294 100644 --- a/docs/tool_typo.js.html +++ b/docs/tool_typo.js.html @@ -1,6 +1,6 @@ Source: tool/typo.js
On this page

tool_typo.js

import { getColors } from "dicopal";
+    
On this page

tool_typo.js

import { getColors } from "dicopal";
 import { scaleOrdinal } from "d3-scale";
 const d3 = Object.assign({}, { scaleOrdinal });
 
@@ -45,4 +45,4 @@
     colorize,
   };
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/docs/tool_unproject.js.html b/docs/tool_unproject.js.html index f55cdfa..55bf8df 100644 --- a/docs/tool_unproject.js.html +++ b/docs/tool_unproject.js.html @@ -1,6 +1,6 @@ Source: tool/unproject.js
On this page

tool_unproject.js

/**
+    
On this page

tool_unproject.js

/**
  * @function tool/unproject
  * @description The `tool.unproject` function allow to unproject geometries. It returns a GeoJSON FeatureCollection with wgs84 coordinates
  * @see {@link https://observablehq.com/@neocartocnrs/handle-geometries}
@@ -27,4 +27,4 @@
     return unprojectCoords(coord, proj);
   });
 }
-
Nicolas Lambert 2024 - MIT License
\ No newline at end of file +
Nicolas Lambert 2024 - MIT License
\ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 7e63564..14caf3e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,7 @@ "d3-force": "^3.0.0", "d3-format": "^3.1.0", "d3-geo": "^3.1.0", + "d3-geo-polygon": "^2.0.1", "d3-geo-projection": "^4.0.0", "d3-geo-scale-bar": "^1.2.5", "d3-interpolate": "^3.0.1", @@ -1720,6 +1721,19 @@ "node": ">=12" } }, + "node_modules/d3-geo-polygon": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/d3-geo-polygon/-/d3-geo-polygon-2.0.1.tgz", + "integrity": "sha512-e+CxAgyQLWaitzftCisJ7DUIYhUzSN8VSbDozouKp3bMb6QbRrRLShplpPLYisuyyZLtrdC1+5yAjpiTOne33g==", + "dependencies": { + "d3-array": "2.5.0 - 3", + "d3-geo": "2 - 3", + "d3-geo-projection": "4" + }, + "engines": { + "node": ">=18" + } + }, "node_modules/d3-geo-projection": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/d3-geo-projection/-/d3-geo-projection-4.0.0.tgz", @@ -7027,6 +7041,16 @@ "d3-array": "2.5.0 - 3" } }, + "d3-geo-polygon": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/d3-geo-polygon/-/d3-geo-polygon-2.0.1.tgz", + "integrity": "sha512-e+CxAgyQLWaitzftCisJ7DUIYhUzSN8VSbDozouKp3bMb6QbRrRLShplpPLYisuyyZLtrdC1+5yAjpiTOne33g==", + "requires": { + "d3-array": "2.5.0 - 3", + "d3-geo": "2 - 3", + "d3-geo-projection": "4" + } + }, "d3-geo-projection": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/d3-geo-projection/-/d3-geo-projection-4.0.0.tgz", diff --git a/package.json b/package.json index 72a9846..6f1d527 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "d3-force": "^3.0.0", "d3-format": "^3.1.0", "d3-geo": "^3.1.0", + "d3-geo-polygon": "^2.0.1", "d3-geo-projection": "^4.0.0", "d3-geo-scale-bar": "^1.2.5", "d3-interpolate": "^3.0.1", diff --git a/src/container/create.js b/src/container/create.js index 89dba3f..d8a9611 100644 --- a/src/container/create.js +++ b/src/container/create.js @@ -1,5 +1,6 @@ import { extent } from "../helpers/extent"; import { unique } from "../helpers/utils"; +import { getproj } from "../projection/getproj"; import { create as create2 } from "d3-selection"; import { geoPath, @@ -61,7 +62,7 @@ import { plot as addplot } from "../plot/plot.js"; * @property {number} [id = "map"] - id of the svg container. * @property {number} [height] - height of the container. This value is automatically calculated according to `domain`. But it can be forced by entering a value. * @property {object|object[]} [domain] - the domain corresponds to the geographical area to be displayed. It is defined by a geoJSON or an array containing geoJSONs. - * @property {function|string} [projection] - d3 function of projection. See [d3-geo](https://github.com/d3/d3-geo) & [d3-geo-projection](https://github.com/d3/d3-geo-projection). You can aslo write "mercator" to use tiles. (default: "none") + * @property {function|string} [projection] - d3 function of projection. See [d3-geo](https://github.com/d3/d3-geo), [d3-geo-projection](https://github.com/d3/d3-geo-projection) & [d3-geo-polygon](https://github.com/d3/d3-geo-polygon). All theses functions are available in geoviz like this: viz.proj.geoSomething(). You can alse use a String. E.g: d3.geoMercator() <=> viz.proj.geoMercator() <=> "Mercator" <=> "mercator". Null or “none” allows you to display geometries as they are, without reprojecting them. In this case, you must specify the domain. * @property {number[]} [pos] - position of the container (if contained in another svg container) * @property {string} [background] - background color * @property {string} [fontFamily] - font-family for the entire map @@ -93,6 +94,9 @@ export function create({ warning_message = [], } = {}) { // projection + + projection = getproj(projection); + const initproj = projection; switch (projection) { case "mercator": diff --git a/src/index.js b/src/index.js index f56a1ff..636f1bd 100644 --- a/src/index.js +++ b/src/index.js @@ -139,3 +139,9 @@ export { symbol } from "./mark/symbol.js"; // Plot export { plot } from "./plot/plot.js"; + +// Proj +import * as d3geo from "d3-geo"; +import * as d3geoprojection from "d3-geo-projection"; +import * as d3geoppolygon from "d3-geo-polygon"; +export let proj = Object.assign({}, d3geo, d3geoprojection, d3geoppolygon); diff --git a/src/projection/getproj.js b/src/projection/getproj.js index 2415b0d..ea48479 100644 --- a/src/projection/getproj.js +++ b/src/projection/getproj.js @@ -1,24 +1,27 @@ -import { geoEquirectangular } from "d3-geo"; -const d3 = Object.assign({}, { geoEquirectangular }); +import { stringtod3proj } from "./stringtod3proj"; +import { Polar } from "./polar"; +import { HoaXiaoguang } from "./hoaxiaoguang"; +import { Spilhaus } from "./spilhaus"; export function getproj(projection) { /* DEFAULT - the projection is not defined. - The default projection is d3.geoEquirectangular(). */ - if (projection === null || projection === undefined || projection === "") { - return d3.geoEquirectangular(); - } - - /* FUNCTION - if the projection is a d3.js function (outside bertin.js). + if ( + projection === null || + projection === undefined || + projection === "" || + projection === "none" + ) { + return "none"; + } else if (typeof projection === "function") { + /* FUNCTION - if the projection is a d3.js. then, the function is used directly.*/ - - if (typeof projection === "function") { return projection; } // STRINGS - if (typeof projection === "string") { + else if (typeof projection === "string" && projection !== "none") { projection = projection.replace(/\s/g, ""); /* CUSTOM projections*/ diff --git a/src/projection/stringtod3proj.js b/src/projection/stringtod3proj.js index d6293e5..e2cf28d 100644 --- a/src/projection/stringtod3proj.js +++ b/src/projection/stringtod3proj.js @@ -1,6 +1,7 @@ import * as d3geo from "d3-geo"; import * as d3geoprojection from "d3-geo-projection"; -const d3 = Object.assign({}, d3geo, d3geoprojection); +import * as d3geoppolygon from "d3-geo-polygon"; +const d3 = Object.assign({}, d3geo, d3geoprojection, d3geoppolygon); export function stringtod3proj(string) { let str = string; @@ -12,7 +13,7 @@ export function stringtod3proj(string) { } else { str = str.replace(".", "()."); } - str = "d3.geo" + str; + str = "d3.geo" + str.charAt(0).toUpperCase() + str.slice(1); } const createProjection = new Function("d3", `return (${str})`);