Use blocked scoped variables
In addition to using const and let, this also upgrades our linter config and removes lint (mostly whitespace).
This commit is contained in:
48
examples/d3.js
vendored
48
examples/d3.js
vendored
@@ -9,7 +9,7 @@ import ImageCanvasSource from '../src/ol/source/ImageCanvas.js';
|
||||
import Stamen from '../src/ol/source/Stamen.js';
|
||||
|
||||
|
||||
var map = new Map({
|
||||
const map = new Map({
|
||||
layers: [
|
||||
new TileLayer({
|
||||
source: new Stamen({
|
||||
@@ -29,7 +29,7 @@ var map = new Map({
|
||||
* Load the topojson data and create an ol.layer.Image for that data.
|
||||
*/
|
||||
d3.json('data/topojson/us.json', function(error, us) {
|
||||
var features = topojson.feature(us, us.objects.counties);
|
||||
const features = topojson.feature(us, us.objects.counties);
|
||||
|
||||
/**
|
||||
* This function uses d3 to render the topojson features to a canvas.
|
||||
@@ -40,39 +40,39 @@ d3.json('data/topojson/us.json', function(error, us) {
|
||||
* @param {ol.proj.Projection} projection Projection.
|
||||
* @return {HTMLCanvasElement} A canvas element.
|
||||
*/
|
||||
var canvasFunction = function(extent, resolution, pixelRatio, size, projection) {
|
||||
var canvasWidth = size[0];
|
||||
var canvasHeight = size[1];
|
||||
const canvasFunction = function(extent, resolution, pixelRatio, size, projection) {
|
||||
const canvasWidth = size[0];
|
||||
const canvasHeight = size[1];
|
||||
|
||||
var canvas = d3.select(document.createElement('canvas'));
|
||||
const canvas = d3.select(document.createElement('canvas'));
|
||||
canvas.attr('width', canvasWidth).attr('height', canvasHeight);
|
||||
|
||||
var context = canvas.node().getContext('2d');
|
||||
const context = canvas.node().getContext('2d');
|
||||
|
||||
var d3Projection = d3.geoMercator().scale(1).translate([0, 0]);
|
||||
var d3Path = d3.geoPath().projection(d3Projection);
|
||||
const d3Projection = d3.geoMercator().scale(1).translate([0, 0]);
|
||||
let d3Path = d3.geoPath().projection(d3Projection);
|
||||
|
||||
var pixelBounds = d3Path.bounds(features);
|
||||
var pixelBoundsWidth = pixelBounds[1][0] - pixelBounds[0][0];
|
||||
var pixelBoundsHeight = pixelBounds[1][1] - pixelBounds[0][1];
|
||||
const pixelBounds = d3Path.bounds(features);
|
||||
const pixelBoundsWidth = pixelBounds[1][0] - pixelBounds[0][0];
|
||||
const pixelBoundsHeight = pixelBounds[1][1] - pixelBounds[0][1];
|
||||
|
||||
var geoBounds = d3.geoBounds(features);
|
||||
var geoBoundsLeftBottom = fromLonLat(geoBounds[0], projection);
|
||||
var geoBoundsRightTop = fromLonLat(geoBounds[1], projection);
|
||||
var geoBoundsWidth = geoBoundsRightTop[0] - geoBoundsLeftBottom[0];
|
||||
const geoBounds = d3.geoBounds(features);
|
||||
const geoBoundsLeftBottom = fromLonLat(geoBounds[0], projection);
|
||||
const geoBoundsRightTop = fromLonLat(geoBounds[1], projection);
|
||||
let geoBoundsWidth = geoBoundsRightTop[0] - geoBoundsLeftBottom[0];
|
||||
if (geoBoundsWidth < 0) {
|
||||
geoBoundsWidth += getWidth(projection.getExtent());
|
||||
}
|
||||
var geoBoundsHeight = geoBoundsRightTop[1] - geoBoundsLeftBottom[1];
|
||||
const geoBoundsHeight = geoBoundsRightTop[1] - geoBoundsLeftBottom[1];
|
||||
|
||||
var widthResolution = geoBoundsWidth / pixelBoundsWidth;
|
||||
var heightResolution = geoBoundsHeight / pixelBoundsHeight;
|
||||
var r = Math.max(widthResolution, heightResolution);
|
||||
var scale = r / (resolution / pixelRatio);
|
||||
const widthResolution = geoBoundsWidth / pixelBoundsWidth;
|
||||
const heightResolution = geoBoundsHeight / pixelBoundsHeight;
|
||||
const r = Math.max(widthResolution, heightResolution);
|
||||
const scale = r / (resolution / pixelRatio);
|
||||
|
||||
var center = toLonLat(getCenter(extent), projection);
|
||||
const center = toLonLat(getCenter(extent), projection);
|
||||
d3Projection.scale(scale).center(center)
|
||||
.translate([canvasWidth / 2, canvasHeight / 2]);
|
||||
.translate([canvasWidth / 2, canvasHeight / 2]);
|
||||
d3Path = d3Path.projection(d3Projection).context(context);
|
||||
d3Path(features);
|
||||
context.stroke();
|
||||
@@ -80,7 +80,7 @@ d3.json('data/topojson/us.json', function(error, us) {
|
||||
return canvas.node();
|
||||
};
|
||||
|
||||
var layer = new ImageLayer({
|
||||
const layer = new ImageLayer({
|
||||
source: new ImageCanvasSource({
|
||||
canvasFunction: canvasFunction,
|
||||
projection: 'EPSG:3857'
|
||||
|
||||
Reference in New Issue
Block a user