leaflet-dvf icon indicating copy to clipboard operation
leaflet-dvf copied to clipboard

create PieChartDataLayer use Geojson data

Open wojiaohanshuai opened this issue 8 years ago • 3 comments

i create a PieChartDataLayer use geojson, and i add it to the map, the PieChartDataLayer is invisiable, i guess the options arguments not correct and i don't know how to solve...

my geojson is

var data = {
    features: [{
        geometry: {
            coordinates: [116.38094329823173, 39.923614502102055],
            type: "MultiPoint"
        },
        properties: {
            code: 11011,
            gid: 1,
            name: "Beijing"
        },
        type: "Feature"
    }, ...],
    spatialReference: {...
    },
    type: "FeatureCollection"
}

my code is

var options = {

    recordsField: 'features',

    locationMode: L.LocationModes.GEOJSON,

    chartOptions: {

        "properties.code": {

            displayName: 'code',

            color: "hsl(240,100%,25%)",

            fillColor: "hsl(240,80%,55%)",

            maxValue: 80

        },
        "properties.gid": {

            displayName: "gid",

            color: "hsl(120,100%,25%)",

            fillColor: "hsl(120,80%,55%)",

            maxValue: 8000000

        }
    },
    layerOptions: {

        fillOpacity: 0.8,

        opacity: 1,

        weight: 1,

        radius: 10

    },
    tooltipOptions: {

        iconSize: new L.Point(50, 50),

        iconAnchor: new L.Point(-5, 50)

    }
};

var layer = new L.PieChartDataLayer(data, options);

map.addLayer(layer);

thx for your help

wojiaohanshuai avatar Oct 27 '17 13:10 wojiaohanshuai

@wojiaohanshuai I'll check it out. Your example looks OK to me at first glance, but I'm going to throw together an example based on what you've provided to figure out what the issue is. Should have an answer shortly.

sfairgrieve avatar Oct 27 '17 20:10 sfairgrieve

It looks like the issue is the actual GeoJSON. In the example above, the geometry type is MultiPoint, but the coordinates contains a single point rather than an array of points. If you change it to Point instead of MultiPoint, it works just fine.

sfairgrieve avatar Oct 27 '17 20:10 sfairgrieve

@sfairgrieve thx for your help, i made a demo use geojson (Point) this morning, it works :+1: . http://jsfiddle.net/damncoder/e74crctg/2/

wojiaohanshuai avatar Oct 28 '17 06:10 wojiaohanshuai