diff --git a/common/changes/@visactor/vchart/feat-issue-2918_2024-07-09-02-09.json b/common/changes/@visactor/vchart/feat-issue-2918_2024-07-09-02-09.json new file mode 100644 index 0000000000..377ba1c628 --- /dev/null +++ b/common/changes/@visactor/vchart/feat-issue-2918_2024-07-09-02-09.json @@ -0,0 +1,10 @@ +{ + "changes": [ + { + "packageName": "@visactor/vchart", + "comment": "feat: marker's `coordinates` and `positions` property support callback", + "type": "none" + } + ], + "packageName": "@visactor/vchart" +} \ No newline at end of file diff --git a/docs/assets/examples/en/marker/trend-line.md b/docs/assets/examples/en/marker/trend-line.md new file mode 100644 index 0000000000..fc23e0da4c --- /dev/null +++ b/docs/assets/examples/en/marker/trend-line.md @@ -0,0 +1,1783 @@ +--- +category: examples +group: marker +title: TrendLine +keywords: marker,scatterChart +order: 33-6 +cover: /vchart/preview/trend-line-1.12.0.png +option: scatterChart#markLine +--- + +# Use MarkLine to draw trend lines + +## Key configuration + +- Support the drawing of trend lines through the callback function of the `markLine.positions` property + +## Demo source + +```javascript livedemo +function determinationCoefficient(data, results) { + const predictions = []; + const observations = []; + + data.forEach((d, i) => { + if (d[1] !== null) { + observations.push(d); + predictions.push(results[i]); + } + }); + + const sum = observations.reduce((a, observation) => a + observation[1], 0); + const mean = sum / observations.length; + + const ssyy = observations.reduce((a, observation) => { + const difference = observation[1] - mean; + return a + difference * difference; + }, 0); + + const sse = observations.reduce((accum, observation, index) => { + const prediction = predictions[index]; + const residual = observation[1] - prediction[1]; + return accum + residual * residual; + }, 0); + + return 1 - sse / ssyy; +} + +function round(number, precision) { + const factor = 10 ** precision; + return Math.round(number * factor) / factor; +} + +function logarithmic(data, options) { + const sum = [0, 0, 0, 0]; + const len = data.length; + + for (let n = 0; n < len; n++) { + if (data[n][1] !== null) { + sum[0] += Math.log(data[n][0]); + sum[1] += data[n][1] * Math.log(data[n][0]); + sum[2] += data[n][1]; + sum[3] += Math.log(data[n][0]) ** 2; + } + } + + const a = (len * sum[1] - sum[2] * sum[0]) / (len * sum[3] - sum[0] * sum[0]); + const coeffB = round(a, options.precision); + const coeffA = round((sum[2] - coeffB * sum[0]) / len, options.precision); + + const predict = x => [ + round(x, options.precision), + round(round(coeffA + coeffB * Math.log(x), options.precision), options.precision) + ]; + + const points = data.map(point => predict(point[0])); + + return { + points, + predict, + equation: [coeffA, coeffB], + string: `y = ${coeffA} + ${coeffB} ln(x)`, + r2: round(determinationCoefficient(data, points), options.precision) + }; +} + +const spec = { + type: 'scatter', + stack: false, + size: [5, 50], + + xField: 'GDP per capita', + yField: 'Life expectancy at birth', + sizeField: 'Size', + legends: { + visible: false + }, + data: [ + { + id: '0', + sourceKey: 'total', + values: [ + { + Country: 'Afghanistan', + 'GDP per capita': 1516.3057, + 'Life expectancy at birth': 62, + 'Fertility rate': 4.6434, + 'Child mortality rate': 5.79324, + Size: 40099460 + }, + { + Country: 'Albania', + 'GDP per capita': 14518.906, + 'Life expectancy at birth': 76.5, + 'Fertility rate': 1.3897, + 'Child mortality rate': 0.99849004, + Size: 2854710 + }, + { + Country: 'Algeria', + 'GDP per capita': 11039.806, + 'Life expectancy at birth': 76.4, + 'Fertility rate': 2.8886, + 'Child mortality rate': 2.21071, + Size: 44177964 + }, + { + Country: 'Angola', + 'GDP per capita': 5908.57, + 'Life expectancy at birth': 61.6, + 'Fertility rate': 5.3044, + 'Child mortality rate': 6.88471, + Size: 34503776 + }, + { + Country: 'Antigua and Barbuda', + 'GDP per capita': 19124.43, + 'Life expectancy at birth': 78.5, + 'Fertility rate': 1.5798, + 'Child mortality rate': 0.61823, + Size: 93229 + }, + { + Country: 'Argentina', + 'GDP per capita': 21527.195, + 'Life expectancy at birth': 75.4, + 'Fertility rate': 1.8854, + 'Child mortality rate': 1.07809, + Size: 45276788 + }, + { + Country: 'Armenia', + 'GDP per capita': 14193.117, + 'Life expectancy at birth': 72, + 'Fertility rate': 1.575, + 'Child mortality rate': 1.04387, + Size: 2790971 + }, + { + Country: 'Aruba', + 'GDP per capita': 38866.332, + 'Life expectancy at birth': 74.6, + 'Fertility rate': 1.1803, + 'Child mortality rate': 1.48334, + Size: 106543 + }, + { + Country: 'Australia', + 'GDP per capita': 49774.34, + 'Life expectancy at birth': 84.5, + 'Fertility rate': 1.5962, + 'Child mortality rate': 0.33908, + Size: 25921094 + }, + { + Country: 'Austria', + 'GDP per capita': 54121.145, + 'Life expectancy at birth': 81.6, + 'Fertility rate': 1.4701, + 'Child mortality rate': 0.35735, + Size: 8922086 + }, + { + Country: 'Azerbaijan', + 'GDP per capita': 14431.661, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.6638, + 'Child mortality rate': 1.86127, + Size: 10312992 + }, + { + Country: 'Bahamas', + 'GDP per capita': 30210.162, + 'Life expectancy at birth': 71.6, + 'Fertility rate': 1.3889, + 'Child mortality rate': 1.1871899, + Size: 407920 + }, + { + Country: 'Bahrain', + 'GDP per capita': 49387.418, + 'Life expectancy at birth': 78.8, + 'Fertility rate': 1.811, + 'Child mortality rate': 0.67073, + Size: 1463266 + }, + { + Country: 'Bangladesh', + 'GDP per capita': 5911.013, + 'Life expectancy at birth': 72.4, + 'Fertility rate': 1.981, + 'Child mortality rate': 2.7698998, + Size: 169356240 + }, + { + Country: 'Barbados', + 'GDP per capita': 13754.803, + 'Life expectancy at birth': 77.6, + 'Fertility rate': 1.6327, + 'Child mortality rate': 1.1844, + Size: 281204 + }, + { + Country: 'Belarus', + 'GDP per capita': 19751.203, + 'Life expectancy at birth': 72.4, + 'Fertility rate': 1.483, + 'Child mortality rate': 0.27184, + Size: 9578172 + }, + { + Country: 'Belgium', + 'GDP per capita': 51739.54, + 'Life expectancy at birth': 81.9, + 'Fertility rate': 1.5831, + 'Child mortality rate': 0.39669, + Size: 11611416 + }, + { + Country: 'Belize', + 'GDP per capita': 8762.623, + 'Life expectancy at birth': 70.5, + 'Fertility rate': 2.0104, + 'Child mortality rate': 1.1736801, + Size: 400037 + }, + { + Country: 'Benin', + 'GDP per capita': 3321.5522, + 'Life expectancy at birth': 59.8, + 'Fertility rate': 4.9731, + 'Child mortality rate': 8.33789, + Size: 12996901 + }, + { + Country: 'Bermuda', + 'GDP per capita': 80271.13, + 'Life expectancy at birth': 79.3, + 'Fertility rate': 1.3631, + 'Child mortality rate': 0.28224, + Size: 64213 + }, + { + Country: 'Bhutan', + 'GDP per capita': 10907.856, + 'Life expectancy at birth': 71.8, + 'Fertility rate': 1.4132, + 'Child mortality rate': 2.68407, + Size: 777500 + }, + { + Country: 'Bolivia', + 'GDP per capita': 8052.1772, + 'Life expectancy at birth': 63.6, + 'Fertility rate': 2.6178, + 'Child mortality rate': 3.55129, + Size: 12079474 + }, + { + Country: 'Bosnia and Herzegovina', + 'GDP per capita': 15666.54, + 'Life expectancy at birth': 75.3, + 'Fertility rate': 1.3498, + 'Child mortality rate': 0.55809003, + Size: 3270948 + }, + { + Country: 'Botswana', + 'GDP per capita': 14840.913, + 'Life expectancy at birth': 61.1, + 'Fertility rate': 2.7914, + 'Child mortality rate': 4.44968, + Size: 2588424 + }, + { + Country: 'Brazil', + 'GDP per capita': 14592.353, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 1.6406, + 'Child mortality rate': 1.4446, + Size: 214326224 + }, + { + Country: 'Brunei', + 'GDP per capita': 60127.023, + 'Life expectancy at birth': 74.6, + 'Fertility rate': 1.7779, + 'Child mortality rate': 1.10831, + Size: 445382 + }, + { + Country: 'Bulgaria', + 'GDP per capita': 24398.13, + 'Life expectancy at birth': 71.8, + 'Fertility rate': 1.586, + 'Child mortality rate': 0.61714, + Size: 6885864 + }, + { + Country: 'Burkina Faso', + 'GDP per capita': 2179.789, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 4.7718, + 'Child mortality rate': 8.27705, + Size: 22100690 + }, + { + Country: 'Burundi', + 'GDP per capita': 705.0304, + 'Life expectancy at birth': 61.7, + 'Fertility rate': 5.0779, + 'Child mortality rate': 5.24944, + Size: 12551215 + }, + { + Country: 'Cambodia', + 'GDP per capita': 4354.5654, + 'Life expectancy at birth': 69.6, + 'Fertility rate': 2.3438, + 'Child mortality rate': 2.47492, + Size: 16589031 + }, + { + Country: 'Cameroon', + 'GDP per capita': 3700.4644, + 'Life expectancy at birth': 60.3, + 'Fertility rate': 4.4633, + 'Child mortality rate': 6.9737396, + Size: 27198632 + }, + { + Country: 'Canada', + 'GDP per capita': 47892.945, + 'Life expectancy at birth': 82.7, + 'Fertility rate': 1.4635, + 'Child mortality rate': 0.48908, + Size: 38155012 + }, + { + Country: 'Cape Verde', + 'GDP per capita': 6114.1333, + 'Life expectancy at birth': 74.1, + 'Fertility rate': 1.8956, + 'Child mortality rate': 1.35761, + Size: 587936 + }, + { + Country: 'Cayman Islands', + 'GDP per capita': 67500.1, + 'Life expectancy at birth': 75.1, + 'Fertility rate': 1.2191, + 'Child mortality rate': 0.93649995, + Size: 68157 + }, + { + Country: 'Central African Republic', + 'GDP per capita': 837.5047, + 'Life expectancy at birth': 53.9, + 'Fertility rate': 5.9783, + 'Child mortality rate': 10.1913595, + Size: 5457165 + }, + { + Country: 'Chad', + 'GDP per capita': 1425.4945, + 'Life expectancy at birth': 52.5, + 'Fertility rate': 6.2549, + 'Child mortality rate': 10.66955, + Size: 17179744 + }, + { + Country: 'Chile', + 'GDP per capita': 25449.13, + 'Life expectancy at birth': 78.9, + 'Fertility rate': 1.5375, + 'Child mortality rate': 0.56016004, + Size: 19493184 + }, + { + Country: 'China', + 'GDP per capita': 17602.695, + 'Life expectancy at birth': 78.2, + 'Fertility rate': 1.164, + 'Child mortality rate': 0.68583, + Size: 1425893504 + }, + { + Country: 'Colombia', + 'GDP per capita': 14648.592, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 1.7168, + 'Child mortality rate': 1.29233, + Size: 51516560 + }, + { + Country: 'Comoros', + 'GDP per capita': 3228.5269, + 'Life expectancy at birth': 63.4, + 'Fertility rate': 3.9777, + 'Child mortality rate': 5.85155, + Size: 821632 + }, + { + Country: 'Congo', + 'GDP per capita': 3234.393, + 'Life expectancy at birth': 63.5, + 'Fertility rate': 4.1707, + 'Child mortality rate': 4.3193297, + Size: 5835814 + }, + { + Country: 'Costa Rica', + 'GDP per capita': 21199.281, + 'Life expectancy at birth': 77, + 'Fertility rate': 1.5335, + 'Child mortality rate': 0.7631, + Size: 5153959 + }, + { + Country: "Cote d'Ivoire", + 'GDP per capita': 5325.0303, + 'Life expectancy at birth': 58.6, + 'Fertility rate': 4.418, + 'Child mortality rate': 7.56744, + Size: 27478250 + }, + { + Country: 'Croatia', + 'GDP per capita': 31635.824, + 'Life expectancy at birth': 77.6, + 'Fertility rate': 1.4518, + 'Child mortality rate': 0.49962002, + Size: 4060139 + }, + { + Country: 'Curacao', + 'GDP per capita': 20783.086, + 'Life expectancy at birth': 75.4, + 'Fertility rate': 1.6509, + 'Child mortality rate': 0.98373, + Size: 190348 + }, + { + Country: 'Cyprus', + 'GDP per capita': 41701.703, + 'Life expectancy at birth': 81.2, + 'Fertility rate': 1.3208, + 'Child mortality rate': 0.27108, + Size: 1244193 + }, + { + Country: 'Czechia', + 'GDP per capita': 40740.992, + 'Life expectancy at birth': 77.7, + 'Fertility rate': 1.6986, + 'Child mortality rate': 0.28872, + Size: 10510748 + }, + { + Country: 'Democratic Republic of Congo', + 'GDP per capita': 1073.6433, + 'Life expectancy at birth': 59.2, + 'Fertility rate': 6.1564, + 'Child mortality rate': 7.8581495, + Size: 95894120 + }, + { + Country: 'Denmark', + 'GDP per capita': 57962.652, + 'Life expectancy at birth': 81.4, + 'Fertility rate': 1.7187, + 'Child mortality rate': 0.32694, + Size: 5854246 + }, + { + Country: 'Djibouti', + 'GDP per capita': 4913.2563, + 'Life expectancy at birth': 62.3, + 'Fertility rate': 2.8041, + 'Child mortality rate': 5.4339, + Size: 1105562 + }, + { + Country: 'Dominica', + 'GDP per capita': 10878.037, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 1.5949, + 'Child mortality rate': 1.3676699, + Size: 72435 + }, + { + Country: 'Dominican Republic', + 'GDP per capita': 18626.078, + 'Life expectancy at birth': 72.6, + 'Fertility rate': 2.2727, + 'Child mortality rate': 3.2994301, + Size: 11117873 + }, + { + Country: 'Egypt', + 'GDP per capita': 11566.05, + 'Life expectancy at birth': 70.2, + 'Fertility rate': 2.9174, + 'Child mortality rate': 1.88508, + Size: 109262184 + }, + { + Country: 'Equatorial Guinea', + 'GDP per capita': 14637.008, + 'Life expectancy at birth': 60.6, + 'Fertility rate': 4.266, + 'Child mortality rate': 7.57025, + Size: 1634473 + }, + { + Country: 'Estonia', + 'GDP per capita': 38717.695, + 'Life expectancy at birth': 77.1, + 'Fertility rate': 1.6761, + 'Child mortality rate': 0.18729, + Size: 1328704 + }, + { + Country: 'Eswatini', + 'GDP per capita': 8856.829, + 'Life expectancy at birth': 57.1, + 'Fertility rate': 2.8395, + 'Child mortality rate': 5.05009, + Size: 1192273 + }, + { + Country: 'Ethiopia', + 'GDP per capita': 2319.0684, + 'Life expectancy at birth': 65, + 'Fertility rate': 4.1591, + 'Child mortality rate': 4.7206903, + Size: 120283024 + }, + { + Country: 'Fiji', + 'GDP per capita': 10359.204, + 'Life expectancy at birth': 67.1, + 'Fertility rate': 2.4748, + 'Child mortality rate': 2.79012, + Size: 924615 + }, + { + Country: 'Finland', + 'GDP per capita': 48753.355, + 'Life expectancy at birth': 82, + 'Fertility rate': 1.3891, + 'Child mortality rate': 0.23526001, + Size: 5535982 + }, + { + Country: 'France', + 'GDP per capita': 44993.125, + 'Life expectancy at birth': 82.5, + 'Fertility rate': 1.79, + 'Child mortality rate': 0.41957998, + Size: 64531448 + }, + { + Country: 'Gabon', + 'GDP per capita': 13813.723, + 'Life expectancy at birth': 65.8, + 'Fertility rate': 3.491, + 'Child mortality rate': 3.94095, + Size: 2341185 + }, + { + Country: 'Gambia', + 'GDP per capita': 2076.5664, + 'Life expectancy at birth': 62.1, + 'Fertility rate': 4.6838, + 'Child mortality rate': 4.78102, + Size: 2639922 + }, + { + Country: 'Ghana', + 'GDP per capita': 5435.238, + 'Life expectancy at birth': 63.8, + 'Fertility rate': 3.5633, + 'Child mortality rate': 4.32603, + Size: 32833036 + }, + { + Country: 'Greece', + 'GDP per capita': 29548.04, + 'Life expectancy at birth': 80.1, + 'Fertility rate': 1.371, + 'Child mortality rate': 0.39897, + Size: 10445368 + }, + { + Country: 'Grenada', + 'GDP per capita': 13688.256, + 'Life expectancy at birth': 74.9, + 'Fertility rate': 2.0043, + 'Child mortality rate': 1.60784, + Size: 124624 + }, + { + Country: 'Guatemala', + 'GDP per capita': 8926.7, + 'Life expectancy at birth': 69.2, + 'Fertility rate': 2.3948, + 'Child mortality rate': 2.2902, + Size: 17608484 + }, + { + Country: 'Guinea', + 'GDP per capita': 2640.3442, + 'Life expectancy at birth': 58.9, + 'Fertility rate': 4.3987, + 'Child mortality rate': 9.30472, + Size: 13531909 + }, + { + Country: 'Guinea-Bissau', + 'GDP per capita': 1831.3832, + 'Life expectancy at birth': 59.7, + 'Fertility rate': 4.0055, + 'Child mortality rate': 7.4228697, + Size: 2060730 + }, + { + Country: 'Guyana', + 'GDP per capita': 21925.188, + 'Life expectancy at birth': 65.7, + 'Fertility rate': 2.3972, + 'Child mortality rate': 2.7539, + Size: 804571 + }, + { + Country: 'Hong Kong', + 'GDP per capita': 59978.15, + 'Life expectancy at birth': 85.5, + 'Fertility rate': 0.7455, + 'Child mortality rate': 0.19231, + Size: 7494580 + }, + { + Country: 'Hungary', + 'GDP per capita': 33593.152, + 'Life expectancy at birth': 74.5, + 'Fertility rate': 1.5782, + 'Child mortality rate': 0.41023, + Size: 9709784 + }, + { + Country: 'Iceland', + 'GDP per capita': 53586.156, + 'Life expectancy at birth': 82.7, + 'Fertility rate': 1.7329, + 'Child mortality rate': 0.1495, + Size: 370338 + }, + { + Country: 'India', + 'GDP per capita': 6592.042, + 'Life expectancy at birth': 67.2, + 'Fertility rate': 2.0308, + 'Child mortality rate': 3.11861, + Size: 1407563904 + }, + { + Country: 'Indonesia', + 'GDP per capita': 11858.146, + 'Life expectancy at birth': 67.6, + 'Fertility rate': 2.1746, + 'Child mortality rate': 2.23194, + Size: 273753184 + }, + { + Country: 'Iraq', + 'GDP per capita': 8962.395, + 'Life expectancy at birth': 70.4, + 'Fertility rate': 3.4955, + 'Child mortality rate': 2.46205, + Size: 43533592 + }, + { + Country: 'Ireland', + 'GDP per capita': 102496.22, + 'Life expectancy at birth': 82, + 'Fertility rate': 1.7678, + 'Child mortality rate': 0.28796, + Size: 4986525 + }, + { + Country: 'Israel', + 'GDP per capita': 42061.242, + 'Life expectancy at birth': 82.3, + 'Fertility rate': 2.9764, + 'Child mortality rate': 0.37339002, + Size: 8900057 + }, + { + Country: 'Italy', + 'GDP per capita': 41929.43, + 'Life expectancy at birth': 82.9, + 'Fertility rate': 1.2825, + 'Child mortality rate': 0.27309, + Size: 59240336 + }, + { + Country: 'Jamaica', + 'GDP per capita': 9596.564, + 'Life expectancy at birth': 70.5, + 'Fertility rate': 1.352, + 'Child mortality rate': 1.33336, + Size: 2827701 + }, + { + Country: 'Jordan', + 'GDP per capita': 9223.147, + 'Life expectancy at birth': 74.3, + 'Fertility rate': 2.8297, + 'Child mortality rate': 1.43536, + Size: 11148288 + }, + { + Country: 'Kenya', + 'GDP per capita': 4743.4863, + 'Life expectancy at birth': 61.4, + 'Fertility rate': 3.3351, + 'Child mortality rate': 4.1131, + Size: 53005616 + }, + { + Country: 'Kiribati', + 'GDP per capita': 1937.0894, + 'Life expectancy at birth': 67.4, + 'Fertility rate': 3.3038, + 'Child mortality rate': 4.75164, + Size: 128883 + }, + { + Country: 'Kyrgyzstan', + 'GDP per capita': 4814.9565, + 'Life expectancy at birth': 70, + 'Fertility rate': 2.9912, + 'Child mortality rate': 1.68766, + Size: 6527742 + }, + { + Country: 'Latvia', + 'GDP per capita': 32081.455, + 'Life expectancy at birth': 73.6, + 'Fertility rate': 1.5827, + 'Child mortality rate': 0.39695, + Size: 1873926 + }, + { + Country: 'Lebanon', + 'GDP per capita': 12977.202, + 'Life expectancy at birth': 75, + 'Fertility rate': 2.0912, + 'Child mortality rate': 0.67698, + Size: 5592626 + }, + { + Country: 'Lesotho', + 'GDP per capita': 2295.2322, + 'Life expectancy at birth': 53.1, + 'Fertility rate': 3.0176, + 'Child mortality rate': 8.71052, + Size: 2281464 + }, + { + Country: 'Liberia', + 'GDP per capita': 1423.2296, + 'Life expectancy at birth': 60.7, + 'Fertility rate': 4.0885, + 'Child mortality rate': 7.54857, + Size: 5193422 + }, + { + Country: 'Libya', + 'GDP per capita': 21965.174, + 'Life expectancy at birth': 71.9, + 'Fertility rate': 2.4624, + 'Child mortality rate': 1.10779, + Size: 6735280 + }, + { + Country: 'Lithuania', + 'GDP per capita': 39305.613, + 'Life expectancy at birth': 73.7, + 'Fertility rate': 1.6222, + 'Child mortality rate': 0.33962, + Size: 2786652 + }, + { + Country: 'Luxembourg', + 'GDP per capita': 115683.49, + 'Life expectancy at birth': 82.6, + 'Fertility rate': 1.3877, + 'Child mortality rate': 0.52484, + Size: 639330 + }, + { + Country: 'Macao', + 'GDP per capita': 64796.996, + 'Life expectancy at birth': 85.4, + 'Fertility rate': 1.0883, + 'Child mortality rate': 0.32282, + Size: 686616 + }, + { + Country: 'Madagascar', + 'GDP per capita': 1463.6288, + 'Life expectancy at birth': 64.5, + 'Fertility rate': 3.8514, + 'Child mortality rate': 4.87476, + Size: 28915652 + }, + { + Country: 'Malawi', + 'GDP per capita': 1491.1339, + 'Life expectancy at birth': 62.9, + 'Fertility rate': 3.9165, + 'Child mortality rate': 3.8196702, + Size: 19889742 + }, + { + Country: 'Mali', + 'GDP per capita': 2120.6233, + 'Life expectancy at birth': 58.9, + 'Fertility rate': 5.9564, + 'Child mortality rate': 8.82339, + Size: 21904990 + }, + { + Country: 'Malta', + 'GDP per capita': 44658.72, + 'Life expectancy at birth': 83.8, + 'Fertility rate': 1.1783, + 'Child mortality rate': 0.42745, + Size: 526751 + }, + { + Country: 'Marshall Islands', + 'GDP per capita': 5961.8164, + 'Life expectancy at birth': 65.3, + 'Fertility rate': 2.7288, + 'Child mortality rate': 2.95682, + Size: 42074 + }, + { + Country: 'Mauritius', + 'GDP per capita': 20967.947, + 'Life expectancy at birth': 73.6, + 'Fertility rate': 1.4105, + 'Child mortality rate': 1.69755, + Size: 1298922 + }, + { + Country: 'Micronesia (country)', + 'GDP per capita': 3315.2302, + 'Life expectancy at birth': 70.7, + 'Fertility rate': 2.7114, + 'Child mortality rate': 2.38641, + Size: 113143 + }, + { + Country: 'Moldova', + 'GDP per capita': 14009.226, + 'Life expectancy at birth': 68.8, + 'Fertility rate': 1.8058, + 'Child mortality rate': 1.4253199, + Size: 3061509 + }, + { + Country: 'Mongolia', + 'GDP per capita': 11668.431, + 'Life expectancy at birth': 71, + 'Fertility rate': 2.8371, + 'Child mortality rate': 1.4805601, + Size: 3347782 + }, + { + Country: 'Montenegro', + 'GDP per capita': 20602.5, + 'Life expectancy at birth': 76.3, + 'Fertility rate': 1.6914, + 'Child mortality rate': 0.14623, + Size: 627856 + }, + { + Country: 'Morocco', + 'GDP per capita': 8058.397, + 'Life expectancy at birth': 74, + 'Fertility rate': 2.328, + 'Child mortality rate': 1.7918699, + Size: 37076588 + }, + { + Country: 'Mozambique', + 'GDP per capita': 1226.767, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 4.6444, + 'Child mortality rate': 6.84142, + Size: 32077074 + }, + { + Country: 'Myanmar', + 'GDP per capita': 4032.6257, + 'Life expectancy at birth': 65.7, + 'Fertility rate': 2.1514, + 'Child mortality rate': 4.27911, + Size: 53798088 + }, + { + Country: 'Namibia', + 'GDP per capita': 9137.797, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 3.3025, + 'Child mortality rate': 3.8573601, + Size: 2530150 + }, + { + Country: 'Nauru', + 'GDP per capita': 11947.395, + 'Life expectancy at birth': 63.6, + 'Fertility rate': 3.5187, + 'Child mortality rate': 1.8978001, + Size: 12533 + }, + { + Country: 'Nepal', + 'GDP per capita': 3831.9485, + 'Life expectancy at birth': 68.4, + 'Fertility rate': 2.0293, + 'Child mortality rate': 2.7374902, + Size: 30034988 + }, + { + Country: 'Netherlands', + 'GDP per capita': 56617.35, + 'Life expectancy at birth': 81.7, + 'Fertility rate': 1.6404, + 'Child mortality rate': 0.40461, + Size: 17501696 + }, + { + Country: 'New Zealand', + 'GDP per capita': 42915.453, + 'Life expectancy at birth': 82.5, + 'Fertility rate': 1.7733, + 'Child mortality rate': 0.46201, + Size: 5129730 + }, + { + Country: 'Nicaragua', + 'GDP per capita': 5638.748, + 'Life expectancy at birth': 73.8, + 'Fertility rate': 2.3213, + 'Child mortality rate': 1.54514, + Size: 6850546 + }, + { + Country: 'Niger', + 'GDP per capita': 1186.5768, + 'Life expectancy at birth': 61.6, + 'Fertility rate': 6.82, + 'Child mortality rate': 7.53853, + Size: 25252722 + }, + { + Country: 'Nigeria', + 'GDP per capita': 4922.6323, + 'Life expectancy at birth': 52.7, + 'Fertility rate': 5.2374, + 'Child mortality rate': 11.123549, + Size: 213401328 + }, + { + Country: 'North Macedonia', + 'GDP per capita': 16467.316, + 'Life expectancy at birth': 73.8, + 'Fertility rate': 1.3633, + 'Child mortality rate': 0.67988, + Size: 2103329 + }, + { + Country: 'Oman', + 'GDP per capita': 34294.766, + 'Life expectancy at birth': 72.5, + 'Fertility rate': 2.6233, + 'Child mortality rate': 1.11421, + Size: 4520474 + }, + { + Country: 'Pakistan', + 'GDP per capita': 5232.1426, + 'Life expectancy at birth': 66.1, + 'Fertility rate': 3.4698, + 'Child mortality rate': 6.3176603, + Size: 231402112 + }, + { + Country: 'Palau', + 'GDP per capita': 13785.397, + 'Life expectancy at birth': 66, + 'Fertility rate': 2.409, + 'Child mortality rate': 1.73272, + Size: 18050 + }, + { + Country: 'Panama', + 'GDP per capita': 29037.945, + 'Life expectancy at birth': 76.2, + 'Fertility rate': 2.3252, + 'Child mortality rate': 1.7161, + Size: 4351264 + }, + { + Country: 'Papua New Guinea', + 'GDP per capita': 3677.4602, + 'Life expectancy at birth': 65.4, + 'Fertility rate': 3.2147, + 'Child mortality rate': 4.22622, + Size: 9949438 + }, + { + Country: 'Paraguay', + 'GDP per capita': 13687.655, + 'Life expectancy at birth': 70.3, + 'Fertility rate': 2.4689, + 'Child mortality rate': 1.8373501, + Size: 6703802 + }, + { + Country: 'Peru', + 'GDP per capita': 12514.651, + 'Life expectancy at birth': 72.4, + 'Fertility rate': 2.1917, + 'Child mortality rate': 1.23791, + Size: 33715464 + }, + { + Country: 'Philippines', + 'GDP per capita': 8094.693, + 'Life expectancy at birth': 69.3, + 'Fertility rate': 2.7476, + 'Child mortality rate': 2.53896, + Size: 113880336 + }, + { + Country: 'Portugal', + 'GDP per capita': 33674.527, + 'Life expectancy at birth': 81, + 'Fertility rate': 1.3631, + 'Child mortality rate': 0.3335, + Size: 10290109 + }, + { + Country: 'Qatar', + 'GDP per capita': 92862.35, + 'Life expectancy at birth': 79.3, + 'Fertility rate': 1.8008, + 'Child mortality rate': 0.5544, + Size: 2688239 + }, + { + Country: 'Romania', + 'GDP per capita': 30776.93, + 'Life expectancy at birth': 74.2, + 'Fertility rate': 1.748, + 'Child mortality rate': 0.66375, + Size: 19328558 + }, + { + Country: 'Russia', + 'GDP per capita': 27960.102, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.4927, + 'Child mortality rate': 0.48901, + Size: 145102752 + }, + { + Country: 'Rwanda', + 'GDP per capita': 2238.9573, + 'Life expectancy at birth': 66.1, + 'Fertility rate': 3.8207, + 'Child mortality rate': 3.86737, + Size: 13461891 + }, + { + Country: 'Saint Kitts and Nevis', + 'GDP per capita': 26485.816, + 'Life expectancy at birth': 71.7, + 'Fertility rate': 1.5307, + 'Child mortality rate': 1.09988, + Size: 47631 + }, + { + Country: 'Saint Lucia', + 'GDP per capita': 13045.955, + 'Life expectancy at birth': 71.1, + 'Fertility rate': 1.399, + 'Child mortality rate': 1.44284, + Size: 179663 + }, + { + Country: 'Saint Vincent and the Grenadines', + 'GDP per capita': 13695.039, + 'Life expectancy at birth': 69.6, + 'Fertility rate': 1.7971, + 'Child mortality rate': 1.40908, + Size: 104340 + }, + { + Country: 'Sao Tome and Principe', + 'GDP per capita': 4052.1233, + 'Life expectancy at birth': 67.6, + 'Fertility rate': 3.8226, + 'Child mortality rate': 1.4605, + Size: 223118 + }, + { + Country: 'Saudi Arabia', + 'GDP per capita': 44339.312, + 'Life expectancy at birth': 76.9, + 'Fertility rate': 2.4266, + 'Child mortality rate': 0.68990004, + Size: 35950396 + }, + { + Country: 'Senegal', + 'GDP per capita': 3495.4036, + 'Life expectancy at birth': 67.1, + 'Fertility rate': 4.3871, + 'Child mortality rate': 3.6707, + Size: 16876726 + }, + { + Country: 'Seychelles', + 'GDP per capita': 28760.516, + 'Life expectancy at birth': 71.3, + 'Fertility rate': 2.3484, + 'Child mortality rate': 1.3638799, + Size: 106486 + }, + { + Country: 'Sierra Leone', + 'GDP per capita': 1614.6981, + 'Life expectancy at birth': 60.1, + 'Fertility rate': 3.9779, + 'Child mortality rate': 9.950319, + Size: 8420642 + }, + { + Country: 'Singapore', + 'GDP per capita': 106032.23, + 'Life expectancy at birth': 82.8, + 'Fertility rate': 1.0243, + 'Child mortality rate': 0.20560999, + Size: 5941063 + }, + { + Country: 'Slovakia', + 'GDP per capita': 31866.025, + 'Life expectancy at birth': 74.9, + 'Fertility rate': 1.5664, + 'Child mortality rate': 0.58063996, + Size: 5447621 + }, + { + Country: 'Slovenia', + 'GDP per capita': 40036.484, + 'Life expectancy at birth': 80.7, + 'Fertility rate': 1.6272, + 'Child mortality rate': 0.23640999, + Size: 2119408 + }, + { + Country: 'Solomon Islands', + 'GDP per capita': 2406.1135, + 'Life expectancy at birth': 70.3, + 'Fertility rate': 3.9832, + 'Child mortality rate': 1.87301, + Size: 707855 + }, + { + Country: 'Somalia', + 'GDP per capita': 1136.736, + 'Life expectancy at birth': 55.3, + 'Fertility rate': 6.3123, + 'Child mortality rate': 11.18507, + Size: 17065588 + }, + { + Country: 'South Africa', + 'GDP per capita': 13311.926, + 'Life expectancy at birth': 62.3, + 'Fertility rate': 2.374, + 'Child mortality rate': 3.50681, + Size: 59392256 + }, + { + Country: 'South Korea', + 'GDP per capita': 44232.207, + 'Life expectancy at birth': 83.7, + 'Fertility rate': 0.8799, + 'Child mortality rate': 0.29209, + Size: 51830136 + }, + { + Country: 'Spain', + 'GDP per capita': 37913.074, + 'Life expectancy at birth': 83, + 'Fertility rate': 1.2779, + 'Child mortality rate': 0.29862002, + Size: 47486932 + }, + { + Country: 'Sri Lanka', + 'GDP per capita': 13386.682, + 'Life expectancy at birth': 76.4, + 'Fertility rate': 1.9899, + 'Child mortality rate': 0.67038, + Size: 21773438 + }, + { + Country: 'Sudan', + 'GDP per capita': 3701.069, + 'Life expectancy at birth': 65.3, + 'Fertility rate': 4.4574, + 'Child mortality rate': 5.47112, + Size: 45657204 + }, + { + Country: 'Suriname', + 'GDP per capita': 14766.748, + 'Life expectancy at birth': 70.3, + 'Fertility rate': 2.3482, + 'Child mortality rate': 1.7073, + Size: 612989 + }, + { + Country: 'Sweden', + 'GDP per capita': 53613.42, + 'Life expectancy at birth': 83, + 'Fertility rate': 1.67, + 'Child mortality rate': 0.23731, + Size: 10467095 + }, + { + Country: 'Tajikistan', + 'GDP per capita': 3903.32, + 'Life expectancy at birth': 71.6, + 'Fertility rate': 3.1855, + 'Child mortality rate': 3.13161, + Size: 9750078 + }, + { + Country: 'Tanzania', + 'GDP per capita': 2581.6997, + 'Life expectancy at birth': 66.2, + 'Fertility rate': 4.7259, + 'Child mortality rate': 4.5864897, + Size: 63588332 + }, + { + Country: 'Thailand', + 'GDP per capita': 17077.043, + 'Life expectancy at birth': 78.7, + 'Fertility rate': 1.3305, + 'Child mortality rate': 0.83185995, + Size: 71601104 + }, + { + Country: 'Togo', + 'GDP per capita': 2124.8042, + 'Life expectancy at birth': 61.6, + 'Fertility rate': 4.2574, + 'Child mortality rate': 6.23662, + Size: 8644829 + }, + { + Country: 'Tonga', + 'GDP per capita': 6142.857, + 'Life expectancy at birth': 71, + 'Fertility rate': 3.2367, + 'Child mortality rate': 1.13757, + Size: 106034 + }, + { + Country: 'Trinidad and Tobago', + 'GDP per capita': 23037.143, + 'Life expectancy at birth': 73, + 'Fertility rate': 1.6263, + 'Child mortality rate': 1.67332, + Size: 1525671 + }, + { + Country: 'Tunisia', + 'GDP per capita': 10397.944, + 'Life expectancy at birth': 73.8, + 'Fertility rate': 2.0859, + 'Child mortality rate': 1.63162, + Size: 12262949 + }, + { + Country: 'Turkey', + 'GDP per capita': 31466.56, + 'Life expectancy at birth': 76, + 'Fertility rate': 1.8892, + 'Child mortality rate': 0.89898, + Size: 84775408 + }, + { + Country: 'Turks and Caicos Islands', + 'GDP per capita': 18512.457, + 'Life expectancy at birth': 74.6, + 'Fertility rate': 1.6691, + 'Child mortality rate': 1.41906, + Size: 45141 + }, + { + Country: 'Tuvalu', + 'GDP per capita': 4924.0273, + 'Life expectancy at birth': 64.5, + 'Fertility rate': 3.1635, + 'Child mortality rate': 2.12823, + Size: 11229 + }, + { + Country: 'Uganda', + 'GDP per capita': 2246.414, + 'Life expectancy at birth': 62.7, + 'Fertility rate': 4.5845, + 'Child mortality rate': 4.16203, + Size: 45853780 + }, + { + Country: 'Ukraine', + 'GDP per capita': 12943.614, + 'Life expectancy at birth': 71.6, + 'Fertility rate': 1.2507, + 'Child mortality rate': 0.65102, + Size: 43531424 + }, + { + Country: 'United Arab Emirates', + 'GDP per capita': 69733.8, + 'Life expectancy at birth': 78.7, + 'Fertility rate': 1.4597, + 'Child mortality rate': 0.65115, + Size: 9365149 + }, + { + Country: 'United Kingdom', + 'GDP per capita': 44978.715, + 'Life expectancy at birth': 80.7, + 'Fertility rate': 1.562, + 'Child mortality rate': 0.40983, + Size: 67281040 + }, + { + Country: 'United States', + 'GDP per capita': 63669.71, + 'Life expectancy at birth': 77.2, + 'Fertility rate': 1.6619, + 'Child mortality rate': 0.62975997, + Size: 336997632 + }, + { + Country: 'Uruguay', + 'GDP per capita': 22800.69, + 'Life expectancy at birth': 75.4, + 'Fertility rate': 1.4927, + 'Child mortality rate': 0.55899, + Size: 3426265 + }, + { + Country: 'Uzbekistan', + 'GDP per capita': 7734.8325, + 'Life expectancy at birth': 70.9, + 'Fertility rate': 2.8565, + 'Child mortality rate': 1.31621, + Size: 34081452 + }, + { + Country: 'Vanuatu', + 'GDP per capita': 2783.0195, + 'Life expectancy at birth': 70.4, + 'Fertility rate': 3.7355, + 'Child mortality rate': 2.44538, + Size: 319146 + }, + { + Country: 'Vietnam', + 'GDP per capita': 10628.219, + 'Life expectancy at birth': 73.6, + 'Fertility rate': 1.9437, + 'Child mortality rate': 2.0830798, + Size: 97468024 + }, + { + Country: 'Zambia', + 'GDP per capita': 3236.789, + 'Life expectancy at birth': 61.2, + 'Fertility rate': 4.308, + 'Child mortality rate': 5.7186003, + Size: 19473132 + }, + { + Country: 'Zimbabwe', + 'GDP per capita': 2115.1445, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 3.4908, + 'Child mortality rate': 5.2148, + Size: 15993525 + }, + { + Country: 'Japan', + 'GDP per capita': 40784.383, + 'Life expectancy at birth': 84.8, + 'Fertility rate': 1.2974, + 'Child mortality rate': 0.24186, + Size: 124612528 + }, + { + Country: 'Kazakhstan', + 'GDP per capita': 26110.53, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 3.0836, + 'Child mortality rate': 0.99076, + Size: 19196468 + }, + { + Country: 'Mexico', + 'GDP per capita': 19086.105, + 'Life expectancy at birth': 70.2, + 'Fertility rate': 1.8223, + 'Child mortality rate': 1.35515, + Size: 126705136 + }, + { + Country: 'Norway', + 'GDP per capita': 65662.17, + 'Life expectancy at birth': 83.2, + 'Fertility rate': 1.5034, + 'Child mortality rate': 0.24258001, + Size: 5403021 + }, + { + Country: 'Armenia', + 'GDP per capita': 14193.117, + 'Life expectancy at birth': 72, + 'Fertility rate': 1.575, + 'Child mortality rate': 1.04387, + Size: 2790971 + }, + { + Country: 'Azerbaijan', + 'GDP per capita': 14431.661, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.6638, + 'Child mortality rate': 1.86127, + Size: 10312992 + }, + { + Country: 'Cyprus', + 'GDP per capita': 41701.703, + 'Life expectancy at birth': 81.2, + 'Fertility rate': 1.3208, + 'Child mortality rate': 0.27108, + Size: 1244193 + }, + { + Country: 'Laos', + 'GDP per capita': 7846.975, + 'Life expectancy at birth': 68.1, + 'Fertility rate': 2.4961, + 'Child mortality rate': 4.25943, + Size: 7425055 + }, + { + Country: 'Russia', + 'GDP per capita': 27960.102, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.4927, + 'Child mortality rate': 0.48901, + Size: 145102752 + }, + { + Country: 'Turkey', + 'GDP per capita': 31466.56, + 'Life expectancy at birth': 76, + 'Fertility rate': 1.8892, + 'Child mortality rate': 0.89898, + Size: 84775408 + }, + { + Country: 'East Timor', + 'GDP per capita': 5032.41, + 'Life expectancy at birth': 67.7, + 'Fertility rate': 3.1486, + 'Child mortality rate': 4.11491, + Size: 1320944 + }, + { + Country: 'Ecuador', + 'GDP per capita': 10668.758, + 'Life expectancy at birth': 73.7, + 'Fertility rate': 2.0256, + 'Child mortality rate': 1.24514, + Size: 17797736 + }, + { + Country: 'El Salvador', + 'GDP per capita': 9086.047, + 'Life expectancy at birth': 70.7, + 'Fertility rate': 1.8031, + 'Child mortality rate': 1.26651, + Size: 6314165 + }, + { + Country: 'Georgia', + 'GDP per capita': 15486.659, + 'Life expectancy at birth': 71.7, + 'Fertility rate': 2.0813, + 'Child mortality rate': 0.90087, + Size: 3757984 + }, + { + Country: 'Germany', + 'GDP per capita': 53179.656, + 'Life expectancy at birth': 80.6, + 'Fertility rate': 1.53, + 'Child mortality rate': 0.36256, + Size: 83408560 + }, + { + Country: 'Haiti', + 'GDP per capita': 2870.145, + 'Life expectancy at birth': 63.2, + 'Fertility rate': 2.8143, + 'Child mortality rate': 6.01092, + Size: 11447575 + }, + { + Country: 'Honduras', + 'GDP per capita': 5572.177, + 'Life expectancy at birth': 70.1, + 'Fertility rate': 2.363, + 'Child mortality rate': 1.6172899, + Size: 10278346 + }, + { + Country: 'Iran', + 'GDP per capita': 15004.6875, + 'Life expectancy at birth': 73.9, + 'Fertility rate': 1.6919, + 'Child mortality rate': 1.26375, + Size: 87923432 + }, + { + Country: 'Kazakhstan', + 'GDP per capita': 26110.53, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 3.0836, + 'Child mortality rate': 0.99076, + Size: 19196468 + }, + { + Country: 'Malaysia', + 'GDP per capita': 26333.156, + 'Life expectancy at birth': 74.9, + 'Fertility rate': 1.803, + 'Child mortality rate': 0.86048, + Size: 33573872 + }, + { + Country: 'Maldives', + 'GDP per capita': 18765.217, + 'Life expectancy at birth': 79.9, + 'Fertility rate': 1.6916, + 'Child mortality rate': 0.60084, + Size: 521469 + }, + { + Country: 'Mauritania', + 'GDP per capita': 5307.522, + 'Life expectancy at birth': 64.4, + 'Fertility rate': 4.3976, + 'Child mortality rate': 6.09523, + Size: 4614981 + }, + { + Country: 'Poland', + 'GDP per capita': 34915.523, + 'Life expectancy at birth': 76.5, + 'Fertility rate': 1.4587, + 'Child mortality rate': 0.40288, + Size: 38307724 + }, + { + Country: 'Puerto Rico', + 'GDP per capita': 32632.883, + 'Life expectancy at birth': 80.2, + 'Fertility rate': 1.2925, + 'Child mortality rate': 0.75082004, + Size: 3256030 + }, + { + Country: 'Samoa', + 'GDP per capita': 5534.127, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 3.9301, + 'Child mortality rate': 1.67608, + Size: 218781 + }, + { + Country: 'Serbia', + 'GDP per capita': 19831.297, + 'Life expectancy at birth': 74.2, + 'Fertility rate': 1.5278, + 'Child mortality rate': 0.5704, + Size: 7296771 + }, + { + Country: 'Switzerland', + 'GDP per capita': 71032.84, + 'Life expectancy at birth': 84, + 'Fertility rate': 1.4946, + 'Child mortality rate': 0.36673, + Size: 8691409 + }, + { + Country: 'Georgia', + 'GDP per capita': 15486.659, + 'Life expectancy at birth': 71.7, + 'Fertility rate': 2.0813, + 'Child mortality rate': 0.90087, + Size: 3757984 + } + ] + } + ], + axes: [ + { + orient: 'left', + id: 'axis-left', + type: 'linear', + label: { + autoLimit: false, + style: { + fill: '#1F2329', + fontSize: 16 + } + }, + domainLine: { + visible: true, + style: { + stroke: '#000000' + } + }, + tick: { + visible: true, + style: { + stroke: '#000000' + } + }, + grid: { + visible: false, + style: { + stroke: '#bbbfc4', + pickStrokeBuffer: 2 + } + }, + autoIndent: false, + maxWidth: null, + maxHeight: null, + visible: true + }, + { + orient: 'bottom', + id: 'axis-bottom', + type: 'linear', + label: { + autoLimit: false, + style: { + fill: '#1F2329', + fontSize: 16 + }, + formatMethod: null + }, + domainLine: { + visible: true, + style: { + stroke: '#000000' + } + }, + tick: { + visible: true, + style: { + stroke: '#000000' + } + }, + grid: { + visible: false, + style: { + stroke: '#bbbfc4', + pickStrokeBuffer: 2 + } + }, + autoIndent: false, + maxWidth: null, + maxHeight: null, + visible: true + } + ], + markLine: [ + { + endSymbol: { + visible: false + }, + startSymbol: { + visible: false + }, + label: { + visible: false + }, + line: { + style: { + stroke: '#f54a45', + lineWidth: 1, + pickStrokeBuffer: 10, + lineDash: [0, 0], + visible: true + } + }, + regionRelative: true, + positions: (data, series) => { + const points = data + .map(datum => { + const point = series.dataToPosition(datum); + return [point.x, point.y]; + }) + .sort((a, b) => a[0] - b[0]); + const regressionResult = logarithmic(points, { precision: 2 }); + return regressionResult.points.map(point => { + return { + x: point[0], + y: point[1] + }; + }); + } + } + ] +}; + +const vchart = new VChart(spec, { dom: CONTAINER_ID }); +vchart.renderSync(); + +// Just for the convenience of console debugging, DO NOT COPY! +window['vchart'] = vchart; +``` diff --git a/docs/assets/examples/menu.json b/docs/assets/examples/menu.json index d7f4b41162..b566e72ac6 100644 --- a/docs/assets/examples/menu.json +++ b/docs/assets/examples/menu.json @@ -2325,6 +2325,13 @@ "zh": "地理坐标系下的markPoint", "en": "markPoint in geo coordinates" } + }, + { + "path": "trend-line", + "title": { + "zh": "使用 MarkLine 绘制趋势线", + "en": "Draw trend line using MarkLine" + } } ] }, diff --git a/docs/assets/examples/zh/marker/trend-line.md b/docs/assets/examples/zh/marker/trend-line.md new file mode 100644 index 0000000000..cd658f63e6 --- /dev/null +++ b/docs/assets/examples/zh/marker/trend-line.md @@ -0,0 +1,1783 @@ +--- +category: examples +group: marker +title: TrendLine +keywords: marker,scatterChart +order: 33-6 +cover: /vchart/preview/trend-line-1.12.0.png +option: scatterChart#markLine +--- + +# 使用 MarkLine 绘制趋势线 + +## 关键配置 + +- 通过 `markLine.positions` 属性的回调函数支持趋势线的绘制 + +## 代码演示 + +```javascript livedemo +function determinationCoefficient(data, results) { + const predictions = []; + const observations = []; + + data.forEach((d, i) => { + if (d[1] !== null) { + observations.push(d); + predictions.push(results[i]); + } + }); + + const sum = observations.reduce((a, observation) => a + observation[1], 0); + const mean = sum / observations.length; + + const ssyy = observations.reduce((a, observation) => { + const difference = observation[1] - mean; + return a + difference * difference; + }, 0); + + const sse = observations.reduce((accum, observation, index) => { + const prediction = predictions[index]; + const residual = observation[1] - prediction[1]; + return accum + residual * residual; + }, 0); + + return 1 - sse / ssyy; +} + +function round(number, precision) { + const factor = 10 ** precision; + return Math.round(number * factor) / factor; +} + +function logarithmic(data, options) { + const sum = [0, 0, 0, 0]; + const len = data.length; + + for (let n = 0; n < len; n++) { + if (data[n][1] !== null) { + sum[0] += Math.log(data[n][0]); + sum[1] += data[n][1] * Math.log(data[n][0]); + sum[2] += data[n][1]; + sum[3] += Math.log(data[n][0]) ** 2; + } + } + + const a = (len * sum[1] - sum[2] * sum[0]) / (len * sum[3] - sum[0] * sum[0]); + const coeffB = round(a, options.precision); + const coeffA = round((sum[2] - coeffB * sum[0]) / len, options.precision); + + const predict = x => [ + round(x, options.precision), + round(round(coeffA + coeffB * Math.log(x), options.precision), options.precision) + ]; + + const points = data.map(point => predict(point[0])); + + return { + points, + predict, + equation: [coeffA, coeffB], + string: `y = ${coeffA} + ${coeffB} ln(x)`, + r2: round(determinationCoefficient(data, points), options.precision) + }; +} + +const spec = { + type: 'scatter', + stack: false, + size: [5, 50], + + xField: 'GDP per capita', + yField: 'Life expectancy at birth', + sizeField: 'Size', + legends: { + visible: false + }, + data: [ + { + id: '0', + sourceKey: 'total', + values: [ + { + Country: 'Afghanistan', + 'GDP per capita': 1516.3057, + 'Life expectancy at birth': 62, + 'Fertility rate': 4.6434, + 'Child mortality rate': 5.79324, + Size: 40099460 + }, + { + Country: 'Albania', + 'GDP per capita': 14518.906, + 'Life expectancy at birth': 76.5, + 'Fertility rate': 1.3897, + 'Child mortality rate': 0.99849004, + Size: 2854710 + }, + { + Country: 'Algeria', + 'GDP per capita': 11039.806, + 'Life expectancy at birth': 76.4, + 'Fertility rate': 2.8886, + 'Child mortality rate': 2.21071, + Size: 44177964 + }, + { + Country: 'Angola', + 'GDP per capita': 5908.57, + 'Life expectancy at birth': 61.6, + 'Fertility rate': 5.3044, + 'Child mortality rate': 6.88471, + Size: 34503776 + }, + { + Country: 'Antigua and Barbuda', + 'GDP per capita': 19124.43, + 'Life expectancy at birth': 78.5, + 'Fertility rate': 1.5798, + 'Child mortality rate': 0.61823, + Size: 93229 + }, + { + Country: 'Argentina', + 'GDP per capita': 21527.195, + 'Life expectancy at birth': 75.4, + 'Fertility rate': 1.8854, + 'Child mortality rate': 1.07809, + Size: 45276788 + }, + { + Country: 'Armenia', + 'GDP per capita': 14193.117, + 'Life expectancy at birth': 72, + 'Fertility rate': 1.575, + 'Child mortality rate': 1.04387, + Size: 2790971 + }, + { + Country: 'Aruba', + 'GDP per capita': 38866.332, + 'Life expectancy at birth': 74.6, + 'Fertility rate': 1.1803, + 'Child mortality rate': 1.48334, + Size: 106543 + }, + { + Country: 'Australia', + 'GDP per capita': 49774.34, + 'Life expectancy at birth': 84.5, + 'Fertility rate': 1.5962, + 'Child mortality rate': 0.33908, + Size: 25921094 + }, + { + Country: 'Austria', + 'GDP per capita': 54121.145, + 'Life expectancy at birth': 81.6, + 'Fertility rate': 1.4701, + 'Child mortality rate': 0.35735, + Size: 8922086 + }, + { + Country: 'Azerbaijan', + 'GDP per capita': 14431.661, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.6638, + 'Child mortality rate': 1.86127, + Size: 10312992 + }, + { + Country: 'Bahamas', + 'GDP per capita': 30210.162, + 'Life expectancy at birth': 71.6, + 'Fertility rate': 1.3889, + 'Child mortality rate': 1.1871899, + Size: 407920 + }, + { + Country: 'Bahrain', + 'GDP per capita': 49387.418, + 'Life expectancy at birth': 78.8, + 'Fertility rate': 1.811, + 'Child mortality rate': 0.67073, + Size: 1463266 + }, + { + Country: 'Bangladesh', + 'GDP per capita': 5911.013, + 'Life expectancy at birth': 72.4, + 'Fertility rate': 1.981, + 'Child mortality rate': 2.7698998, + Size: 169356240 + }, + { + Country: 'Barbados', + 'GDP per capita': 13754.803, + 'Life expectancy at birth': 77.6, + 'Fertility rate': 1.6327, + 'Child mortality rate': 1.1844, + Size: 281204 + }, + { + Country: 'Belarus', + 'GDP per capita': 19751.203, + 'Life expectancy at birth': 72.4, + 'Fertility rate': 1.483, + 'Child mortality rate': 0.27184, + Size: 9578172 + }, + { + Country: 'Belgium', + 'GDP per capita': 51739.54, + 'Life expectancy at birth': 81.9, + 'Fertility rate': 1.5831, + 'Child mortality rate': 0.39669, + Size: 11611416 + }, + { + Country: 'Belize', + 'GDP per capita': 8762.623, + 'Life expectancy at birth': 70.5, + 'Fertility rate': 2.0104, + 'Child mortality rate': 1.1736801, + Size: 400037 + }, + { + Country: 'Benin', + 'GDP per capita': 3321.5522, + 'Life expectancy at birth': 59.8, + 'Fertility rate': 4.9731, + 'Child mortality rate': 8.33789, + Size: 12996901 + }, + { + Country: 'Bermuda', + 'GDP per capita': 80271.13, + 'Life expectancy at birth': 79.3, + 'Fertility rate': 1.3631, + 'Child mortality rate': 0.28224, + Size: 64213 + }, + { + Country: 'Bhutan', + 'GDP per capita': 10907.856, + 'Life expectancy at birth': 71.8, + 'Fertility rate': 1.4132, + 'Child mortality rate': 2.68407, + Size: 777500 + }, + { + Country: 'Bolivia', + 'GDP per capita': 8052.1772, + 'Life expectancy at birth': 63.6, + 'Fertility rate': 2.6178, + 'Child mortality rate': 3.55129, + Size: 12079474 + }, + { + Country: 'Bosnia and Herzegovina', + 'GDP per capita': 15666.54, + 'Life expectancy at birth': 75.3, + 'Fertility rate': 1.3498, + 'Child mortality rate': 0.55809003, + Size: 3270948 + }, + { + Country: 'Botswana', + 'GDP per capita': 14840.913, + 'Life expectancy at birth': 61.1, + 'Fertility rate': 2.7914, + 'Child mortality rate': 4.44968, + Size: 2588424 + }, + { + Country: 'Brazil', + 'GDP per capita': 14592.353, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 1.6406, + 'Child mortality rate': 1.4446, + Size: 214326224 + }, + { + Country: 'Brunei', + 'GDP per capita': 60127.023, + 'Life expectancy at birth': 74.6, + 'Fertility rate': 1.7779, + 'Child mortality rate': 1.10831, + Size: 445382 + }, + { + Country: 'Bulgaria', + 'GDP per capita': 24398.13, + 'Life expectancy at birth': 71.8, + 'Fertility rate': 1.586, + 'Child mortality rate': 0.61714, + Size: 6885864 + }, + { + Country: 'Burkina Faso', + 'GDP per capita': 2179.789, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 4.7718, + 'Child mortality rate': 8.27705, + Size: 22100690 + }, + { + Country: 'Burundi', + 'GDP per capita': 705.0304, + 'Life expectancy at birth': 61.7, + 'Fertility rate': 5.0779, + 'Child mortality rate': 5.24944, + Size: 12551215 + }, + { + Country: 'Cambodia', + 'GDP per capita': 4354.5654, + 'Life expectancy at birth': 69.6, + 'Fertility rate': 2.3438, + 'Child mortality rate': 2.47492, + Size: 16589031 + }, + { + Country: 'Cameroon', + 'GDP per capita': 3700.4644, + 'Life expectancy at birth': 60.3, + 'Fertility rate': 4.4633, + 'Child mortality rate': 6.9737396, + Size: 27198632 + }, + { + Country: 'Canada', + 'GDP per capita': 47892.945, + 'Life expectancy at birth': 82.7, + 'Fertility rate': 1.4635, + 'Child mortality rate': 0.48908, + Size: 38155012 + }, + { + Country: 'Cape Verde', + 'GDP per capita': 6114.1333, + 'Life expectancy at birth': 74.1, + 'Fertility rate': 1.8956, + 'Child mortality rate': 1.35761, + Size: 587936 + }, + { + Country: 'Cayman Islands', + 'GDP per capita': 67500.1, + 'Life expectancy at birth': 75.1, + 'Fertility rate': 1.2191, + 'Child mortality rate': 0.93649995, + Size: 68157 + }, + { + Country: 'Central African Republic', + 'GDP per capita': 837.5047, + 'Life expectancy at birth': 53.9, + 'Fertility rate': 5.9783, + 'Child mortality rate': 10.1913595, + Size: 5457165 + }, + { + Country: 'Chad', + 'GDP per capita': 1425.4945, + 'Life expectancy at birth': 52.5, + 'Fertility rate': 6.2549, + 'Child mortality rate': 10.66955, + Size: 17179744 + }, + { + Country: 'Chile', + 'GDP per capita': 25449.13, + 'Life expectancy at birth': 78.9, + 'Fertility rate': 1.5375, + 'Child mortality rate': 0.56016004, + Size: 19493184 + }, + { + Country: 'China', + 'GDP per capita': 17602.695, + 'Life expectancy at birth': 78.2, + 'Fertility rate': 1.164, + 'Child mortality rate': 0.68583, + Size: 1425893504 + }, + { + Country: 'Colombia', + 'GDP per capita': 14648.592, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 1.7168, + 'Child mortality rate': 1.29233, + Size: 51516560 + }, + { + Country: 'Comoros', + 'GDP per capita': 3228.5269, + 'Life expectancy at birth': 63.4, + 'Fertility rate': 3.9777, + 'Child mortality rate': 5.85155, + Size: 821632 + }, + { + Country: 'Congo', + 'GDP per capita': 3234.393, + 'Life expectancy at birth': 63.5, + 'Fertility rate': 4.1707, + 'Child mortality rate': 4.3193297, + Size: 5835814 + }, + { + Country: 'Costa Rica', + 'GDP per capita': 21199.281, + 'Life expectancy at birth': 77, + 'Fertility rate': 1.5335, + 'Child mortality rate': 0.7631, + Size: 5153959 + }, + { + Country: "Cote d'Ivoire", + 'GDP per capita': 5325.0303, + 'Life expectancy at birth': 58.6, + 'Fertility rate': 4.418, + 'Child mortality rate': 7.56744, + Size: 27478250 + }, + { + Country: 'Croatia', + 'GDP per capita': 31635.824, + 'Life expectancy at birth': 77.6, + 'Fertility rate': 1.4518, + 'Child mortality rate': 0.49962002, + Size: 4060139 + }, + { + Country: 'Curacao', + 'GDP per capita': 20783.086, + 'Life expectancy at birth': 75.4, + 'Fertility rate': 1.6509, + 'Child mortality rate': 0.98373, + Size: 190348 + }, + { + Country: 'Cyprus', + 'GDP per capita': 41701.703, + 'Life expectancy at birth': 81.2, + 'Fertility rate': 1.3208, + 'Child mortality rate': 0.27108, + Size: 1244193 + }, + { + Country: 'Czechia', + 'GDP per capita': 40740.992, + 'Life expectancy at birth': 77.7, + 'Fertility rate': 1.6986, + 'Child mortality rate': 0.28872, + Size: 10510748 + }, + { + Country: 'Democratic Republic of Congo', + 'GDP per capita': 1073.6433, + 'Life expectancy at birth': 59.2, + 'Fertility rate': 6.1564, + 'Child mortality rate': 7.8581495, + Size: 95894120 + }, + { + Country: 'Denmark', + 'GDP per capita': 57962.652, + 'Life expectancy at birth': 81.4, + 'Fertility rate': 1.7187, + 'Child mortality rate': 0.32694, + Size: 5854246 + }, + { + Country: 'Djibouti', + 'GDP per capita': 4913.2563, + 'Life expectancy at birth': 62.3, + 'Fertility rate': 2.8041, + 'Child mortality rate': 5.4339, + Size: 1105562 + }, + { + Country: 'Dominica', + 'GDP per capita': 10878.037, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 1.5949, + 'Child mortality rate': 1.3676699, + Size: 72435 + }, + { + Country: 'Dominican Republic', + 'GDP per capita': 18626.078, + 'Life expectancy at birth': 72.6, + 'Fertility rate': 2.2727, + 'Child mortality rate': 3.2994301, + Size: 11117873 + }, + { + Country: 'Egypt', + 'GDP per capita': 11566.05, + 'Life expectancy at birth': 70.2, + 'Fertility rate': 2.9174, + 'Child mortality rate': 1.88508, + Size: 109262184 + }, + { + Country: 'Equatorial Guinea', + 'GDP per capita': 14637.008, + 'Life expectancy at birth': 60.6, + 'Fertility rate': 4.266, + 'Child mortality rate': 7.57025, + Size: 1634473 + }, + { + Country: 'Estonia', + 'GDP per capita': 38717.695, + 'Life expectancy at birth': 77.1, + 'Fertility rate': 1.6761, + 'Child mortality rate': 0.18729, + Size: 1328704 + }, + { + Country: 'Eswatini', + 'GDP per capita': 8856.829, + 'Life expectancy at birth': 57.1, + 'Fertility rate': 2.8395, + 'Child mortality rate': 5.05009, + Size: 1192273 + }, + { + Country: 'Ethiopia', + 'GDP per capita': 2319.0684, + 'Life expectancy at birth': 65, + 'Fertility rate': 4.1591, + 'Child mortality rate': 4.7206903, + Size: 120283024 + }, + { + Country: 'Fiji', + 'GDP per capita': 10359.204, + 'Life expectancy at birth': 67.1, + 'Fertility rate': 2.4748, + 'Child mortality rate': 2.79012, + Size: 924615 + }, + { + Country: 'Finland', + 'GDP per capita': 48753.355, + 'Life expectancy at birth': 82, + 'Fertility rate': 1.3891, + 'Child mortality rate': 0.23526001, + Size: 5535982 + }, + { + Country: 'France', + 'GDP per capita': 44993.125, + 'Life expectancy at birth': 82.5, + 'Fertility rate': 1.79, + 'Child mortality rate': 0.41957998, + Size: 64531448 + }, + { + Country: 'Gabon', + 'GDP per capita': 13813.723, + 'Life expectancy at birth': 65.8, + 'Fertility rate': 3.491, + 'Child mortality rate': 3.94095, + Size: 2341185 + }, + { + Country: 'Gambia', + 'GDP per capita': 2076.5664, + 'Life expectancy at birth': 62.1, + 'Fertility rate': 4.6838, + 'Child mortality rate': 4.78102, + Size: 2639922 + }, + { + Country: 'Ghana', + 'GDP per capita': 5435.238, + 'Life expectancy at birth': 63.8, + 'Fertility rate': 3.5633, + 'Child mortality rate': 4.32603, + Size: 32833036 + }, + { + Country: 'Greece', + 'GDP per capita': 29548.04, + 'Life expectancy at birth': 80.1, + 'Fertility rate': 1.371, + 'Child mortality rate': 0.39897, + Size: 10445368 + }, + { + Country: 'Grenada', + 'GDP per capita': 13688.256, + 'Life expectancy at birth': 74.9, + 'Fertility rate': 2.0043, + 'Child mortality rate': 1.60784, + Size: 124624 + }, + { + Country: 'Guatemala', + 'GDP per capita': 8926.7, + 'Life expectancy at birth': 69.2, + 'Fertility rate': 2.3948, + 'Child mortality rate': 2.2902, + Size: 17608484 + }, + { + Country: 'Guinea', + 'GDP per capita': 2640.3442, + 'Life expectancy at birth': 58.9, + 'Fertility rate': 4.3987, + 'Child mortality rate': 9.30472, + Size: 13531909 + }, + { + Country: 'Guinea-Bissau', + 'GDP per capita': 1831.3832, + 'Life expectancy at birth': 59.7, + 'Fertility rate': 4.0055, + 'Child mortality rate': 7.4228697, + Size: 2060730 + }, + { + Country: 'Guyana', + 'GDP per capita': 21925.188, + 'Life expectancy at birth': 65.7, + 'Fertility rate': 2.3972, + 'Child mortality rate': 2.7539, + Size: 804571 + }, + { + Country: 'Hong Kong', + 'GDP per capita': 59978.15, + 'Life expectancy at birth': 85.5, + 'Fertility rate': 0.7455, + 'Child mortality rate': 0.19231, + Size: 7494580 + }, + { + Country: 'Hungary', + 'GDP per capita': 33593.152, + 'Life expectancy at birth': 74.5, + 'Fertility rate': 1.5782, + 'Child mortality rate': 0.41023, + Size: 9709784 + }, + { + Country: 'Iceland', + 'GDP per capita': 53586.156, + 'Life expectancy at birth': 82.7, + 'Fertility rate': 1.7329, + 'Child mortality rate': 0.1495, + Size: 370338 + }, + { + Country: 'India', + 'GDP per capita': 6592.042, + 'Life expectancy at birth': 67.2, + 'Fertility rate': 2.0308, + 'Child mortality rate': 3.11861, + Size: 1407563904 + }, + { + Country: 'Indonesia', + 'GDP per capita': 11858.146, + 'Life expectancy at birth': 67.6, + 'Fertility rate': 2.1746, + 'Child mortality rate': 2.23194, + Size: 273753184 + }, + { + Country: 'Iraq', + 'GDP per capita': 8962.395, + 'Life expectancy at birth': 70.4, + 'Fertility rate': 3.4955, + 'Child mortality rate': 2.46205, + Size: 43533592 + }, + { + Country: 'Ireland', + 'GDP per capita': 102496.22, + 'Life expectancy at birth': 82, + 'Fertility rate': 1.7678, + 'Child mortality rate': 0.28796, + Size: 4986525 + }, + { + Country: 'Israel', + 'GDP per capita': 42061.242, + 'Life expectancy at birth': 82.3, + 'Fertility rate': 2.9764, + 'Child mortality rate': 0.37339002, + Size: 8900057 + }, + { + Country: 'Italy', + 'GDP per capita': 41929.43, + 'Life expectancy at birth': 82.9, + 'Fertility rate': 1.2825, + 'Child mortality rate': 0.27309, + Size: 59240336 + }, + { + Country: 'Jamaica', + 'GDP per capita': 9596.564, + 'Life expectancy at birth': 70.5, + 'Fertility rate': 1.352, + 'Child mortality rate': 1.33336, + Size: 2827701 + }, + { + Country: 'Jordan', + 'GDP per capita': 9223.147, + 'Life expectancy at birth': 74.3, + 'Fertility rate': 2.8297, + 'Child mortality rate': 1.43536, + Size: 11148288 + }, + { + Country: 'Kenya', + 'GDP per capita': 4743.4863, + 'Life expectancy at birth': 61.4, + 'Fertility rate': 3.3351, + 'Child mortality rate': 4.1131, + Size: 53005616 + }, + { + Country: 'Kiribati', + 'GDP per capita': 1937.0894, + 'Life expectancy at birth': 67.4, + 'Fertility rate': 3.3038, + 'Child mortality rate': 4.75164, + Size: 128883 + }, + { + Country: 'Kyrgyzstan', + 'GDP per capita': 4814.9565, + 'Life expectancy at birth': 70, + 'Fertility rate': 2.9912, + 'Child mortality rate': 1.68766, + Size: 6527742 + }, + { + Country: 'Latvia', + 'GDP per capita': 32081.455, + 'Life expectancy at birth': 73.6, + 'Fertility rate': 1.5827, + 'Child mortality rate': 0.39695, + Size: 1873926 + }, + { + Country: 'Lebanon', + 'GDP per capita': 12977.202, + 'Life expectancy at birth': 75, + 'Fertility rate': 2.0912, + 'Child mortality rate': 0.67698, + Size: 5592626 + }, + { + Country: 'Lesotho', + 'GDP per capita': 2295.2322, + 'Life expectancy at birth': 53.1, + 'Fertility rate': 3.0176, + 'Child mortality rate': 8.71052, + Size: 2281464 + }, + { + Country: 'Liberia', + 'GDP per capita': 1423.2296, + 'Life expectancy at birth': 60.7, + 'Fertility rate': 4.0885, + 'Child mortality rate': 7.54857, + Size: 5193422 + }, + { + Country: 'Libya', + 'GDP per capita': 21965.174, + 'Life expectancy at birth': 71.9, + 'Fertility rate': 2.4624, + 'Child mortality rate': 1.10779, + Size: 6735280 + }, + { + Country: 'Lithuania', + 'GDP per capita': 39305.613, + 'Life expectancy at birth': 73.7, + 'Fertility rate': 1.6222, + 'Child mortality rate': 0.33962, + Size: 2786652 + }, + { + Country: 'Luxembourg', + 'GDP per capita': 115683.49, + 'Life expectancy at birth': 82.6, + 'Fertility rate': 1.3877, + 'Child mortality rate': 0.52484, + Size: 639330 + }, + { + Country: 'Macao', + 'GDP per capita': 64796.996, + 'Life expectancy at birth': 85.4, + 'Fertility rate': 1.0883, + 'Child mortality rate': 0.32282, + Size: 686616 + }, + { + Country: 'Madagascar', + 'GDP per capita': 1463.6288, + 'Life expectancy at birth': 64.5, + 'Fertility rate': 3.8514, + 'Child mortality rate': 4.87476, + Size: 28915652 + }, + { + Country: 'Malawi', + 'GDP per capita': 1491.1339, + 'Life expectancy at birth': 62.9, + 'Fertility rate': 3.9165, + 'Child mortality rate': 3.8196702, + Size: 19889742 + }, + { + Country: 'Mali', + 'GDP per capita': 2120.6233, + 'Life expectancy at birth': 58.9, + 'Fertility rate': 5.9564, + 'Child mortality rate': 8.82339, + Size: 21904990 + }, + { + Country: 'Malta', + 'GDP per capita': 44658.72, + 'Life expectancy at birth': 83.8, + 'Fertility rate': 1.1783, + 'Child mortality rate': 0.42745, + Size: 526751 + }, + { + Country: 'Marshall Islands', + 'GDP per capita': 5961.8164, + 'Life expectancy at birth': 65.3, + 'Fertility rate': 2.7288, + 'Child mortality rate': 2.95682, + Size: 42074 + }, + { + Country: 'Mauritius', + 'GDP per capita': 20967.947, + 'Life expectancy at birth': 73.6, + 'Fertility rate': 1.4105, + 'Child mortality rate': 1.69755, + Size: 1298922 + }, + { + Country: 'Micronesia (country)', + 'GDP per capita': 3315.2302, + 'Life expectancy at birth': 70.7, + 'Fertility rate': 2.7114, + 'Child mortality rate': 2.38641, + Size: 113143 + }, + { + Country: 'Moldova', + 'GDP per capita': 14009.226, + 'Life expectancy at birth': 68.8, + 'Fertility rate': 1.8058, + 'Child mortality rate': 1.4253199, + Size: 3061509 + }, + { + Country: 'Mongolia', + 'GDP per capita': 11668.431, + 'Life expectancy at birth': 71, + 'Fertility rate': 2.8371, + 'Child mortality rate': 1.4805601, + Size: 3347782 + }, + { + Country: 'Montenegro', + 'GDP per capita': 20602.5, + 'Life expectancy at birth': 76.3, + 'Fertility rate': 1.6914, + 'Child mortality rate': 0.14623, + Size: 627856 + }, + { + Country: 'Morocco', + 'GDP per capita': 8058.397, + 'Life expectancy at birth': 74, + 'Fertility rate': 2.328, + 'Child mortality rate': 1.7918699, + Size: 37076588 + }, + { + Country: 'Mozambique', + 'GDP per capita': 1226.767, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 4.6444, + 'Child mortality rate': 6.84142, + Size: 32077074 + }, + { + Country: 'Myanmar', + 'GDP per capita': 4032.6257, + 'Life expectancy at birth': 65.7, + 'Fertility rate': 2.1514, + 'Child mortality rate': 4.27911, + Size: 53798088 + }, + { + Country: 'Namibia', + 'GDP per capita': 9137.797, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 3.3025, + 'Child mortality rate': 3.8573601, + Size: 2530150 + }, + { + Country: 'Nauru', + 'GDP per capita': 11947.395, + 'Life expectancy at birth': 63.6, + 'Fertility rate': 3.5187, + 'Child mortality rate': 1.8978001, + Size: 12533 + }, + { + Country: 'Nepal', + 'GDP per capita': 3831.9485, + 'Life expectancy at birth': 68.4, + 'Fertility rate': 2.0293, + 'Child mortality rate': 2.7374902, + Size: 30034988 + }, + { + Country: 'Netherlands', + 'GDP per capita': 56617.35, + 'Life expectancy at birth': 81.7, + 'Fertility rate': 1.6404, + 'Child mortality rate': 0.40461, + Size: 17501696 + }, + { + Country: 'New Zealand', + 'GDP per capita': 42915.453, + 'Life expectancy at birth': 82.5, + 'Fertility rate': 1.7733, + 'Child mortality rate': 0.46201, + Size: 5129730 + }, + { + Country: 'Nicaragua', + 'GDP per capita': 5638.748, + 'Life expectancy at birth': 73.8, + 'Fertility rate': 2.3213, + 'Child mortality rate': 1.54514, + Size: 6850546 + }, + { + Country: 'Niger', + 'GDP per capita': 1186.5768, + 'Life expectancy at birth': 61.6, + 'Fertility rate': 6.82, + 'Child mortality rate': 7.53853, + Size: 25252722 + }, + { + Country: 'Nigeria', + 'GDP per capita': 4922.6323, + 'Life expectancy at birth': 52.7, + 'Fertility rate': 5.2374, + 'Child mortality rate': 11.123549, + Size: 213401328 + }, + { + Country: 'North Macedonia', + 'GDP per capita': 16467.316, + 'Life expectancy at birth': 73.8, + 'Fertility rate': 1.3633, + 'Child mortality rate': 0.67988, + Size: 2103329 + }, + { + Country: 'Oman', + 'GDP per capita': 34294.766, + 'Life expectancy at birth': 72.5, + 'Fertility rate': 2.6233, + 'Child mortality rate': 1.11421, + Size: 4520474 + }, + { + Country: 'Pakistan', + 'GDP per capita': 5232.1426, + 'Life expectancy at birth': 66.1, + 'Fertility rate': 3.4698, + 'Child mortality rate': 6.3176603, + Size: 231402112 + }, + { + Country: 'Palau', + 'GDP per capita': 13785.397, + 'Life expectancy at birth': 66, + 'Fertility rate': 2.409, + 'Child mortality rate': 1.73272, + Size: 18050 + }, + { + Country: 'Panama', + 'GDP per capita': 29037.945, + 'Life expectancy at birth': 76.2, + 'Fertility rate': 2.3252, + 'Child mortality rate': 1.7161, + Size: 4351264 + }, + { + Country: 'Papua New Guinea', + 'GDP per capita': 3677.4602, + 'Life expectancy at birth': 65.4, + 'Fertility rate': 3.2147, + 'Child mortality rate': 4.22622, + Size: 9949438 + }, + { + Country: 'Paraguay', + 'GDP per capita': 13687.655, + 'Life expectancy at birth': 70.3, + 'Fertility rate': 2.4689, + 'Child mortality rate': 1.8373501, + Size: 6703802 + }, + { + Country: 'Peru', + 'GDP per capita': 12514.651, + 'Life expectancy at birth': 72.4, + 'Fertility rate': 2.1917, + 'Child mortality rate': 1.23791, + Size: 33715464 + }, + { + Country: 'Philippines', + 'GDP per capita': 8094.693, + 'Life expectancy at birth': 69.3, + 'Fertility rate': 2.7476, + 'Child mortality rate': 2.53896, + Size: 113880336 + }, + { + Country: 'Portugal', + 'GDP per capita': 33674.527, + 'Life expectancy at birth': 81, + 'Fertility rate': 1.3631, + 'Child mortality rate': 0.3335, + Size: 10290109 + }, + { + Country: 'Qatar', + 'GDP per capita': 92862.35, + 'Life expectancy at birth': 79.3, + 'Fertility rate': 1.8008, + 'Child mortality rate': 0.5544, + Size: 2688239 + }, + { + Country: 'Romania', + 'GDP per capita': 30776.93, + 'Life expectancy at birth': 74.2, + 'Fertility rate': 1.748, + 'Child mortality rate': 0.66375, + Size: 19328558 + }, + { + Country: 'Russia', + 'GDP per capita': 27960.102, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.4927, + 'Child mortality rate': 0.48901, + Size: 145102752 + }, + { + Country: 'Rwanda', + 'GDP per capita': 2238.9573, + 'Life expectancy at birth': 66.1, + 'Fertility rate': 3.8207, + 'Child mortality rate': 3.86737, + Size: 13461891 + }, + { + Country: 'Saint Kitts and Nevis', + 'GDP per capita': 26485.816, + 'Life expectancy at birth': 71.7, + 'Fertility rate': 1.5307, + 'Child mortality rate': 1.09988, + Size: 47631 + }, + { + Country: 'Saint Lucia', + 'GDP per capita': 13045.955, + 'Life expectancy at birth': 71.1, + 'Fertility rate': 1.399, + 'Child mortality rate': 1.44284, + Size: 179663 + }, + { + Country: 'Saint Vincent and the Grenadines', + 'GDP per capita': 13695.039, + 'Life expectancy at birth': 69.6, + 'Fertility rate': 1.7971, + 'Child mortality rate': 1.40908, + Size: 104340 + }, + { + Country: 'Sao Tome and Principe', + 'GDP per capita': 4052.1233, + 'Life expectancy at birth': 67.6, + 'Fertility rate': 3.8226, + 'Child mortality rate': 1.4605, + Size: 223118 + }, + { + Country: 'Saudi Arabia', + 'GDP per capita': 44339.312, + 'Life expectancy at birth': 76.9, + 'Fertility rate': 2.4266, + 'Child mortality rate': 0.68990004, + Size: 35950396 + }, + { + Country: 'Senegal', + 'GDP per capita': 3495.4036, + 'Life expectancy at birth': 67.1, + 'Fertility rate': 4.3871, + 'Child mortality rate': 3.6707, + Size: 16876726 + }, + { + Country: 'Seychelles', + 'GDP per capita': 28760.516, + 'Life expectancy at birth': 71.3, + 'Fertility rate': 2.3484, + 'Child mortality rate': 1.3638799, + Size: 106486 + }, + { + Country: 'Sierra Leone', + 'GDP per capita': 1614.6981, + 'Life expectancy at birth': 60.1, + 'Fertility rate': 3.9779, + 'Child mortality rate': 9.950319, + Size: 8420642 + }, + { + Country: 'Singapore', + 'GDP per capita': 106032.23, + 'Life expectancy at birth': 82.8, + 'Fertility rate': 1.0243, + 'Child mortality rate': 0.20560999, + Size: 5941063 + }, + { + Country: 'Slovakia', + 'GDP per capita': 31866.025, + 'Life expectancy at birth': 74.9, + 'Fertility rate': 1.5664, + 'Child mortality rate': 0.58063996, + Size: 5447621 + }, + { + Country: 'Slovenia', + 'GDP per capita': 40036.484, + 'Life expectancy at birth': 80.7, + 'Fertility rate': 1.6272, + 'Child mortality rate': 0.23640999, + Size: 2119408 + }, + { + Country: 'Solomon Islands', + 'GDP per capita': 2406.1135, + 'Life expectancy at birth': 70.3, + 'Fertility rate': 3.9832, + 'Child mortality rate': 1.87301, + Size: 707855 + }, + { + Country: 'Somalia', + 'GDP per capita': 1136.736, + 'Life expectancy at birth': 55.3, + 'Fertility rate': 6.3123, + 'Child mortality rate': 11.18507, + Size: 17065588 + }, + { + Country: 'South Africa', + 'GDP per capita': 13311.926, + 'Life expectancy at birth': 62.3, + 'Fertility rate': 2.374, + 'Child mortality rate': 3.50681, + Size: 59392256 + }, + { + Country: 'South Korea', + 'GDP per capita': 44232.207, + 'Life expectancy at birth': 83.7, + 'Fertility rate': 0.8799, + 'Child mortality rate': 0.29209, + Size: 51830136 + }, + { + Country: 'Spain', + 'GDP per capita': 37913.074, + 'Life expectancy at birth': 83, + 'Fertility rate': 1.2779, + 'Child mortality rate': 0.29862002, + Size: 47486932 + }, + { + Country: 'Sri Lanka', + 'GDP per capita': 13386.682, + 'Life expectancy at birth': 76.4, + 'Fertility rate': 1.9899, + 'Child mortality rate': 0.67038, + Size: 21773438 + }, + { + Country: 'Sudan', + 'GDP per capita': 3701.069, + 'Life expectancy at birth': 65.3, + 'Fertility rate': 4.4574, + 'Child mortality rate': 5.47112, + Size: 45657204 + }, + { + Country: 'Suriname', + 'GDP per capita': 14766.748, + 'Life expectancy at birth': 70.3, + 'Fertility rate': 2.3482, + 'Child mortality rate': 1.7073, + Size: 612989 + }, + { + Country: 'Sweden', + 'GDP per capita': 53613.42, + 'Life expectancy at birth': 83, + 'Fertility rate': 1.67, + 'Child mortality rate': 0.23731, + Size: 10467095 + }, + { + Country: 'Tajikistan', + 'GDP per capita': 3903.32, + 'Life expectancy at birth': 71.6, + 'Fertility rate': 3.1855, + 'Child mortality rate': 3.13161, + Size: 9750078 + }, + { + Country: 'Tanzania', + 'GDP per capita': 2581.6997, + 'Life expectancy at birth': 66.2, + 'Fertility rate': 4.7259, + 'Child mortality rate': 4.5864897, + Size: 63588332 + }, + { + Country: 'Thailand', + 'GDP per capita': 17077.043, + 'Life expectancy at birth': 78.7, + 'Fertility rate': 1.3305, + 'Child mortality rate': 0.83185995, + Size: 71601104 + }, + { + Country: 'Togo', + 'GDP per capita': 2124.8042, + 'Life expectancy at birth': 61.6, + 'Fertility rate': 4.2574, + 'Child mortality rate': 6.23662, + Size: 8644829 + }, + { + Country: 'Tonga', + 'GDP per capita': 6142.857, + 'Life expectancy at birth': 71, + 'Fertility rate': 3.2367, + 'Child mortality rate': 1.13757, + Size: 106034 + }, + { + Country: 'Trinidad and Tobago', + 'GDP per capita': 23037.143, + 'Life expectancy at birth': 73, + 'Fertility rate': 1.6263, + 'Child mortality rate': 1.67332, + Size: 1525671 + }, + { + Country: 'Tunisia', + 'GDP per capita': 10397.944, + 'Life expectancy at birth': 73.8, + 'Fertility rate': 2.0859, + 'Child mortality rate': 1.63162, + Size: 12262949 + }, + { + Country: 'Turkey', + 'GDP per capita': 31466.56, + 'Life expectancy at birth': 76, + 'Fertility rate': 1.8892, + 'Child mortality rate': 0.89898, + Size: 84775408 + }, + { + Country: 'Turks and Caicos Islands', + 'GDP per capita': 18512.457, + 'Life expectancy at birth': 74.6, + 'Fertility rate': 1.6691, + 'Child mortality rate': 1.41906, + Size: 45141 + }, + { + Country: 'Tuvalu', + 'GDP per capita': 4924.0273, + 'Life expectancy at birth': 64.5, + 'Fertility rate': 3.1635, + 'Child mortality rate': 2.12823, + Size: 11229 + }, + { + Country: 'Uganda', + 'GDP per capita': 2246.414, + 'Life expectancy at birth': 62.7, + 'Fertility rate': 4.5845, + 'Child mortality rate': 4.16203, + Size: 45853780 + }, + { + Country: 'Ukraine', + 'GDP per capita': 12943.614, + 'Life expectancy at birth': 71.6, + 'Fertility rate': 1.2507, + 'Child mortality rate': 0.65102, + Size: 43531424 + }, + { + Country: 'United Arab Emirates', + 'GDP per capita': 69733.8, + 'Life expectancy at birth': 78.7, + 'Fertility rate': 1.4597, + 'Child mortality rate': 0.65115, + Size: 9365149 + }, + { + Country: 'United Kingdom', + 'GDP per capita': 44978.715, + 'Life expectancy at birth': 80.7, + 'Fertility rate': 1.562, + 'Child mortality rate': 0.40983, + Size: 67281040 + }, + { + Country: 'United States', + 'GDP per capita': 63669.71, + 'Life expectancy at birth': 77.2, + 'Fertility rate': 1.6619, + 'Child mortality rate': 0.62975997, + Size: 336997632 + }, + { + Country: 'Uruguay', + 'GDP per capita': 22800.69, + 'Life expectancy at birth': 75.4, + 'Fertility rate': 1.4927, + 'Child mortality rate': 0.55899, + Size: 3426265 + }, + { + Country: 'Uzbekistan', + 'GDP per capita': 7734.8325, + 'Life expectancy at birth': 70.9, + 'Fertility rate': 2.8565, + 'Child mortality rate': 1.31621, + Size: 34081452 + }, + { + Country: 'Vanuatu', + 'GDP per capita': 2783.0195, + 'Life expectancy at birth': 70.4, + 'Fertility rate': 3.7355, + 'Child mortality rate': 2.44538, + Size: 319146 + }, + { + Country: 'Vietnam', + 'GDP per capita': 10628.219, + 'Life expectancy at birth': 73.6, + 'Fertility rate': 1.9437, + 'Child mortality rate': 2.0830798, + Size: 97468024 + }, + { + Country: 'Zambia', + 'GDP per capita': 3236.789, + 'Life expectancy at birth': 61.2, + 'Fertility rate': 4.308, + 'Child mortality rate': 5.7186003, + Size: 19473132 + }, + { + Country: 'Zimbabwe', + 'GDP per capita': 2115.1445, + 'Life expectancy at birth': 59.3, + 'Fertility rate': 3.4908, + 'Child mortality rate': 5.2148, + Size: 15993525 + }, + { + Country: 'Japan', + 'GDP per capita': 40784.383, + 'Life expectancy at birth': 84.8, + 'Fertility rate': 1.2974, + 'Child mortality rate': 0.24186, + Size: 124612528 + }, + { + Country: 'Kazakhstan', + 'GDP per capita': 26110.53, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 3.0836, + 'Child mortality rate': 0.99076, + Size: 19196468 + }, + { + Country: 'Mexico', + 'GDP per capita': 19086.105, + 'Life expectancy at birth': 70.2, + 'Fertility rate': 1.8223, + 'Child mortality rate': 1.35515, + Size: 126705136 + }, + { + Country: 'Norway', + 'GDP per capita': 65662.17, + 'Life expectancy at birth': 83.2, + 'Fertility rate': 1.5034, + 'Child mortality rate': 0.24258001, + Size: 5403021 + }, + { + Country: 'Armenia', + 'GDP per capita': 14193.117, + 'Life expectancy at birth': 72, + 'Fertility rate': 1.575, + 'Child mortality rate': 1.04387, + Size: 2790971 + }, + { + Country: 'Azerbaijan', + 'GDP per capita': 14431.661, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.6638, + 'Child mortality rate': 1.86127, + Size: 10312992 + }, + { + Country: 'Cyprus', + 'GDP per capita': 41701.703, + 'Life expectancy at birth': 81.2, + 'Fertility rate': 1.3208, + 'Child mortality rate': 0.27108, + Size: 1244193 + }, + { + Country: 'Laos', + 'GDP per capita': 7846.975, + 'Life expectancy at birth': 68.1, + 'Fertility rate': 2.4961, + 'Child mortality rate': 4.25943, + Size: 7425055 + }, + { + Country: 'Russia', + 'GDP per capita': 27960.102, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 1.4927, + 'Child mortality rate': 0.48901, + Size: 145102752 + }, + { + Country: 'Turkey', + 'GDP per capita': 31466.56, + 'Life expectancy at birth': 76, + 'Fertility rate': 1.8892, + 'Child mortality rate': 0.89898, + Size: 84775408 + }, + { + Country: 'East Timor', + 'GDP per capita': 5032.41, + 'Life expectancy at birth': 67.7, + 'Fertility rate': 3.1486, + 'Child mortality rate': 4.11491, + Size: 1320944 + }, + { + Country: 'Ecuador', + 'GDP per capita': 10668.758, + 'Life expectancy at birth': 73.7, + 'Fertility rate': 2.0256, + 'Child mortality rate': 1.24514, + Size: 17797736 + }, + { + Country: 'El Salvador', + 'GDP per capita': 9086.047, + 'Life expectancy at birth': 70.7, + 'Fertility rate': 1.8031, + 'Child mortality rate': 1.26651, + Size: 6314165 + }, + { + Country: 'Georgia', + 'GDP per capita': 15486.659, + 'Life expectancy at birth': 71.7, + 'Fertility rate': 2.0813, + 'Child mortality rate': 0.90087, + Size: 3757984 + }, + { + Country: 'Germany', + 'GDP per capita': 53179.656, + 'Life expectancy at birth': 80.6, + 'Fertility rate': 1.53, + 'Child mortality rate': 0.36256, + Size: 83408560 + }, + { + Country: 'Haiti', + 'GDP per capita': 2870.145, + 'Life expectancy at birth': 63.2, + 'Fertility rate': 2.8143, + 'Child mortality rate': 6.01092, + Size: 11447575 + }, + { + Country: 'Honduras', + 'GDP per capita': 5572.177, + 'Life expectancy at birth': 70.1, + 'Fertility rate': 2.363, + 'Child mortality rate': 1.6172899, + Size: 10278346 + }, + { + Country: 'Iran', + 'GDP per capita': 15004.6875, + 'Life expectancy at birth': 73.9, + 'Fertility rate': 1.6919, + 'Child mortality rate': 1.26375, + Size: 87923432 + }, + { + Country: 'Kazakhstan', + 'GDP per capita': 26110.53, + 'Life expectancy at birth': 69.4, + 'Fertility rate': 3.0836, + 'Child mortality rate': 0.99076, + Size: 19196468 + }, + { + Country: 'Malaysia', + 'GDP per capita': 26333.156, + 'Life expectancy at birth': 74.9, + 'Fertility rate': 1.803, + 'Child mortality rate': 0.86048, + Size: 33573872 + }, + { + Country: 'Maldives', + 'GDP per capita': 18765.217, + 'Life expectancy at birth': 79.9, + 'Fertility rate': 1.6916, + 'Child mortality rate': 0.60084, + Size: 521469 + }, + { + Country: 'Mauritania', + 'GDP per capita': 5307.522, + 'Life expectancy at birth': 64.4, + 'Fertility rate': 4.3976, + 'Child mortality rate': 6.09523, + Size: 4614981 + }, + { + Country: 'Poland', + 'GDP per capita': 34915.523, + 'Life expectancy at birth': 76.5, + 'Fertility rate': 1.4587, + 'Child mortality rate': 0.40288, + Size: 38307724 + }, + { + Country: 'Puerto Rico', + 'GDP per capita': 32632.883, + 'Life expectancy at birth': 80.2, + 'Fertility rate': 1.2925, + 'Child mortality rate': 0.75082004, + Size: 3256030 + }, + { + Country: 'Samoa', + 'GDP per capita': 5534.127, + 'Life expectancy at birth': 72.8, + 'Fertility rate': 3.9301, + 'Child mortality rate': 1.67608, + Size: 218781 + }, + { + Country: 'Serbia', + 'GDP per capita': 19831.297, + 'Life expectancy at birth': 74.2, + 'Fertility rate': 1.5278, + 'Child mortality rate': 0.5704, + Size: 7296771 + }, + { + Country: 'Switzerland', + 'GDP per capita': 71032.84, + 'Life expectancy at birth': 84, + 'Fertility rate': 1.4946, + 'Child mortality rate': 0.36673, + Size: 8691409 + }, + { + Country: 'Georgia', + 'GDP per capita': 15486.659, + 'Life expectancy at birth': 71.7, + 'Fertility rate': 2.0813, + 'Child mortality rate': 0.90087, + Size: 3757984 + } + ] + } + ], + axes: [ + { + orient: 'left', + id: 'axis-left', + type: 'linear', + label: { + autoLimit: false, + style: { + fill: '#1F2329', + fontSize: 16 + } + }, + domainLine: { + visible: true, + style: { + stroke: '#000000' + } + }, + tick: { + visible: true, + style: { + stroke: '#000000' + } + }, + grid: { + visible: false, + style: { + stroke: '#bbbfc4', + pickStrokeBuffer: 2 + } + }, + autoIndent: false, + maxWidth: null, + maxHeight: null, + visible: true + }, + { + orient: 'bottom', + id: 'axis-bottom', + type: 'linear', + label: { + autoLimit: false, + style: { + fill: '#1F2329', + fontSize: 16 + }, + formatMethod: null + }, + domainLine: { + visible: true, + style: { + stroke: '#000000' + } + }, + tick: { + visible: true, + style: { + stroke: '#000000' + } + }, + grid: { + visible: false, + style: { + stroke: '#bbbfc4', + pickStrokeBuffer: 2 + } + }, + autoIndent: false, + maxWidth: null, + maxHeight: null, + visible: true + } + ], + markLine: [ + { + endSymbol: { + visible: false + }, + startSymbol: { + visible: false + }, + label: { + visible: false + }, + line: { + style: { + stroke: '#f54a45', + lineWidth: 1, + pickStrokeBuffer: 10, + lineDash: [0, 0], + visible: true + } + }, + regionRelative: true, + positions: (data, series) => { + const points = data + .map(datum => { + const point = series.dataToPosition(datum); + return [point.x, point.y]; + }) + .sort((a, b) => a[0] - b[0]); + const regressionResult = logarithmic(points, { precision: 2 }); + return regressionResult.points.map(point => { + return { + x: point[0], + y: point[1] + }; + }); + } + } + ] +}; + +const vchart = new VChart(spec, { dom: CONTAINER_ID }); +vchart.renderSync(); + +// Just for the convenience of console debugging, DO NOT COPY! +window['vchart'] = vchart; +``` diff --git a/docs/assets/option/en/component/mark-area.md b/docs/assets/option/en/component/mark-area.md index b4ed54a582..10a04b2ca3 100644 --- a/docs/assets/option/en/component/mark-area.md +++ b/docs/assets/option/en/component/mark-area.md @@ -51,30 +51,38 @@ The boundary of the marking area on the y-axis, which together with markArea.y c {{ use: component-marker-aggregation-type() }} ### angle (string | number | function) + Since the `1.11.0` version, the reference line is on the angle axis of the polar coordinate system, and the value on the angle axis can be configured, or aggregated calculation, or self-calculation through data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. Configure the angle and angle1 properties together to draw the sector annotation area enclosed by angle and angle1 2. With the configuration of radius, radius1, angle and angle1 properties, it is used to draw the ring label range with the inner and outer radii of radius and radius1 respectively, and the angle is angle to angle1. ### radius (string | number | function) + Since the `1.11.0` version, the reference line is on the radius axis of the polar coordinate system, and the value on the radius axis can be configured, or aggregated calculations, or self-calculated through the data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. With the configuration of radius and radius1 properties, it is used to draw the annular labeling range with inner and outer radii of radius and radius1 respectively. 2. With the configuration of radius, radius1, angle and angle1 properties, it is used to draw the ring label range with the inner and outer radii of radius and radius1 respectively, and the angle is angle to angle1. ### angle1 (string | number | function) + Since the `1.11.0` version, the reference line is on the angle axis of the polar coordinate system, and the value on the angle axis can be configured, or aggregated calculation, or self-calculation through data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. Configure the angle and angle1 properties together to draw the sector annotation area enclosed by angle and angle1 2. With the configuration of radius, radius1, angle and angle1 properties, it is used to draw the ring label range with the inner and outer radii of radius and radius1 respectively, and the angle is angle to angle1. ### radius1 (string | number | function) + Since the `1.11.0` version, the reference line is on the radius axis of the polar coordinate system, and the value on the radius axis can be configured, or aggregated calculations, or self-calculated through the data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. With the configuration of radius and radius1 properties, it is used to draw the annular labeling range with inner and outer radii of radius and radius1 respectively. 2. With the configuration of radius, radius1, angle and angle1 properties, it is used to draw the ring label range with the inner and outer radii of radius and radius1 respectively, and the angle is angle to angle1. @@ -109,6 +117,7 @@ Supported since `1.7.0` version, Only takes effect when positioning using the `p ) }} ### area(Object) + The area state and style for the label area. {{ use: component-marker-state( @@ -138,7 +147,8 @@ The label position of the annotation area (the relative position of the label re Optional values: -Cartesian coordinate system: +Cartesian coordinate system: + - `'left'`: left side outside the area - `'right'`: Right outside the area - `'top'`: the upper side outside the area @@ -149,8 +159,8 @@ Cartesian coordinate system: - `'insideTop'`: the upper side inside the area - `'insideBottom'`: the lower side inside the area - Polar coordinate system: + - `'arcInnerStart'`: inside the starting point of the arc - `'arcInnerEnd'`: inside the end of the arc - `'arcInnerMiddle'`: inside the midpoint of the arc diff --git a/docs/assets/option/en/component/mark-line.md b/docs/assets/option/en/component/mark-line.md index 7d810b5c79..3af3a85c6c 100644 --- a/docs/assets/option/en/component/mark-line.md +++ b/docs/assets/option/en/component/mark-line.md @@ -88,36 +88,44 @@ Supported since `1.7.3` version, the end point of the reference line is at the e {{ use: component-marker-aggregation-type() }} ### angle (string | number | function) + Since the `1.11.0` version, the reference line is on the angle axis of the polar coordinate system, and the value on the angle axis can be configured, or aggregated calculation, or self-calculation through data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. Only declare the angle property, which is used to draw the angle axis that divides the entire polar coordinate system 2. Configure the angle, radius and radius1 properties together to draw the label line from radius to radius1 on the angle axis 3. Configure the radius, angle and angle1 properties together to draw the label line from angle to angle1 on the radius axis 4. Configure the radius, radius1, angle and angle1 properties together for marking lines in the range of radius to radius1 and angle to angle1 ### radius (string | number | function) + Since the `1.11.0` version, the reference line is on the radius axis of the polar coordinate system, and the value on the radius axis can be configured, or aggregated calculations, or self-calculated through the data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. Only declare the radius attribute, which is used to draw an entire circle with radius as a certain attribute value 2. Configure the angle, radius and radius1 properties together to draw the label line from radius to radius1 on the angle axis 3. Configure the radius, angle and angle1 properties together to draw the label line from angle to angle1 on the radius axis 4. Configure the radius, radius1, angle and angle1 properties together for marking lines in the range of radius to radius1 and angle to angle1 ### angle1 (string | number | function) + Since the `1.11.0` version, the reference line is on the angle axis of the polar coordinate system, and the value on the angle axis can be configured, or aggregated calculation, or self-calculation through data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. Only declare the angle property, which is used to draw the angle axis that divides the entire polar coordinate system 2. Configure the angle, radius and radius1 properties together to draw the label line from radius to radius1 on the angle axis 3. Configure the radius, angle and angle1 properties together to draw the label line from angle to angle1 on the radius axis 4. Configure the radius, radius1, angle and angle1 properties together for marking lines in the range of radius to radius1 and angle to angle1 ### radius1 (string | number | function) + Since the `1.11.0` version, the reference line is on the radius axis of the polar coordinate system, and the value on the radius axis can be configured, or aggregated calculations, or self-calculated through the data in the form of callbacks. ** Note that the usage scenario of this property is in the polar coordinate system: ** + 1. Only declare the radius attribute, which is used to draw an entire circle with radius as a certain attribute value 2. Configure the angle, radius and radius1 properties together to draw the label line from radius to radius1 on the angle axis 3. Configure the radius, angle and angle1 properties together to draw the label line from angle to angle1 on the radius axis @@ -222,6 +230,7 @@ The label position of the dimension line (the relative position of the label rel Optional values: Cartesian coordinate system: + - `'start'`: outside the starting point of the line - `'middle'`: midpoint of line - `'end'': outside the end point of the line @@ -233,6 +242,7 @@ Cartesian coordinate system: - `'insideEndBottom'`: the inner lower part of the line end point Polar coordinate system: + - `'arcInnerStart'`: inside the starting point of the arc - `'arcInnerEnd'`: inside the end of the arc - `'arcInnerMiddle'`: inside the midpoint of the arc diff --git a/docs/assets/option/en/component/mark-point.md b/docs/assets/option/en/component/mark-point.md index bc5334d201..32ff1f71b7 100644 --- a/docs/assets/option/en/component/mark-point.md +++ b/docs/assets/option/en/component/mark-point.md @@ -56,7 +56,8 @@ Mark target: data element. Specifies the mark area for the data point. Draw the mark area based on the specified data point. {{ use: component-marker-data-point( - prefix = '###' + prefix = '###', + isSingle = true ) }} {{ use: component-marker-data-point-offset( @@ -70,7 +71,8 @@ Mark target: coordinate point. Specifies the mark area for the coordinate point. Draw the mark area based on the specified coordinate point. {{ use: component-marker-point-like( - prefix = '###' + prefix = '###', + isSingle = true ) }} ### regionRelative(boolean) = false diff --git a/docs/assets/option/en/component/marker-common/marker-data-point.md b/docs/assets/option/en/component/marker-common/marker-data-point.md index b5e0afebf0..26c661a0a9 100644 --- a/docs/assets/option/en/component/marker-common/marker-data-point.md +++ b/docs/assets/option/en/component/marker-common/marker-data-point.md @@ -1,5 +1,35 @@ {{ target: component-marker-data-point }} +{{ if: ${isSingle} }} + +Since version 1.12.0, `coordinate` can directly configure the callback function. The data structure returned by the callback function is `IDataPointSpec`, which is consistent with the structure of the unconfigured callback, as follows: + +```ts +/** + * @param `seriesData` is the data of the associated series + * @param `series` is the associated series instance + */ +coordinate: (seriesData, series) => { + return { x: 10, y: 30 }; +}; +``` + +{{ else }} + +Since version 1.12.0, `coordinates` can directly configure the callback function, and the data structure returned by the callback function is `IDataPointSpec[]`, which is consistent with the structure of the unconfigured callback, as follows: + +```ts +/** + * @param `seriesData` is the data of the associated series + * @param `series` is the associated series instance + */ +coordinates: (seriesData, series) => { + return [{ x: 10, y: 30 }]; +}; +``` + +{{/if}} + #${prefix} [key(string | number)](string | number) Data field and data value configuration supports: diff --git a/docs/assets/option/en/component/marker-common/marker-positions.md b/docs/assets/option/en/component/marker-common/marker-positions.md index 852b8c564e..84c48f7fc8 100644 --- a/docs/assets/option/en/component/marker-common/marker-positions.md +++ b/docs/assets/option/en/component/marker-common/marker-positions.md @@ -1,5 +1,38 @@ {{ target: component-marker-point-like }} +{{ if: ${isSingle} }} + +Since version 1.12.0, `position` can directly configure the callback function. The callback function needs to return the coordinate point, as follows: + +```ts +/** + * @param `seriesData` is the data of the associated series + * @param `series` is the associated series instance + */ +position: (seriesData, series) => { + return { x: 10, y: 30 }; +}; +``` + +{{ else }} + +Since version 1.12.0, `positions` can directly configure the callback function. The callback function needs to return the coordinate point array, as follows: + +```ts +/** + * @param `seriesData` is the data of the associated series + * @param `series` is the associated series instance + */ +positions: (seriesData, series) => { + return [ + { x: 10, y: 30 }, + { x: 130, y: 30 } + ]; +}; +``` + +{{/if}} + #${prefix}x(number) x coordinate position, the number type represents the pixel value, and the string type represents the proportion relative to the canvas width or region width (from left to right). diff --git a/docs/assets/option/zh/component/mark-area.md b/docs/assets/option/zh/component/mark-area.md index 2ce70a2a95..d693cda7d3 100644 --- a/docs/assets/option/zh/component/mark-area.md +++ b/docs/assets/option/zh/component/mark-area.md @@ -51,32 +51,40 @@ y 轴上的标注区域边界,与 markArea.y 共同构造标注区域。可以 {{ use: component-marker-aggregation-type() }} ### angle(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的angle轴上,可以配置angle轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 angle 轴上,可以配置 angle 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 配合配置 angle 和 angle1属性,用于绘制由angle和angle1的围成的扇区标注区域 -2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为radius、radius1,且角度为angle到angle1的环形标注范围。 + +1. 配合配置 angle 和 angle1 属性,用于绘制由 angle 和 angle1 的围成的扇区标注区域 +2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为 radius、radius1,且角度为 angle 到 angle1 的环形标注范围。 ### radius(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的radius轴上,可以配置radius轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 radius 轴上,可以配置 radius 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 配合配置 radius 和 radius1 属性,用于绘制内外半径分别为radius、radius1的环形标注范围。 -2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为radius、radius1,且角度为angle到angle1的环形标注范围。 + +1. 配合配置 radius 和 radius1 属性,用于绘制内外半径分别为 radius、radius1 的环形标注范围。 +2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为 radius、radius1,且角度为 angle 到 angle1 的环形标注范围。 ### angle1(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的angle轴上,可以配置angle轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 angle 轴上,可以配置 angle 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 配合配置 angle 和 angle1属性,用于绘制由angle和angle1的围成的扇区标注区域 -2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为radius、radius1,且角度为angle到angle1的环形标注范围。 + +1. 配合配置 angle 和 angle1 属性,用于绘制由 angle 和 angle1 的围成的扇区标注区域 +2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为 radius、radius1,且角度为 angle 到 angle1 的环形标注范围。 ### radius1(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的radius轴上,可以配置radius轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 radius 轴上,可以配置 radius 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 配合配置 radius 和 radius1 属性,用于绘制内外半径分别为radius、radius1的环形标注范围。 -2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为radius、radius1,且角度为angle到angle1的环形标注范围。 + +1. 配合配置 radius 和 radius1 属性,用于绘制内外半径分别为 radius、radius1 的环形标注范围。 +2. 配合配置 radius, radius1, angle 和 angle1 属性,用于绘制内外半径分别为 radius、radius1,且角度为 angle 到 angle1 的环形标注范围。 ### coordinates(Array) @@ -109,6 +117,7 @@ y 轴上的标注区域边界,与 markArea.y 共同构造标注区域。可以 ) }} ### area(Object) + 标注区域的区域状态和样式。 {{ use: component-marker-state( @@ -139,6 +148,7 @@ y 轴上的标注区域边界,与 markArea.y 共同构造标注区域。可以 可选值: 直角坐标系下: + - `'left'`: 区域外部左侧 - `'right'`: 区域外部右侧 - `'top'`: 区域外部上侧 @@ -150,6 +160,7 @@ y 轴上的标注区域边界,与 markArea.y 共同构造标注区域。可以 - `'insideBottom'`: 区域内部下侧 极坐标系下: + - `'arcInnerStart'`: 弧线起点内侧 - `'arcInnerEnd'`: 弧线终点内侧 - `'arcInnerMiddle'` : 弧线中点内侧 @@ -163,9 +174,8 @@ y 轴上的标注区域边界,与 markArea.y 共同构造标注区域。可以 noMarkerRef = true ) }} - {{ use: component-marker-animation( prefix = '##', markerType = 'markArea', animationType = 'fadeIn' -) }} \ No newline at end of file +) }} diff --git a/docs/assets/option/zh/component/mark-line.md b/docs/assets/option/zh/component/mark-line.md index 1af86c68ff..94a31d7cbc 100644 --- a/docs/assets/option/zh/component/mark-line.md +++ b/docs/assets/option/zh/component/mark-line.md @@ -86,41 +86,48 @@ x 轴上的参考线。可以配置参考线在 x 轴上的值,或者聚合计 - 回调函数 ### angle(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的angle轴上,可以配置angle轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 angle 轴上,可以配置 angle 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 仅声明angle属性, 用于绘制分割整个极坐标系的angle轴 -2. 配合配置 angle,radius 和 radius1属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 + +1. 仅声明 angle 属性, 用于绘制分割整个极坐标系的 angle 轴 +2. 配合配置 angle,radius 和 radius1 属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 3. 配合配置 radius,angle 和 angle1 属性,用于在 radius 轴上绘制 angle 到 angle1 范围的标注线 -4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到radius1, angle 到 angle1 范围的标注线 +4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到 radius1, angle 到 angle1 范围的标注线 ### radius(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的radius轴上,可以配置radius轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 radius 轴上,可以配置 radius 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 仅声明radius属性, 用于绘制radius为某个属性值的整圆 -2. 配合配置 angle,radius 和 radius1属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 + +1. 仅声明 radius 属性, 用于绘制 radius 为某个属性值的整圆 +2. 配合配置 angle,radius 和 radius1 属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 3. 配合配置 radius,angle 和 angle1 属性,用于在 radius 轴上绘制 angle 到 angle1 范围的标注线 -4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到radius1, angle 到 angle1 范围的标注线 +4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到 radius1, angle 到 angle1 范围的标注线 ### angle1(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的angle轴上,可以配置angle轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 angle 轴上,可以配置 angle 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 仅声明angle属性, 用于绘制分割整个极坐标系的angle轴 -2. 配合配置 angle,radius 和 radius1属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 + +1. 仅声明 angle 属性, 用于绘制分割整个极坐标系的 angle 轴 +2. 配合配置 angle,radius 和 radius1 属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 3. 配合配置 radius,angle 和 angle1 属性,用于在 radius 轴上绘制 angle 到 angle1 范围的标注线 -4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到radius1, angle 到 angle1 范围的标注线 +4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到 radius1, angle 到 angle1 范围的标注线 ### radius1(string|number|function) -自`1.11.0`版本开始支持, 该参考线在极坐标系的radius轴上,可以配置radius轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 + +自`1.11.0`版本开始支持, 该参考线在极坐标系的 radius 轴上,可以配置 radius 轴上的值, 或者聚合计算,或者以回调的形式通过数据自行计算。 **注意该属性的使用场景为极坐标系下:** -1. 仅声明radius属性, 用于绘制radius为某个属性值的整圆 -2. 配合配置 angle,radius 和 radius1属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 -3. 配合配置 radius,angle 和 angle1 属性,用于在 radius 轴上绘制 angle 到 angle1 范围的标注线 -4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到radius1, angle 到 angle1 范围的标注线 +1. 仅声明 radius 属性, 用于绘制 radius 为某个属性值的整圆 +2. 配合配置 angle,radius 和 radius1 属性,用于在 angle 轴上绘制 radius 到 radius1 范围的标注线 +3. 配合配置 radius,angle 和 angle1 属性,用于在 radius 轴上绘制 angle 到 angle1 范围的标注线 +4. 配合配置 radius,radius1,angle 和 angle1 属性,用于在 radius 到 radius1, angle 到 angle1 范围的标注线 {{ use: component-marker-aggregation-type() }} @@ -223,6 +230,7 @@ x 轴上的参考线。可以配置参考线在 x 轴上的值,或者聚合计 可选值: 直角坐标系下: + - `'start'`: 线起点外侧 - `'middle'`: 线中点 - `'end'`: 线终点外侧 @@ -234,6 +242,7 @@ x 轴上的参考线。可以配置参考线在 x 轴上的值,或者聚合计 - `'insideEndBottom'`: 线终点内侧下部 极坐标系下: + - `'arcInnerStart'`: 弧线起点内侧 - `'arcInnerEnd'`: 弧线终点内侧 - `'arcInnerMiddle'` : 弧线中点内侧 @@ -269,4 +278,3 @@ x 轴上的参考线。可以配置参考线在 x 轴上的值,或者聚合计 markerType = 'markLine', animationType = 'clipIn | fadeIn' ) }} - diff --git a/docs/assets/option/zh/component/mark-point.md b/docs/assets/option/zh/component/mark-point.md index bba755a413..4a6cebd002 100644 --- a/docs/assets/option/zh/component/mark-point.md +++ b/docs/assets/option/zh/component/mark-point.md @@ -56,7 +56,8 @@ 指定数据点的标注区域。基于指定数据点进行标注区域的绘制。 {{ use: component-marker-data-point( - prefix = '###' + prefix = '###', + isSingle = true ) }} {{ use: component-marker-data-point-offset( @@ -70,7 +71,8 @@ 指定坐标点的标注区域。基于指定坐标点进行标注区域的绘制。 {{ use: component-marker-point-like( - prefix = '###' + prefix = '###', + isSingle = true ) }} ### regionRelative(boolean) = false diff --git a/docs/assets/option/zh/component/marker-common/marker-data-point.md b/docs/assets/option/zh/component/marker-common/marker-data-point.md index a24630dea3..eaf40db623 100644 --- a/docs/assets/option/zh/component/marker-common/marker-data-point.md +++ b/docs/assets/option/zh/component/marker-common/marker-data-point.md @@ -1,5 +1,35 @@ {{ target: component-marker-data-point }} +{{ if: ${isSingle} }} + +自 1.12.0 版本,`coordinate` 可以直接配置回调函数,回调函数返回数据结构为 `IDataPointSpec`,与未配置回调的结构一致,如下: + +```ts +/** + * @param `seriesData` 为关联系列的数据 + * @param `series` 为关联系列实例 + */ +coordinate: (seriesData, series) => { + return { x: 10, y: 30 }; +}; +``` + +{{ else }} + +自 1.12.0 版本,`coordinates` 可以直接配置回调函数,回调函数返回数据结构为 `IDataPointSpec[]`,与未配置回调的结构一致,如下: + +```ts +/** + * @param `seriesData` 为关联系列的数据 + * @param `series` 为关联系列实例 + */ +coordinates: (seriesData, series) => { + return [{ x: 10, y: 30 }]; +}; +``` + +{{/if}} + #${prefix} [key(string | number)](string | number) 数据字段及数据值配置,支持: diff --git a/docs/assets/option/zh/component/marker-common/marker-positions.md b/docs/assets/option/zh/component/marker-common/marker-positions.md index 79ccd67a5a..a4a4f2cdfb 100644 --- a/docs/assets/option/zh/component/marker-common/marker-positions.md +++ b/docs/assets/option/zh/component/marker-common/marker-positions.md @@ -1,5 +1,38 @@ {{ target: component-marker-point-like }} +{{ if: ${isSingle} }} + +自 1.12.0 版本,`position` 可以直接配置回调函数,回调函数需要返回坐标点,如下: + +```ts +/** + * @param `seriesData` 为关联系列的数据 + * @param `series` 为关联系列实例 + */ +position: (seriesData, series) => { + return { x: 10, y: 30 }; +}; +``` + +{{ else }} + +自 1.12.0 版本,`positions` 可以直接配置回调函数,回调函数需要返回坐标点数组,如下: + +```ts +/** + * @param `seriesData` 为关联系列的数据 + * @param `series` 为关联系列实例 + */ +positions: (seriesData, series) => { + return [ + { x: 10, y: 30 }, + { x: 130, y: 30 } + ]; +}; +``` + +{{/if}} + #${prefix} x(number) x 坐标位置,number 类型表示像素值,string 类型表示相对画布宽度或者 region 宽度的占比(从左往右)。 diff --git a/docs/public/vchart/preview/trend-line-1.12.0.png b/docs/public/vchart/preview/trend-line-1.12.0.png new file mode 100644 index 0000000000..abff7c3d99 Binary files /dev/null and b/docs/public/vchart/preview/trend-line-1.12.0.png differ diff --git a/packages/vchart/src/component/marker/base-marker.ts b/packages/vchart/src/component/marker/base-marker.ts index 8771f7bd63..8816c15662 100644 --- a/packages/vchart/src/component/marker/base-marker.ts +++ b/packages/vchart/src/component/marker/base-marker.ts @@ -5,22 +5,15 @@ import { array, isValid, isNil, isString, isEmpty, isArray, isEqual } from '@vis import type { IModelRenderOption, IModelSpecInfo } from '../../model/interface'; import type { IRegion } from '../../region/interface'; import type { ICartesianSeries } from '../../series/interface'; -import type { ILayoutRect, ILayoutType, IRect, StringOrNumber } from '../../typings'; +import type { CoordinateType, ILayoutRect, ILayoutType, IRect, StringOrNumber } from '../../typings'; import { BaseComponent } from '../base/base-component'; -import type { - IAggrType, - ICoordinateOption, - IDataPointSpec, - IDataPos, - IDataPosCallback, - IMarkerSpec, - IMarkerSupportSeries -} from './interface'; +import type { IAggrType, IDataPos, IDataPosCallback, IMarkerSpec, IMarkerSupportSeries } from './interface'; import type { IGraphic, IGroup } from '@visactor/vrender-core'; import { calcLayoutNumber } from '../../util/space'; import { isAggrSpec } from './utils'; import { getFirstSeries } from '../../util'; import { arrayParser } from '../../data/parser/array'; +import type { IOptionWithCoordinates } from '../../data/transforms/aggregation'; export abstract class BaseMarker extends BaseComponent { layoutType: ILayoutType | 'none' = 'none'; @@ -29,7 +22,7 @@ export abstract class BaseMarker extends BaseComponent static specKey: string; static type: string; static coordinateType: string; - coordinateType: string; + coordinateType: CoordinateType; protected _startRelativeSeries!: IMarkerSupportSeries; protected _endRelativeSeries!: IMarkerSupportSeries; @@ -145,86 +138,14 @@ export abstract class BaseMarker extends BaseComponent }; } - protected _processSpecCoo(spec: any) { - const coordinates = spec.coordinates ?? array(spec.coordinate); - let option: ICoordinateOption; - return coordinates.map((coordinate: IDataPointSpec) => { - const refRelativeSeries = this._getSeriesByIdOrIndex( - coordinate.refRelativeSeriesId, - coordinate.refRelativeSeriesIndex - ); - - if (this.coordinateType === 'cartesian') { - const { xField, yField } = refRelativeSeries.getSpec(); - const { xFieldDim, xFieldIndex, yFieldDim, yFieldIndex } = coordinate; - let bindXField = xField; - if (isValid(xFieldIndex)) { - bindXField = array(xField)[xFieldIndex]; - } - if (xFieldDim && array(xField).includes(xFieldDim)) { - bindXField = xFieldDim; - } - - let bindYField = yField; - if (isValid(yFieldIndex)) { - bindYField = array(yField)[yFieldIndex]; - } - if (yFieldDim && array(yField).includes(yFieldDim)) { - bindYField = yFieldDim; - } - - option = { - x: undefined, - y: undefined, - ...this._getAllRelativeSeries() - }; - - if (isString(coordinate[bindXField]) && isAggrSpec(coordinate[bindXField] as IDataPos)) { - option.x = { field: bindXField, aggrType: coordinate[bindXField] as IAggrType }; - } else { - option.x = array(bindXField).map(field => coordinate[field]); - } - - if (isString(coordinate[bindYField]) && isAggrSpec(coordinate[bindYField] as IDataPos)) { - option.y = { field: bindYField, aggrType: coordinate[bindYField] as IAggrType }; - } else { - option.y = array(bindYField).map(field => coordinate[field]); - } - } else if (this.coordinateType === 'polar') { - const { valueField: radiusField, categoryField: angleField } = refRelativeSeries.getSpec(); - const { angleFieldDim, angleFieldIndex } = coordinate; - let bindAngleField = angleField; - if (isValid(angleFieldIndex)) { - bindAngleField = array(angleField)[angleFieldIndex]; - } - if (angleFieldDim && array(angleField).includes(angleFieldDim)) { - bindAngleField = angleFieldDim; - } - - const bindRadiusField = radiusField; - - option = { - angle: undefined, - radius: undefined, - ...this._getAllRelativeSeries() - }; - - if (isString(coordinate[bindAngleField]) && isAggrSpec(coordinate[bindAngleField] as IDataPos)) { - option.angle = { field: bindAngleField, aggrType: coordinate[bindAngleField] as IAggrType }; - } else { - option.angle = array(bindAngleField).map(field => coordinate[field]); - } - - if (isString(coordinate[bindRadiusField]) && isAggrSpec(coordinate[bindRadiusField] as IDataPos)) { - option.radius = { field: bindRadiusField, aggrType: coordinate[bindRadiusField] as IAggrType }; - } else { - option.radius = array(bindRadiusField).map(field => coordinate[field]); - } - } - - option.getRefRelativeSeries = () => refRelativeSeries; - return option; - }); + protected _processSpecCoo(spec: any): IOptionWithCoordinates { + return { + coordinates: spec.coordinates || spec.coordinate, + ...this._getAllRelativeSeries(), + getSeriesByIdOrIndex: (seriesUserId: StringOrNumber, seriesIndex: number) => + this._getSeriesByIdOrIndex(seriesUserId, seriesIndex), + coordinateType: this.coordinateType + }; } protected _getRelativeDataView() { diff --git a/packages/vchart/src/component/marker/interface.ts b/packages/vchart/src/component/marker/interface.ts index 24698980db..67b3b3949f 100644 --- a/packages/vchart/src/component/marker/interface.ts +++ b/packages/vchart/src/component/marker/interface.ts @@ -12,7 +12,12 @@ import type { import type { IComponentSpec } from '../base/interface'; import type { Datum } from '@visactor/vrender-components'; import type { ICartesianSeries, IGeoSeries, IPolarSeries } from '../../series/interface'; -import type { IOptionAggr, IOptionAggrField, IOptionSeries } from '../../data/transforms/aggregation'; +import type { + IOptionAggr, + IOptionAggrField, + IOptionSeries, + IOptionWithCoordinates +} from '../../data/transforms/aggregation'; import type { IOptionRegr } from '../../data/transforms/regression'; export type IMarkerSupportSeries = ICartesianSeries | IPolarSeries | IGeoSeries; @@ -129,8 +134,11 @@ export type ICoordinateOption = { export type IMarkerPositionsSpec = { /** * 画布坐标 + * `positions` 自 1.12.0 版本开始支持回调函数 */ - positions: MarkerPositionPoint[]; + positions: + | MarkerPositionPoint[] + | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => MarkerPositionPoint[]); /** * 是否为相对 region 的坐标,默认为 false,即相对画布的坐标 * @default false @@ -310,7 +318,7 @@ export type IMarkerState = { export type MarkCoordinateType = 'cartesian' | 'polar' | 'geo'; export type IMarkProcessOptions = { - options: IOptionAggr[] | IOptionRegr; + options: IOptionAggr[] | IOptionRegr | IOptionWithCoordinates; needAggr?: boolean; needRegr?: boolean; processData?: DataView; diff --git a/packages/vchart/src/component/marker/mark-area/cartesian-mark-area.ts b/packages/vchart/src/component/marker/mark-area/cartesian-mark-area.ts index cc8cc987f2..f382de4602 100644 --- a/packages/vchart/src/component/marker/mark-area/cartesian-mark-area.ts +++ b/packages/vchart/src/component/marker/mark-area/cartesian-mark-area.ts @@ -1,5 +1,5 @@ import { ComponentTypeEnum } from '../../interface/type'; -import type { IOptionAggr } from '../../../data/transforms/aggregation'; +import type { IOptionAggr, IOptionWithCoordinates } from '../../../data/transforms/aggregation'; import { cartesianCoordinateLayout, getMarkAreaProcessInfo, positionLayout, xyLayout } from '../utils'; import type { MarkAreaAttrs } from '@visactor/vrender-components'; // eslint-disable-next-line no-duplicate-imports @@ -7,7 +7,7 @@ import { MarkArea as MarkAreaComponent, registerMarkAreaAnimate } from '@visacto // eslint-disable-next-line no-duplicate-imports import { isValid } from '@visactor/vutils'; import { Factory } from '../../../core/factory'; -import type { IPoint } from '../../../typings'; +import type { CoordinateType, IPoint } from '../../../typings'; import type { IMarkProcessOptions } from '../interface'; import { BaseMarkArea } from './base-mark-area'; @@ -16,7 +16,7 @@ export class CartesianMarkArea extends BaseMarkArea { type = ComponentTypeEnum.markArea; name: string = ComponentTypeEnum.markArea; static coordinateType = 'cartesian'; - coordinateType = 'cartesian'; + coordinateType = 'cartesian' as CoordinateType; protected _newMarkAreaComponent(attr: MarkAreaAttrs): MarkAreaComponent { return new MarkAreaComponent(attr); @@ -74,7 +74,7 @@ export class CartesianMarkArea extends BaseMarkArea { const spec = this._spec as any; const { doXProcess, doYProcess, doXYProcess, doCoordinatesProcess } = getMarkAreaProcessInfo(spec); - let options: IOptionAggr[]; + let options: IOptionAggr[] | IOptionWithCoordinates; if (doXYProcess) { options = [ this._processSpecByDims([ diff --git a/packages/vchart/src/component/marker/mark-area/interface/spec.ts b/packages/vchart/src/component/marker/mark-area/interface/spec.ts index 5d6c2945fd..4406874c7d 100644 --- a/packages/vchart/src/component/marker/mark-area/interface/spec.ts +++ b/packages/vchart/src/component/marker/mark-area/interface/spec.ts @@ -7,9 +7,11 @@ import type { IMarkerSpec, IDataPosCallback, IMarkerCrossSeriesSpec, - OffsetPoint + OffsetPoint, + IMarkerSupportSeries } from '../../interface'; import type { IMarkAreaTheme } from './theme'; +import type { Datum } from '../../../../typings/common'; export type IMarkArea = IComponent; @@ -127,8 +129,9 @@ export interface IMarkAreaAngleRadiusSpec extends IMarkerCrossSeriesSpec { export type IMarkAreaCoordinateSpec = { /** * 指定数据点的参考线。基于指定数据点进行参考线的绘制,可以对数据点进行数据处理 + * `coordinates` 自 1.12.0 版本开始支持回调函数 */ - coordinates: IDataPointSpec[]; + coordinates: IDataPointSpec[] | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => IDataPointSpec[]); /** * 对每个数据点转化后的画布坐标点进行偏移,该偏移值可以是像素值,也可以是 string 类型,如 '20%' 代表百分比 diff --git a/packages/vchart/src/component/marker/mark-area/polar-mark-area.ts b/packages/vchart/src/component/marker/mark-area/polar-mark-area.ts index f93230d9ad..1cc7899d04 100644 --- a/packages/vchart/src/component/marker/mark-area/polar-mark-area.ts +++ b/packages/vchart/src/component/marker/mark-area/polar-mark-area.ts @@ -1,5 +1,5 @@ import { ComponentTypeEnum } from '../../interface/type'; -import type { IOptionAggr } from '../../../data/transforms/aggregation'; +import type { IOptionAggr, IOptionWithCoordinates } from '../../../data/transforms/aggregation'; import { getMarkAreaProcessInfo, polarCoordinateLayout, polarLayout } from '../utils'; import type { MarkArcAreaAttrs, MarkAreaAttrs } from '@visactor/vrender-components'; // eslint-disable-next-line no-duplicate-imports @@ -10,7 +10,7 @@ import { registerMarkAreaAnimate } from '@visactor/vrender-components'; import { Factory } from '../../../core/factory'; -import type { IPoint, IPolarPoint } from '../../../typings'; +import type { CoordinateType, IPoint, IPolarPoint } from '../../../typings'; import type { IPolarSeries } from 'src/series'; import { BaseMarkArea } from './base-mark-area'; import type { IMarkProcessOptions } from '../interface'; @@ -21,7 +21,7 @@ export class PolarMarkArea extends BaseMarkArea { type = ComponentTypeEnum.polarMarkArea; name: string = ComponentTypeEnum.polarMarkArea; static coordinateType = 'polar'; - coordinateType = 'polar'; + coordinateType = 'polar' as CoordinateType; protected declare _markerComponent: MarkArcAreaComponent; @@ -110,7 +110,7 @@ export class PolarMarkArea extends BaseMarkArea { const spec = this._spec as any; const { doAngleProcess, doRadiusProcess, doRadAngProcess, doCoordinatesProcess } = getMarkAreaProcessInfo(spec); - let options: IOptionAggr[]; + let options: IOptionAggr[] | IOptionWithCoordinates; if (doRadAngProcess) { options = [ this._processSpecByDims([ diff --git a/packages/vchart/src/component/marker/mark-line/cartesian-mark-line.ts b/packages/vchart/src/component/marker/mark-line/cartesian-mark-line.ts index f9d0a3749d..e509f07eb4 100644 --- a/packages/vchart/src/component/marker/mark-line/cartesian-mark-line.ts +++ b/packages/vchart/src/component/marker/mark-line/cartesian-mark-line.ts @@ -1,14 +1,8 @@ import { DataView } from '@visactor/vdataset'; import type { IStepMarkLineSpec } from './interface'; import { ComponentTypeEnum } from '../../interface/type'; -import type { IOptionAggr } from '../../../data/transforms/aggregation'; -import { - computeClipRange, - cartesianCoordinateLayout, - positionLayout, - xyLayout, - getMarkLineProcessInfo -} from '../utils'; +import type { IOptionAggr, IOptionWithCoordinates } from '../../../data/transforms/aggregation'; +import { cartesianCoordinateLayout, positionLayout, xyLayout, getMarkLineProcessInfo } from '../utils'; import { type MarkLineAttrs, MarkLine as MarkLineComponent, @@ -20,7 +14,7 @@ import type { IOptionRegr } from '../../../data/transforms/regression'; import { getInsertPoints, getTextOffset } from './util'; import { Factory } from '../../../core/factory'; import { isPercent } from '../../../util'; -import type { IPoint } from '../../../typings'; +import type { CoordinateType, IPoint } from '../../../typings'; import { BaseMarkLine } from './base-mark-line'; export class CartesianMarkLine extends BaseMarkLine { @@ -28,7 +22,7 @@ export class CartesianMarkLine extends BaseMarkLine { type = ComponentTypeEnum.markLine; name: string = ComponentTypeEnum.markLine; static coordinateType = 'cartesian'; - coordinateType = 'cartesian'; + coordinateType = 'cartesian' as CoordinateType; protected declare _markerComponent: MarkLineComponent; @@ -182,7 +176,7 @@ export class CartesianMarkLine extends BaseMarkLine { } protected _computeOptions(): IMarkProcessOptions { - let options: IOptionAggr[] | IOptionRegr; + let options: IOptionAggr[] | IOptionRegr | IOptionWithCoordinates; let processData: DataView = this._getRelativeDataView(); let needAggr: boolean = true; let needRegr: boolean = false; diff --git a/packages/vchart/src/component/marker/mark-line/interface/spec.ts b/packages/vchart/src/component/marker/mark-line/interface/spec.ts index 71edea6cbb..f76ef2cda6 100644 --- a/packages/vchart/src/component/marker/mark-line/interface/spec.ts +++ b/packages/vchart/src/component/marker/mark-line/interface/spec.ts @@ -10,11 +10,12 @@ import type { IMarkerCrossSeriesSpec, OffsetPoint, MarkerStateValue, - MarkerStateCallback + MarkerStateCallback, + IMarkerSupportSeries } from '../../interface'; import type { IRegressType } from '../../mark-area/interface'; import type { IMarkLineTheme } from './theme'; -import type { ILineMarkSpec, IPoint } from '../../../../typings'; +import type { Datum, ILineMarkSpec, IPoint } from '../../../../typings'; import type { BaseMarkerAnimation, MarkCommonLineAnimationType } from '@visactor/vrender-components/es/marker/type'; export type IMarkLine = IComponent; @@ -210,8 +211,9 @@ export interface IMarkLineAngRadSpec extends IMarkerCrossSeriesSpec { export type IMarkLineCoordinateSpec = { /** * 指定数据点的参考线。基于指定数据点进行参考线的绘制,可以对数据点进行数据处理 + * `coordinates` 自 1.12.0 版本开始支持回调函数 */ - coordinates: IDataPointSpec[]; + coordinates: IDataPointSpec[] | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => IDataPointSpec[]); /** * 对每个数据点转化后的画布坐标点进行偏移,该偏移值可以是像素值,也可以是 string 类型,如 '20%' 代表百分比 * 每个元素对应一个坐标点的偏移量 @@ -275,8 +277,11 @@ export type IStepMarkLineSpec = IMarkerSpec & { | { /** * 指定数据点的参考线。基于指定数据点进行参考线的绘制,可以对数据点进行数据处理 + * `coordinates` 自 1.12.0 版本开始支持回调函数 */ - coordinates: [IDataPointSpec, IDataPointSpec]; + coordinates: + | [IDataPointSpec, IDataPointSpec] + | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => [IDataPointSpec, IDataPointSpec]); /** * 数据点的处理方法。 如果不配置则按照coordinate数组直接连接成line。 */ @@ -294,8 +299,9 @@ export type IStepMarkLineSpec = IMarkerSpec & { | { /** * 画布坐标 + * `positions` 自 1.12.0 版本开始支持回调函数 */ - positions: [IPoint, IPoint]; + positions: [IPoint, IPoint] | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => [IPoint, IPoint]); /** * 是否为相对 region 的坐标,默认为 false,即相对画布的坐标 * @default false diff --git a/packages/vchart/src/component/marker/mark-line/polar-mark-line.ts b/packages/vchart/src/component/marker/mark-line/polar-mark-line.ts index 8dbcfb87f6..bd9aa43f63 100644 --- a/packages/vchart/src/component/marker/mark-line/polar-mark-line.ts +++ b/packages/vchart/src/component/marker/mark-line/polar-mark-line.ts @@ -2,7 +2,7 @@ import type { DataView } from '@visactor/vdataset'; // eslint-disable-next-line no-duplicate-imports import { ComponentTypeEnum } from '../../interface/type'; // eslint-disable-next-line no-duplicate-imports -import type { IOptionAggr } from '../../../data/transforms/aggregation'; +import type { IOptionAggr, IOptionWithCoordinates } from '../../../data/transforms/aggregation'; import { polarLayout, getMarkLineProcessInfo, polarCoordinateLayout } from '../utils'; import type { MarkArcLineAttrs, MarkLineAttrs } from '@visactor/vrender-components'; // eslint-disable-next-line no-duplicate-imports @@ -14,7 +14,7 @@ import { } from '@visactor/vrender-components'; import type { IOptionRegr } from '../../../data/transforms/regression'; import { Factory } from '../../../core/factory'; -import type { IPoint, IPolarPoint } from '../../../typings'; +import type { CoordinateType, IPoint, IPolarPoint } from '../../../typings'; import type { IPolarSeries } from 'src/series'; import { BaseMarkLine } from './base-mark-line'; import { polarToCartesian } from '@visactor/vutils'; @@ -24,7 +24,7 @@ export class PolarMarkLine extends BaseMarkLine { type = ComponentTypeEnum.polarMarkLine; name: string = ComponentTypeEnum.polarMarkLine; static coordinateType = 'polar'; - coordinateType = 'polar'; + coordinateType = 'polar' as CoordinateType; protected declare _markerComponent: MarkArcLineComponent; @@ -118,7 +118,7 @@ export class PolarMarkLine extends BaseMarkLine { doCoordinatesProcess } = getMarkLineProcessInfo(spec); - let options: IOptionAggr[] | IOptionRegr; + let options: IOptionAggr[] | IOptionRegr | IOptionWithCoordinates; const processData: DataView = this._getRelativeDataView(); const needAggr: boolean = true; const needRegr: boolean = false; diff --git a/packages/vchart/src/component/marker/mark-point/cartesian-mark-point.ts b/packages/vchart/src/component/marker/mark-point/cartesian-mark-point.ts index 34795ae499..cc9c4f4fd1 100644 --- a/packages/vchart/src/component/marker/mark-point/cartesian-mark-point.ts +++ b/packages/vchart/src/component/marker/mark-point/cartesian-mark-point.ts @@ -1,11 +1,11 @@ import type { IMarkPointCoordinateSpec } from './interface'; import { ComponentTypeEnum } from '../../interface/type'; -import type { IOptionAggr } from '../../../data/transforms/aggregation'; +import type { IOptionAggr, IOptionWithCoordinates } from '../../../data/transforms/aggregation'; import { cartesianCoordinateLayout, getMarkPointProcessInfo, positionLayout, xyLayout } from '../utils'; import { registerMarkPointAnimate } from '@visactor/vrender-components'; import { isValid } from '@visactor/vutils'; import { Factory } from '../../../core/factory'; -import type { IPoint } from '../../../typings'; +import type { CoordinateType, IPoint } from '../../../typings'; import { BaseMarkPoint } from './base-mark-point'; import type { IMarkProcessOptions } from '../interface'; @@ -14,7 +14,7 @@ export class CartesianMarkPoint extends BaseMarkPoint { type = ComponentTypeEnum.markPoint; name: string = ComponentTypeEnum.markPoint; static coordinateType = 'cartesian'; - coordinateType = 'cartesian'; + coordinateType = 'cartesian' as CoordinateType; protected _computePointsAttr() { const spec = this._spec; @@ -48,7 +48,7 @@ export class CartesianMarkPoint extends BaseMarkPoint { const { doXYProcess } = getMarkPointProcessInfo(spec); const isCoordinateProcess = isValid(spec.coordinate); - let options: IOptionAggr[]; + let options: IOptionAggr[] | IOptionWithCoordinates; if (doXYProcess) { options = [ this._processSpecByDims([ diff --git a/packages/vchart/src/component/marker/mark-point/geo-mark-point.ts b/packages/vchart/src/component/marker/mark-point/geo-mark-point.ts index 9b515f93e5..fed1781fa0 100644 --- a/packages/vchart/src/component/marker/mark-point/geo-mark-point.ts +++ b/packages/vchart/src/component/marker/mark-point/geo-mark-point.ts @@ -3,13 +3,14 @@ import { geoLayout } from '../utils'; import { registerMarkPointAnimate } from '@visactor/vrender-components'; import { Factory } from '../../../core/factory'; import { BaseMarkPoint } from './base-mark-point'; +import type { CoordinateType } from '../../../typings'; export class GeoMarkPoint extends BaseMarkPoint { static type = ComponentTypeEnum.geoMarkPoint; type = ComponentTypeEnum.geoMarkPoint; name: string = ComponentTypeEnum.geoMarkPoint; static coordinateType: string = 'geo'; - coordinateType = 'geo'; + coordinateType = 'geo' as CoordinateType; protected _computePointsAttr() { const data = this._markerData; diff --git a/packages/vchart/src/component/marker/mark-point/interface/spec.ts b/packages/vchart/src/component/marker/mark-point/interface/spec.ts index 0750b986de..5e70c36b12 100644 --- a/packages/vchart/src/component/marker/mark-point/interface/spec.ts +++ b/packages/vchart/src/component/marker/mark-point/interface/spec.ts @@ -1,9 +1,11 @@ +import type { Datum } from '../../../../typings/common'; import type { IComponent } from '../../../interface'; import type { IDataPointSpec, IDataPos, IDataPosCallback, IMarkerSpec, + IMarkerSupportSeries, IMarkerSymbol, MarkerPositionPoint, OffsetPoint @@ -72,8 +74,9 @@ export type IMarkPointGeoNameSpec = { export type IMarkPointCoordinateSpec = { /** * 指定数据点的参考线。基于指定数据点进行参考线的绘制,可以对数据点进行数据处理 + * `coordinate` 自 1.12.0 版本开始支持回调函数 */ - coordinate: IDataPointSpec; + coordinate: IDataPointSpec | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => IDataPointSpec); /** * 对每个数据点转化后的画布坐标点进行偏移,该偏移值可以是像素值,也可以是 string 类型,如 '20%' 代表百分比 * 每个元素对应一个坐标点的偏移量 @@ -86,7 +89,10 @@ export type IMarkPointCoordinateSpec = { * 指定坐标点的参考线。基于指定坐标进行参考线的绘制 */ export type IMarkPointPositionsSpec = { - position: MarkerPositionPoint; + /** + * `position` 自 1.12.0 版本开始支持回调函数 + */ + position: MarkerPositionPoint | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => MarkerPositionPoint); /** * 是否为相对 region 的坐标,默认为 false,即相对画布的坐标 * @default false diff --git a/packages/vchart/src/component/marker/mark-point/polar-mark-point.ts b/packages/vchart/src/component/marker/mark-point/polar-mark-point.ts index 1c3594d93c..5f804e06cd 100644 --- a/packages/vchart/src/component/marker/mark-point/polar-mark-point.ts +++ b/packages/vchart/src/component/marker/mark-point/polar-mark-point.ts @@ -6,13 +6,14 @@ import { BaseMarkPoint } from './base-mark-point'; import type { IPolarSeries } from 'src/series'; import type { IMarkProcessOptions } from '../interface'; import { polarToCartesian } from '@visactor/vutils'; +import type { CoordinateType } from '../../../typings'; export class PolarMarkPoint extends BaseMarkPoint { static type = ComponentTypeEnum.polarMarkPoint; type = ComponentTypeEnum.polarMarkPoint; name: string = ComponentTypeEnum.polarMarkPoint; static coordinateType = 'polar'; - coordinateType = 'polar'; + coordinateType = 'polar' as CoordinateType; protected _computePointsAttr() { const data = this._markerData; diff --git a/packages/vchart/src/component/marker/utils.ts b/packages/vchart/src/component/marker/utils.ts index d4fadc0a06..5a312cc91d 100644 --- a/packages/vchart/src/component/marker/utils.ts +++ b/packages/vchart/src/component/marker/utils.ts @@ -390,6 +390,22 @@ export function polarCoordinateLayout(data: DataView, relativeSeries: IMarkerSup } export function positionLayout(positions: MarkerPositionPoint[], series: ISeries, regionRelative: boolean): IPoint[] { + if (isFunction(positions)) { + const userPositions = positions(series.getData().getLatestData(), series); + if (regionRelative) { + const region = series.getRegion(); + const { x: regionStartX, y: regionStartY } = region.getLayoutStartPoint(); + return userPositions.map((position: IPointLike) => { + return { + x: position.x + regionStartX, + y: position.y + regionStartY + }; + }); + } + + return userPositions; + } + if (regionRelative) { const region = series.getRegion(); const { x: regionStartX, y: regionStartY } = region.getLayoutStartPoint(); diff --git a/packages/vchart/src/data/transforms/aggregation.ts b/packages/vchart/src/data/transforms/aggregation.ts index 6f0e8f0511..801e63ead2 100644 --- a/packages/vchart/src/data/transforms/aggregation.ts +++ b/packages/vchart/src/data/transforms/aggregation.ts @@ -1,9 +1,16 @@ import type { DataView } from '@visactor/vdataset'; -import type { IAggrType, IMarkerSupportSeries } from '../../component/marker/interface'; -import type { Datum, StringOrNumber } from '../../typings'; +import type { + IAggrType, + ICoordinateOption, + IDataPointSpec, + IDataPos, + IMarkerSupportSeries +} from '../../component/marker/interface'; +import type { CoordinateType, Datum, StringOrNumber } from '../../typings'; -import { isArray, isFunction, isPlainObject, isValid } from '@visactor/vutils'; +import { array, isArray, isFunction, isPlainObject, isString, isValid } from '@visactor/vutils'; import { variance, average, min, max, sum, standardDeviation, median } from '../../util/math'; +import { isAggrSpec } from '../../component/marker/utils'; export type IOption = { field: string; @@ -40,6 +47,15 @@ export type IOptionAggr = { getRefRelativeSeries?: () => IMarkerSupportSeries; } & IOptionSeries; +export type IOptionWithCoordinates = { + coordinates: + | ((seriesData: Datum[], relativeSeries: IMarkerSupportSeries) => IDataPointSpec[] | IDataPointSpec) + | IDataPointSpec + | IDataPointSpec[]; + getSeriesByIdOrIndex: (seriesUserId: StringOrNumber, seriesIndex: number) => IMarkerSupportSeries; + coordinateType: CoordinateType; +} & IOptionSeries; + export const markerMin = (_data: Array, opt: IOption) => { const data = _data[0].latestData as Datum[]; @@ -80,7 +96,103 @@ export function markerMedian(_data: Array, opt: IOption) { return median(data, opt.field); } -export function markerAggregation(_data: Array, options: IOptionAggr[]) { +export function markerAggregation(_data: Array, options: IOptionWithCoordinates | IOptionAggr[]) { + let markerSource: IOptionAggr[]; + if ((options as IOptionWithCoordinates).coordinates) { + const { + coordinates: coordinatesInOptions, + coordinateType, + getSeriesByIdOrIndex, + ...rest + } = options as IOptionWithCoordinates; + let coordinates; + if (isFunction(coordinatesInOptions)) { + const relativeSeries = (options as IOptionWithCoordinates).getRelativeSeries(); + coordinates = coordinatesInOptions(relativeSeries.getData().getLatestData(), relativeSeries); + } else { + coordinates = coordinatesInOptions; + } + coordinates = array(coordinates); + let option: IOptionAggr; + + markerSource = coordinates.map((coordinate: IDataPointSpec) => { + const refRelativeSeries = getSeriesByIdOrIndex(coordinate.refRelativeSeriesId, coordinate.refRelativeSeriesIndex); + + if (coordinateType === 'cartesian') { + const { xField, yField } = refRelativeSeries.getSpec(); + const { xFieldDim, xFieldIndex, yFieldDim, yFieldIndex } = coordinate; + let bindXField = xField; + if (isValid(xFieldIndex)) { + bindXField = array(xField)[xFieldIndex]; + } + if (xFieldDim && array(xField).includes(xFieldDim)) { + bindXField = xFieldDim; + } + + let bindYField = yField; + if (isValid(yFieldIndex)) { + bindYField = array(yField)[yFieldIndex]; + } + if (yFieldDim && array(yField).includes(yFieldDim)) { + bindYField = yFieldDim; + } + + option = { + x: undefined, + y: undefined, + ...rest + }; + + if (isString(coordinate[bindXField]) && isAggrSpec(coordinate[bindXField] as IDataPos)) { + option.x = { field: bindXField, aggrType: coordinate[bindXField] as IAggrType }; + } else { + option.x = array(bindXField).map(field => coordinate[field]) as StringOrNumber[]; + } + + if (isString(coordinate[bindYField]) && isAggrSpec(coordinate[bindYField] as IDataPos)) { + option.y = { field: bindYField, aggrType: coordinate[bindYField] as IAggrType }; + } else { + option.y = array(bindYField).map(field => coordinate[field]) as StringOrNumber[]; + } + } else if (coordinateType === 'polar') { + const { valueField: radiusField, categoryField: angleField } = refRelativeSeries.getSpec(); + const { angleFieldDim, angleFieldIndex } = coordinate; + let bindAngleField = angleField; + if (isValid(angleFieldIndex)) { + bindAngleField = array(angleField)[angleFieldIndex]; + } + if (angleFieldDim && array(angleField).includes(angleFieldDim)) { + bindAngleField = angleFieldDim; + } + + const bindRadiusField = radiusField; + + option = { + angle: undefined, + radius: undefined, + ...rest + }; + + if (isString(coordinate[bindAngleField]) && isAggrSpec(coordinate[bindAngleField] as IDataPos)) { + option.angle = { field: bindAngleField, aggrType: coordinate[bindAngleField] as IAggrType }; + } else { + option.angle = array(bindAngleField).map(field => coordinate[field]) as StringOrNumber[]; + } + + if (isString(coordinate[bindRadiusField]) && isAggrSpec(coordinate[bindRadiusField] as IDataPos)) { + option.radius = { field: bindRadiusField, aggrType: coordinate[bindRadiusField] as IAggrType }; + } else { + option.radius = array(bindRadiusField).map(field => coordinate[field]) as StringOrNumber[]; + } + } + + option.getRefRelativeSeries = () => refRelativeSeries; + return option; + }); + } else { + markerSource = options as IOptionAggr[]; + } + const results: { x: StringOrNumber[] | StringOrNumber | IOptionCallback | null; y: StringOrNumber[] | StringOrNumber | IOptionCallback | null; @@ -88,7 +200,7 @@ export function markerAggregation(_data: Array, options: IOptionAggr[] radius: StringOrNumber[] | StringOrNumber | IOptionCallback | null; areaName: string | IOptionCallback | null; }[] = []; - options.forEach(option => { + markerSource.forEach(option => { const result: { x: StringOrNumber[] | StringOrNumber | null; y: StringOrNumber[] | StringOrNumber | null;